unityUI做自适应,h5自适应屏幕大小

文章目录固定大小UIPyQt5屏幕分辨率检测PyQt5界面适应屏幕大小，居中显示PyQt5部件QWidgets适应UI界面大小

代码已上传。 欢迎访问https://blog.csdn.net/Lavinia _ Chen 007/article/details/118606477

本文的主要出发点是开发者本人在24英寸的大屏幕上使用的是PyQt5开发的UI界面，由于使用的是固定尺寸，在用户14英寸的小屏幕上无法完全显示。

解决方案是允许UI根据屏幕分辨率自动计算适合屏幕大小的初始大小。 这意味着大小不应该固定，不仅包括接口本身的大小，还包括接口中的所有大小，而是应该根据情况进行适应性调整。

在固定大小的UI下，实现UI界面的大小和小部件的大小和位置固定的界面。

这里包含菜单栏、QListWidget和QLabel

在. resize中设置大小，在. move中设置小部件的位置。

classmainwindow(qmainwindow ) :def_init__(self ) : super ).__init__ ) self.title='固定大小ui ' self.height (self.wid=q构件(self ) self.setcentralwidget (self.wid ) setwindowtitle ) self.title ) self.set wser ) self.initImageWindow ) definitmenu ) self ) 3360 openimagefolderact=qact tion self ) openimagefolderact.set status tip 标记(“openimagefolderact.set shortcut (ctrlo ) (menubar=self.menuBar ) (文件=menubar.addmenu ) )文件) r=qlistwidget self ) self.image browser.resize (200，750 ) self.image 30 ) definitimagewindow(self ) 3: self.image 、self.image window.resize (800，750 ) self.image window.move (250，30 ) self.imagewindow.setstylesheet ) ' )获得以下效果

好像没有任何问题。

请注意，所有的大小和位置都是确定的，因此在开发过程中不会发现任何问题。 但是，如果使用者使用小画面的话，发生显示不全问题的可能性很高。

是的，下一步更改。

要适应不同的屏幕大小，首先需要知道屏幕大小。

PyQt5检测画面分辨率classmainwindow(qmainwindow ) : def _ _init_ (self ) : super )._ init _ ) self.title=显示器ect=self.desktop.screen geometry )获取self.screen height=screen width=self.screen rect.width )

self.wid = QWidget(self) self.setCentralWidget(self.wid) self.setWindowTitle(self.title) self.initUI()

添加了一段检测屏幕分辨率并打印的代码，输出为：

也就是说，在每次初始化的时候，这段代码会自动获取当前屏幕的分辨率，那么下面我们就可以根据这个结果来做想要的自适应了。

PyQt5界面自适应屏幕大小并居中显示

UI界面的宽和高，在想做自适应屏幕大小的时候，可以将其设置为屏幕宽和高的一定比例。假设都按0.7的比例来设置。

class MainWindow(QMainWindow): def __init__(self): super().__init__() self.title = "自适应屏幕大小UI" #获取显示器分辨率 self.desktop = QApplication.desktop() self.screenRect = self.desktop.screenGeometry() self.screenheight = self.screenRect.height() self.screenwidth = self.screenRect.width()self.height = int(self.screenheight * 0.7) self.width = int(self.screenwidth * 0.7) print("Screen height {}".format(self.screenheight)) print("Screen width {}".format(self.screenwidth)) self.resize(self.width,self.height) self.wid = QWidget(self) self.setCentralWidget(self.wid) self.setWindowTitle(self.title) self.initUI()

界面是按照屏幕宽和高的0.7来设置了UI界面的宽和高。但我们发现，了这时候Widgets的显示都出了问题。下面就做QWidgets的自适应。

PyQt5部件QWidgets自适UI界面大小

要实现部件自适应UI界面大小，就需要用到PyQt5的layout。
PyQt5有几种layout选择:

QHBoxLayout 将部件按照横向排列QVBoxLayout 将部件按照横向排列QGridLayout 在网格布局中排列部件QFormLayout 在两列中排列部件

个人感觉QGridLayout可定制的空间比较大，这边就选用QGridLayout。

class MainWindow(QMainWindow): def __init__(self): super().__init__() self.title = "自适应屏幕大小UI" #获取显示器分辨率 self.desktop = QApplication.desktop() self.screenRect = self.desktop.screenGeometry() self.screenheight = self.screenRect.height() self.screenwidth = self.screenRect.width() print("Screen height {}".format(self.screenheight)) print("Screen width {}".format(self.screenwidth)) self.height = int(self.screenheight * 0.7) self.width = int(self.screenwidth * 0.7) self.resize(self.width,self.height) self.wid = QWidget(self) self.setCentralWidget(self.wid) self.setWindowTitle(self.title) self.initUI() def initUI(self): self.layout = QGridLayout() #预览四个边都预留20pixs的边界 self.layout.setContentsMargins(20, 20, 20, 20) #网格之间设置10pixs的间隔 self.layout.setSpacing(10) self.initMenu() self.initBrowser() self.initImageWindow() self.statusBar().showMessage("准备就绪") self.wid.setLayout(self.layout) def initMenu(self): openImageFolderAct = QAction("打开",self) openImageFolderAct.setStatusTip("选择一个文件夹，开始标注") openImageFolderAct.setShortcut("Ctrl+O") menubar = self.menuBar() fileMenu = menubar.addMenu('&文件') fileMenu.addAction(openImageFolderAct) def initBrowser(self): self.imageBrowser = QListWidget(self) # self.imageBrowser.resize(200,750) # self.imageBrowser.move(20,30) #将imageBrowser放置到网格的第0行，第0列 self.layout.addWidget(self.imageBrowser,0,0) def initImageWindow(self): self.imageWindow = QLabel("Hello World!",self) # self.imageWindow.resize(800,750) # self.imageWindow.move(250,30) self.imageWindow.setStyleSheet("background-color: darkgray;border: 1px solid black;") #将imageBrowser放置到网格的第0行，第1列 self.layout.addWidget(self.imageWindow,0,1)

这个效果明显不是我们想要的。下面修改一下设置

def initBrowser(self): self.imageBrowser = QListWidget(self) # self.imageBrowser.resize(200,750) # self.imageBrowser.move(20,30) #设置最小的大小，还是以界面大小为基准 self.imageBrowserWidth = self.width*0.1 self.imageBrowserHeight = self.height self.imageBrowser.setMinimumSize(self.imageBrowserWidth,self.imageBrowserHeight) #将imageBrowser放置到网格的第0行，第0列 self.layout.addWidget(self.imageBrowser,0,0) def initImageWindow(self): self.imageWindow = QLabel("Hello World!",self) # self.imageWindow.resize(800,750) # self.imageWindow.move(250,30) self.imageWindow.setStyleSheet("background-color: darkgray;border: 1px solid black;") #设置最小的大小，还是以界面大小为基准 self.imageWindowWidth = self.width*0.9 self.imageWindowHeight = self.height self.imageWindow.setMinimumSize(self.imageWindowWidth,self.imageWindowHeight) #将imageBrowser放置到网格的第0行，第1列 self.layout.addWidget(self.imageWindow,0,1)

这样就能保证UI界面和里面的部件都能根据屏幕分辨率做自适应了。