PyQt5的相對(duì)布局管理的實(shí)現(xiàn)
博主PyQt5新手，最近在寫一個(gè)可視化展示界面，第一個(gè)遇到的坑就是布局管理。
其實(shí)可以不用相對(duì)布局，直接用QtDesigner進(jìn)行傻瓜式的拖控件也不是不可以，高級(jí)一點(diǎn)，也可以用絕對(duì)布局，定義控件的絕對(duì)位置，就可以避免踏入這個(gè)坑了。
但是，還是建議大家，尤其是新手使用相對(duì)布局，一個(gè)感受，就是相對(duì)布局美觀整齊，控件不會(huì)亂。
寫在前面
如果大家完全初學(xué)，建議大家買本書看看，我發(fā)現(xiàn)網(wǎng)上能搜到的關(guān)于PyQt5教程都是從書上來(lái)的，而且網(wǎng)上的教程都是書本的搬運(yùn)工，少有自己的思考，比如如何活用布局，也就是這篇博文要解決的內(nèi)容。建議大家看看《PyQt5快速開發(fā)與實(shí)戰(zhàn)這本書》，總體不錯(cuò)，博主的很多解決方案都是從這本書上來(lái)。
下面是編譯環(huán)境：
- python3.7，編譯器是pycharm，特別說(shuō)明，不要用Spyder，如果只是常規(guī)的控件用Spyder沒(méi)啥問(wèn)題，但是如果你用了QWebEngineView，會(huì)讓你崩潰到懷疑人生，遇到的問(wèn)題無(wú)法解決，一度想要從入門到放棄。博主也是從matlab過(guò)來(lái)的，大愛Spyder的編譯風(fēng)格，但是建議還是趁早換了，pycharm的代碼自動(dòng)填充功能不要太爽；
- 要實(shí)現(xiàn)的功能：設(shè)置兩排橫向的按鈕，一個(gè)網(wǎng)頁(yè)展示區(qū)，和網(wǎng)頁(yè)并排展示的文本框用來(lái)展示數(shù)據(jù)，展示效果如下：
用到的包
常規(guī)包導(dǎo)入
from PyQt5.QtWidgets import * from PyQt5.QtWebEngineWidgets import QWebEngineView from PyQt5.QtCore import Qt, QUrl import sys
QWebEngineView是用來(lái)展示百度首頁(yè)的，用Spyder編譯的話，一直會(huì)報(bào)錯(cuò)，報(bào)錯(cuò)如下：
QtWebEngineWidgets must be imported before a QCoreApplication instance is created
界面生成
編寫初始化函數(shù)，代碼如下：
class MyWindow(QWidget):
def __init__(self):
super(MyWindow,self).__init__()
self.setWindowTitle('嵌套布局示例')
self.resize(1000, 800)
self.browser = QWebEngineView(self) #1
self.textEdit = QTextEdit(self) #2
self.browser_init() #3
self.layout_init() #4
#1 定義一個(gè)瀏覽器控件
#2 定義一個(gè)文本編輯框，個(gè)人用于展示網(wǎng)頁(yè)顯示的數(shù)據(jù)
#3 初始化瀏覽器設(shè)置
#4 布局設(shè)置
布局設(shè)置
不說(shuō)廢話，直接上代碼
def layout_init(self):
# 全局部件（注意參數(shù) self），用于"承載"全局布局
wwg = QWidget(self)
# 全局布局（注意參數(shù) wwg）
wl = QVBoxLayout(wwg)
hlayout1 = QHBoxLayout()
hlayout2 = QHBoxLayout()
hlayout3 = QHBoxLayout()
#vlayout = QVBoxLayout()
#glayout = QGridLayout()
#formlayout = QFormLayout()
# 局部布局添加部件（例如：按鈕）
hlayout1.setSpacing(0)
#hlayout1.addStretch(1)
hlayout1.addWidget( QPushButton(str(1)) )
#hlayout1.addStretch(1)
hlayout1.addWidget( QPushButton(str(2)) )
#hlayout1.addStretch(1)
hlayout1.addWidget( QPushButton(str(3)) )
#hlayout1.addStretch(1)
hlayout1.addWidget( QPushButton(str(4)) )
#hlayout1.addStretch(1)
hlayout2.addStretch(1)
hlayout2.addWidget( QPushButton(str(1)) )
hlayout2.addStretch(1)
hlayout2.addWidget( QPushButton(str(2)) )
hlayout2.addStretch(1)
hlayout2.addWidget( QPushButton(str(3)) )
hlayout2.addStretch(1)
hlayout2.addWidget( QPushButton(str(4)) )
hlayout2.addStretch(1)
#hlayout3.addStretch(1)
hlayout3.setSpacing(0)
hlayout3.addWidget(self.browser)
#hlayout3.addStretch(1)
hlayout3.addWidget(self.textEdit)
#hlayout3.addStretch(1)
#self.setLayout(hlayout)
#vlayout.addWidget( QPushButton(str(3)) )
#vlayout.addWidget( QPushButton(str(4)) )
#glayout.addWidget( QPushButton(str(5)) , 0, 0 )
#glayout.addWidget( QPushButton(str(6)) , 0, 1 )
#glayout.addWidget( QPushButton(str(7)) , 1, 0)
#glayout.addWidget( QPushButton(str(8)) , 1, 1)
#formlayout.addWidget( QPushButton(str(9)) )
#formlayout.addWidget( QPushButton(str(10)) )
#formlayout.addWidget( QPushButton(str(11)) )
#formlayout.addWidget( QPushButton(str(12)) )
# 這里向局部布局內(nèi)添加部件,將他加到全局布局
wl.addLayout(hlayout1)
wl.addLayout(hlayout2)
wl.addLayout(hlayout3)
#wl.addLayout(vlayout)
#wl.addLayout(glayout)
#wl.addLayout(formlayout)
self.setLayout(wl)
下面對(duì)重要代碼進(jìn)行逐行解釋：
#wwg = QWidget(self)這里定義了一個(gè)全局的布局，接下來(lái)，所有的布局都會(huì)放在這個(gè)布局里進(jìn)行設(shè)置
#wl = QVBoxLayout(wwg)這里將wwg這個(gè)全局布局設(shè)置為整體的垂直布局，接下來(lái)所有的布局都是用的垂直布局
hlayout1 = QHBoxLayout() hlayout2 = QHBoxLayout() hlayout3 = QHBoxLayout()
這里設(shè)置三個(gè)水平布局，第一個(gè)水平布局的控件設(shè)置的是按鈕，第二個(gè)也是按鈕，第三個(gè)左邊是網(wǎng)頁(yè)，右邊是文本編輯框。這三個(gè)水平布局按照整體垂直布局從上往下擺放。
下面依次給這三個(gè)水平布局添加控件：
第一個(gè)水平控件用了setSpacing(0)來(lái)設(shè)置按鈕間距，可以保證按鈕從左到右無(wú)間距的布滿整個(gè)橫排；
第二個(gè)水平控件用了addStretch(1)按比例來(lái)分配設(shè)置控件后的剩余控件，大家可以看最前面的兩排按鈕的區(qū)別；
第三個(gè)水平控件因?yàn)橄胍獊?lái)放置網(wǎng)頁(yè)和文本框，所以盡量要布滿界面，所以用的是setSpacing(0)進(jìn)行間距設(shè)置。
接下來(lái)就是將這三個(gè)水平布局添加到整體的垂直布局中去了，用如下的方式：
wl.addLayout(hlayout1) wl.addLayout(hlayout2) wl.addLayout(hlayout3)
self.setLayout(wl)這句代碼很關(guān)鍵，書上沒(méi)有，它的作用是將窗口本身設(shè)置為全局布局，如果不寫，效果如下：
browser設(shè)置默認(rèn)展示百度首頁(yè)
我寫了個(gè)函數(shù)，當(dāng)然也可以直接寫在__init__(self)中，不過(guò)為了便于理解，建議大家還是寫函數(shù)
def browser_init(self):
self.browser.load(QUrl('https://baidu.com'))
結(jié)果展示
是不是以為已經(jīng)寫完了，圖樣圖森破，看看展示成什么鬼樣子了
這是什么鬼，為啥左邊百度首頁(yè)展示就這么窄一點(diǎn)點(diǎn)區(qū)域，完全不是想要的樣子好嗎。。。
于是博主一番網(wǎng)上搜索操作，在__init__(self)初始化函數(shù)中添加了這么一句代碼：
self.textEdit.setFixedWidth(200)
這句代碼的作用是將右側(cè)的文本框設(shè)置寬度為200，這樣就可以了，展示效果就是最上面那張圖，如此簡(jiǎn)單啊。。
學(xué)會(huì)布局后，就可以隨心所欲的添加自己想要的控件了，也完全不用擔(dān)心美工UI設(shè)計(jì)出來(lái)的花里胡哨的東西了。
當(dāng)然，博主的開發(fā)工作要比這個(gè)界面復(fù)雜得多，遇到的坑遠(yuǎn)不止這個(gè)布局設(shè)置，待相關(guān)開發(fā)完成后，再一一介紹。
完整代碼
最后照舊上完整代碼
# -*- coding: utf-8 -*-
"""
Created on Wed Apr 10 08:52:37 2020
@author: HG
"""
from PyQt5.QtWidgets import *
from PyQt5.QtWebEngineWidgets import QWebEngineView
from PyQt5.QtCore import Qt, QUrl
import sys
class MyWindow(QWidget):
def __init__(self):
super(MyWindow,self).__init__()
self.setWindowTitle('嵌套布局示例')
self.resize(1000, 800)
self.browser = QWebEngineView(self)
self.textEdit = QTextEdit(self)
self.browser_init()
self.layout_init()
self.textEdit.setFixedWidth(200)
def layout_init(self):
# 全局部件（注意參數(shù) self），用于"承載"全局布局
wwg = QWidget(self)
# 全局布局（注意參數(shù) wwg）
wl = QVBoxLayout(wwg)
hlayout1 = QHBoxLayout()
hlayout2 = QHBoxLayout()
hlayout3 = QHBoxLayout()
#vlayout = QVBoxLayout()
#glayout = QGridLayout()
#formlayout = QFormLayout()
# 局部布局添加部件（例如：按鈕）
hlayout1.setSpacing(0)
#hlayout1.addStretch(1)
hlayout1.addWidget( QPushButton(str(1)) )
#hlayout1.addStretch(1)
hlayout1.addWidget( QPushButton(str(2)) )
#hlayout1.addStretch(1)
hlayout1.addWidget( QPushButton(str(3)) )
#hlayout1.addStretch(1)
hlayout1.addWidget( QPushButton(str(4)) )
#hlayout1.addStretch(1)
hlayout2.addStretch(1)
hlayout2.addWidget( QPushButton(str(1)) )
hlayout2.addStretch(1)
hlayout2.addWidget( QPushButton(str(2)) )
hlayout2.addStretch(1)
hlayout2.addWidget( QPushButton(str(3)) )
hlayout2.addStretch(1)
hlayout2.addWidget( QPushButton(str(4)) )
hlayout2.addStretch(1)
#hlayout3.addStretch(1)
hlayout3.setSpacing(0)
hlayout3.addWidget(self.browser)
#hlayout3.addStretch(1)
hlayout3.addWidget(self.textEdit)
#hlayout3.addStretch(1)
#self.setLayout(hlayout)
#vlayout.addWidget( QPushButton(str(3)) )
#vlayout.addWidget( QPushButton(str(4)) )
#glayout.addWidget( QPushButton(str(5)) , 0, 0 )
#glayout.addWidget( QPushButton(str(6)) , 0, 1 )
#glayout.addWidget( QPushButton(str(7)) , 1, 0)
#glayout.addWidget( QPushButton(str(8)) , 1, 1)
#formlayout.addWidget( QPushButton(str(9)) )
#formlayout.addWidget( QPushButton(str(10)) )
#formlayout.addWidget( QPushButton(str(11)) )
#formlayout.addWidget( QPushButton(str(12)) )
# 這里向局部布局內(nèi)添加部件,將他加到全局布局
wl.addLayout(hlayout1)
wl.addLayout(hlayout2)
wl.addLayout(hlayout3)
#wl.addLayout(vlayout)
#wl.addLayout(glayout)
#wl.addLayout(formlayout)
self.setLayout(wl)
def browser_init(self):
self.browser.load(QUrl('https://baidu.com'))
if __name__=="__main__":
app = QApplication(sys.argv)
win = MyWindow()
win.show()
sys.exit(app.exec_())
到此這篇關(guān)于PyQt5的相對(duì)布局管理的實(shí)現(xiàn)的文章就介紹到這了,更多相關(guān)PyQt5 相對(duì)布局內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了如何用Python制作計(jì)算器，文章中有兩個(gè)版本，代碼詳細(xì)，適合絕大部分朋友，如果你對(duì)python如何制作計(jì)算器有興趣,可以參考下這篇文章2021-04-04
Python實(shí)現(xiàn)分割文件及合并文件的方法
這篇文章主要介紹了Python實(shí)現(xiàn)分割文件及合并文件的方法,涉及Python針對(duì)文件的分割與合并操作相關(guān)技巧,通過(guò)自定義函數(shù)split與join實(shí)現(xiàn)了文件的分割與合并操作,需要的朋友可以參考下2015-07-07
python3實(shí)現(xiàn)帶多張圖片、附件的郵件發(fā)送
這篇文章主要為大家詳細(xì)介紹了python3實(shí)現(xiàn)帶多張圖片、附件的郵件發(fā)送，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-08-08
這篇文章主要介紹了spyder快捷鍵與python符號(hào)化輸出方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-02-02
這篇文章主要給大家介紹了關(guān)于Python中os模塊的簡(jiǎn)單使用及重命名操作的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-04-04
django使用admin站點(diǎn)上傳圖片的實(shí)例
今天小編就為大家分享一篇django使用admin站點(diǎn)上傳圖片的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-07-07
python3獲取文件中url內(nèi)容并下載代碼實(shí)例
這篇文章主要介紹了python3獲取文件中url內(nèi)容并下載代碼實(shí)例,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-12-12
這篇文章主要介紹了Python socket編程,以實(shí)例形式較為詳細(xì)的分析了Python中socket模塊的使用技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-05-05
pytorch制作自己的LMDB數(shù)據(jù)操作示例
這篇文章主要介紹了pytorch制作自己的LMDB數(shù)據(jù)操作,結(jié)合實(shí)例形式分析了pytorch使用lmdb的相關(guān)操作技巧與使用注意事項(xiàng),需要的朋友可以參考下2019-12-12
簡(jiǎn)單了解python反射機(jī)制的一些知識(shí)
這篇文章主要介紹了簡(jiǎn)單了解python反射機(jī)制的一些知識(shí)，反射機(jī)制就是在運(yùn)行時(shí)，動(dòng)態(tài)的確定對(duì)象的類型，并可以通過(guò)字符串調(diào)用對(duì)象屬性、方法、導(dǎo)入模塊，是一種基于字符串的事件驅(qū)動(dòng)。,需要的朋友可以參考下2019-07-07