国产 无码 综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

pyqt5優(yōu)化美化界面代碼

這篇具有很好參考價(jià)值的文章主要介紹了pyqt5優(yōu)化美化界面代碼。希望對(duì)大家有所幫助。如果存在錯(cuò)誤或未考慮完全的地方,請(qǐng)大家不吝賜教,您也可以點(diǎn)擊"舉報(bào)違法"按鈕提交疑問。


前言

自用的pyqt5界面優(yōu)化美化代碼,方便自己寫界面時(shí)復(fù)制,也順便造福廣大網(wǎng)友吧!

首先安裝基礎(chǔ)工具:
Pycharm配置QtDesigner(PyUIC、PyRcc)

并懂得如何規(guī)范化創(chuàng)建qt界面:
QtDesigner規(guī)范創(chuàng)建應(yīng)用界面

文章將持續(xù)更新.......


一、QtDesigner內(nèi)的編程(QSS)

1. 按鈕變化

#pushButton_create_user{
	
	background-color: rgb(0, 0, 0);
	color: rgb(255, 255, 255);
	border: 3px solid rgb(0,0,0);
	border-radius:10px
}
#pushButton_create_user:hover{
	
	color: rgb(0, 0, 0);
	background-color: rgb(255, 255, 255);
}
#pushButton_create_user:pressed{
	padding-top:5px;
	padding-left:5px
}

鼠標(biāo)不置于其上效果:
pyqt5優(yōu)化美化界面代碼

鼠標(biāo)置于其上但不點(diǎn)擊效果:
pyqt5優(yōu)化美化界面代碼
點(diǎn)擊效果(字體往右下角移動(dòng)5px):
pyqt5優(yōu)化美化界面代碼

2.邊框和圓角

border:2px solid rgb(186,186,186);
border-radius:10px

效果:
pyqt5優(yōu)化美化界面代碼

3.無邊框和按住指令

#pushButton_login{
	border:none;
}
#pushButton_login:focus{
	color:rgb(186,186,186);
}

按住效果:
pyqt5優(yōu)化美化界面代碼
松開效果:

pyqt5優(yōu)化美化界面代碼

4.指定圓角和插入圖片(拉伸和堆疊)

border-image: url(:/images/001.jpg);
border-top-left-radius:30px;
border-bottom-left-radius:30px

效果:
pyqt5優(yōu)化美化界面代碼

background-image: url(:/images/001.jpg);
border-top-left-radius:30px;
border-bottom-left-radius:30px

pyqt5優(yōu)化美化界面代碼

5.只有下劃線的透明輸入框

border:none;
border-bottom: 5px solid rgba(0,0,0,255);
background-color: rgba(0,0,0,0);

效果:
pyqt5優(yōu)化美化界面代碼


6.下拉菜單自定義格式

這個(gè)分為兩個(gè)部分:

1. 表面框的編寫

#comboBox_project{
	border-radius:11px;
	background-color: rgb(184, 184, 184);
	color: rgb(56,56,56);
}
#comboBox_project:hover{
	border-radius:0px;
	background-color: rgb(184, 184, 184);
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	border-bottom-right-radius:10px;
	color: rgb(56,56,56);
}
#comboBox_project::drop-down{
	border-top-right-radius:5px;
	border-bottom-right-radius:5px;
	background-color: rgb(40, 40, 40);
	color: rgb(40,40,40);
	min-width:30px;
}
#comboBox_project::down-arrow{
	image: url(:/icons/arrow-down-filling.png);
	height:18px;
	width:18px;
}

效果:
pyqt5優(yōu)化美化界面代碼
鼠標(biāo)放上去后效果:
pyqt5優(yōu)化美化界面代碼

2.下拉內(nèi)容框的編寫

重點(diǎn):下拉內(nèi)容框的編輯,因?yàn)橹挥肣T表達(dá)式編輯是沒有效果的,所以生成UI后必須要在py文件內(nèi)加上這段。

		self.newlist = QtWidgets.QListWidget()
        self.comboBox_project.setModel(self.newlist.model())
        self.comboBox_project.setView(self.newlist)

pyqt5優(yōu)化美化界面代碼

表達(dá)式:

#comboBox_project QAbstractItemView{
	font-size:20px;
	font-weight:bold;
}
#comboBox_project QAbstractItemView::item{
	color: rgb(40, 40, 40);
	height:30px;
    selection-color: rgb(186,186,186);
    background-color:rgb(80, 80, 80);
}

效果:
pyqt5優(yōu)化美化界面代碼


7.自用QSS(不做任何說明)

界面效果:
pyqt5優(yōu)化美化界面代碼

# 1
QLabel{
	border-radius:4px;
	background-color: rgb(80, 80, 80);
	font: 20pt "微軟雅黑";
	font-weight:bold;
	color: rgb(187,187,187);
}
QSlider::handle:horizontal{
	background-color: rgb(80, 80, 80);
}
# 2
QPushButton{
	border-radius:5px;
	font: 14pt "微軟雅黑";
	font-weight:bold;
	border:3px solid rgb(184,184,184);
	background-color: rgb(184, 184, 184);
	color: rgb(56,56,56);
}
QPushButton:hover{
	border-radius:5px;
	color: rgb(184, 184, 184);
	background-color: rgb(56,56,56);
}
QPushButton:pressed{
	padding-top:5px;
	padding-left:5px;
}
# 3
#widget_status{
	background-color: rgb(83, 83, 83);
	border-top-left-radius:10px;
	border-top-right-radius:10px;
}
#label_title{
	color: rgb(183, 183, 183);
	font: 25pt "微軟雅黑";
	font-weight:bold;
}
# 4
#comboBox_project{
	border-radius:11px;
	background-color: rgb(184, 184, 184);
	color: rgb(56,56,56);
	font: 15pt "微軟雅黑";
	font-weight:bold;
}
#comboBox_project:hover{
	border-radius:0px;
	background-color: rgb(184, 184, 184);
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	border-bottom-right-radius:10px;
	color: rgb(56,56,56);
}
#comboBox_project::drop-down{
	border-top-right-radius:5px;
	border-bottom-right-radius:5px;
	background-color: rgb(40, 40, 40);
	color: rgb(40,40,40);
	min-width:30px;
}
#comboBox_project::down-arrow{
	image: url(:/icons/arrow-down-filling.png);
	height:18px;
	width:18px;
}
#comboBox_project QAbstractItemView{
	font: 15pt "微軟雅黑";
	font-weight:bold;
}
#comboBox_project QAbstractItemView::item{
	color: rgb(40, 40, 40);
	height:30px;
    selection-color: rgb(186,186,186);
    background-color:rgb(80, 80, 80);
}




二、py文件內(nèi)的編程

1.創(chuàng)建無邊框效果

MainWindow.setWindowFlags(QtCore.Qt.FramelessWindowHint)
MainWindow.setAttribute(QtCore.Qt.WA_TranslucentBackground)

添加至開頭:

pyqt5優(yōu)化美化界面代碼

效果(結(jié)合2的圖片來看):
pyqt5優(yōu)化美化界面代碼


2.創(chuàng)建陰影效果

self.label.setGraphicsEffect(QtWidgets.QGraphicsDropShadowEffect(blurRadius=25, xOffset=0, yOffset=0))
self.pushButton_login.setGraphicsEffect(QtWidgets.QGraphicsDropShadowEffect(blurRadius=25, xOffset=3, yOffset=3))

添加至末尾:
pyqt5優(yōu)化美化界面代碼

效果:
pyqt5優(yōu)化美化界面代碼


3.無邊框拖動(dòng)效果(全界面均可)

    def __init__(self):   # 在初始化方法中設(shè)定m_flag為false
        super().__init__()
		self.m_flag = False

    def mousePressEvent(self, event):
        if event.button() == QtCore.Qt.LeftButton and self.isMaximized() == False:
            self.m_flag = True
            self.m_position = event.globalPos() - self.pos()
            event.accept()
            self.setCursor(QtGui.QCursor(QtCore.Qt.OpenHandCursor))

    def mouseMoveEvent(self, mouse_event):
        if QtCore.Qt.LeftButton and self.m_flag:
            self.move(mouse_event.globalPos() - self.m_position)
            mouse_event.accept()

    def mouseReleaseEvent(self, mouse_event):
        self.m_flag = False
        self.setCursor(QtGui.QCursor(QtCore.Qt.ArrowCursor))

添加至調(diào)用類的設(shè)定中:

pyqt5優(yōu)化美化界面代碼

效果(無按鈕和框的位置都可以進(jìn)行長(zhǎng)按移動(dòng)):

pyqt5優(yōu)化美化界面代碼

?。?!注意:若是初始化方法沒有定義m_flag為False,直接拖動(dòng)窗口內(nèi)的按鈕,程序?qū)?huì)因?yàn)槿鄙賛_flag參數(shù)而崩潰

pyqt5優(yōu)化美化界面代碼


4.無邊框的最大化

首先先規(guī)范創(chuàng)建可自由變化的UI,不規(guī)范化創(chuàng)建,縮放必定有問題。

參考:QtDesigner規(guī)范創(chuàng)建應(yīng)用界面

代碼分兩部分:

self.ui.pushButton_resize.clicked.connect(self.resize_win)

pyqt5優(yōu)化美化界面代碼
放置于類ui調(diào)用后。

    def resize_win(self):
        if self.isMaximized():
            self.showNormal()
            self.ui.pushButton_resize.setIcon(QtGui.QIcon(":/icons/fullscreen-expand.png"))
        else:
            self.showMaximized()
            self.ui.pushButton_resize.setIcon(QtGui.QIcon(":/icons/fullscreen-shrink.png"))

pyqt5優(yōu)化美化界面代碼
放置于類方法函數(shù)即可。

效果:
pyqt5優(yōu)化美化界面代碼
pyqt5優(yōu)化美化界面代碼


5.滑動(dòng)條顯示數(shù)值

使用到了horizontalSlider和QLabel。

分為兩塊,都添加于PyUIC生成的UI文件中:

self.horizontalSlider_hole.valueChanged.connect(self.sl_value_hole)

用ctrl+F快速尋找控件位置然后添加:
pyqt5優(yōu)化美化界面代碼

    def sl_value_hole(self):
            sl1 = self.horizontalSlider_hole.value()
            sl2 = ' ' + str(sl1) + '%'
            self.label_percent_hole.setText(sl2)

這個(gè)函數(shù)添加到末尾即可。
pyqt5優(yōu)化美化界面代碼

效果:

pyqt5優(yōu)化美化界面代碼


6.點(diǎn)擊QLabel變化事件

在PyUIC生成的py文件內(nèi)添加:

class MyQLabel(QtWidgets.QLabel):
        # 自定義信號(hào), 注意信號(hào)必須為類屬性
        button_clicked_signal = QtCore.pyqtSignal(int)

        def __init__(self, parent=None):
            super(MyQLabel, self).__init__(parent)
            self.i = 0

        def mouseReleaseEvent(self, QMouseEvent):
                self.i += 1
                self.button_clicked_signal.emit(self.i)

        # 可在外部與槽函數(shù)連接
        def connect_customized_slot(self, func):
                self.button_clicked_signal.connect(func)

pyqt5優(yōu)化美化界面代碼

ctrl+F迅速找到你要改的QLabel控件:

self.label = MyQLabel(self.widget)
self.label.connect_customized_slot(self.change_text)

pyqt5優(yōu)化美化界面代碼

在py最后(類方法)編寫你要實(shí)現(xiàn)的函數(shù),如我的,點(diǎn)擊后更改文字:

    def change_text(self, flag):
        if flag % 2 == 1:
                _translate = QtCore.QCoreApplication.translate
                font = QtGui.QFont()
                font.setFamily("微軟雅黑")
                font.setPointSize(18)
                self.label.setFont(font)
                self.label.setText(_translate("MainWindow", "Design By LJK"))
        else:
                _translate = QtCore.QCoreApplication.translate
                font = QtGui.QFont()
                font.setFamily("微軟雅黑")
                font.setPointSize(35)
                font.setBold(False)
                font.setItalic(False)
                font.setWeight(9)
                self.label.setFont(font)
                self.label.setText(_translate("MainWindow", "APMH 2022"))

pyqt5優(yōu)化美化界面代碼

效果:

pyqt5優(yōu)化美化界面代碼


7.雙擊標(biāo)題欄放大窗口,只有拖動(dòng)標(biāo)題欄才能移動(dòng)窗口

重新定義Widget,放置于PyUIC生成的py文件中:

from PyQt5 import QtCore, QtGui, QtWidgets
from PyQt5.QtWidgets import QApplication, QWidget, QHBoxLayout, QStyleOption, QStyle
from PyQt5.QtGui import QPainter
from PyQt5.QtCore import pyqtSignal


# 定義標(biāo)題欄
class MyWidget(QtWidgets.QWidget):
    signal_resize = pyqtSignal(int)
    signal_move = pyqtSignal(int, str)

    def __init__(self, parent=None):
        super(MyWidget, self).__init__(parent)
        self.setObjectName('widget_status')
        self.db = 0
        self.m_flag = False

    # 重寫paintEvent 否則不能使用樣式表定義外觀
    def paintEvent(self, evt):
        opt = QStyleOption()
        opt.initFrom(self)
        painter = QPainter(self)
        # 反鋸齒
        painter.setRenderHint(QPainter.Antialiasing)
        self.style().drawPrimitive(QStyle.PE_Widget, opt, painter, self)

    def mouseDoubleClickEvent(self, a0: QtGui.QMouseEvent) -> None:
        self.db = 1
        self.signal_resize.emit(self.db)

    def mousePressEvent(self, event):
        if event.button() == QtCore.Qt.LeftButton and self.isMaximized() == False:
            self.m_flag = True
            self.m_position = event.pos()
            event.accept()
            self.setCursor(QtGui.QCursor(QtCore.Qt.OpenHandCursor))

    def mouseMoveEvent(self, QMouseEvent):
        if QtCore.Qt.LeftButton and self.m_flag:
            self.move_pos = QMouseEvent.globalPos() - self.m_position
            self.move_pos = str(self.move_pos)
            QMouseEvent.accept()
            # 判斷鼠標(biāo)位置切換鼠標(biāo)手勢(shì)
            self.signal_move.emit(1, self.move_pos)

    def mouseReleaseEvent(self, QMouseEvent):
        self.m_flag = False
        self.setCursor(QtGui.QCursor(QtCore.Qt.ArrowCursor))

然后更改你的標(biāo)題欄widget為MyWidget。
pyqt5優(yōu)化美化界面代碼

與新寫的mainwindow類進(jìn)行對(duì)接,寫在類初始化方法內(nèi):

        self.ui.widget_status.signal_resize.connect(self.resize_db)
        self.ui.widget_status.signal_move.connect(self.move_lf)

pyqt5優(yōu)化美化界面代碼

將以下寫入mainwindow的類方法內(nèi):

    def move_lf(self, flag, m_pos):
        move_pos = m_pos
        str_pos = move_pos[20:].split(', ')
        int_x_pos = int(str_pos[0])
        int_y_pos = int(str_pos[1][:-1])
        if flag == 1:
            self.move(QPoint(int_x_pos, int_y_pos))
            
    def resize_win(self):
        if self.isMaximized():
            self.showNormal()
            self.ui.pushButton_resize.setIcon(QtGui.QIcon(":/icons/fullscreen-expand.png"))
        else:
            self.showMaximized()
            self.ui.pushButton_resize.setIcon(QtGui.QIcon(":/icons/fullscreen-shrink.png"))

    def resize_db(self, flag):
        if flag == 1:
            self.resize_win()

效果:

pyqt5優(yōu)化美化界面代碼


8.根據(jù)屏幕尺寸設(shè)置打開時(shí)窗口大小

因?yàn)槌绦蛞萌ゲ煌碾娔X,屏幕分辨率會(huì)有差別,故而需要自適應(yīng)調(diào)整:

        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.5)   # 這里改變比例
        self.width = int(self.screenwidth * 0.5)
        print("Screen height {}".format(self.screenheight))
        print("Screen width {}".format(self.screenwidth))
        self.resize(self.width, self.height)

放置于重寫類的setupUi后:
pyqt5優(yōu)化美化界面代碼
效果:
(效果會(huì)局限于你縮寫的控件最小大?。?br>pyqt5優(yōu)化美化界面代碼

pyqt5優(yōu)化美化界面代碼

9.自由拉伸無邊框應(yīng)用的尺寸

先看效果:

pyqt5優(yōu)化美化界面代碼

首先還是先規(guī)范化創(chuàng)建窗口并打開MouseTracking:點(diǎn)擊查看教程

寫入mainwindow初始化方法中:

self._padding = 7  # 設(shè)置邊界寬度為7
self.initDrag()

寫入mainwindow類方法:

    def initDrag(self):
        # 設(shè)置鼠標(biāo)跟蹤判斷扳機(jī)默認(rèn)值,可以直接寫入初始化方法中
        self._move_drag = False
        self._corner_drag = False
        self._bottom_drag = False
        self._right_drag = False

    def mousePressEvent(self, event):
        # 重寫鼠標(biāo)點(diǎn)擊的事件
        if (event.button() == Qt.LeftButton) and (event.pos() in self._corner_rect):
            # 鼠標(biāo)左鍵點(diǎn)擊右下角邊界區(qū)域
            self._corner_drag = True
            event.accept()
        elif (event.button() == Qt.LeftButton) and (event.pos() in self._right_rect):
            # 鼠標(biāo)左鍵點(diǎn)擊右側(cè)邊界區(qū)域
            self._right_drag = True
            event.accept()
        elif (event.button() == Qt.LeftButton) and (event.pos() in self._bottom_rect):
            # 鼠標(biāo)左鍵點(diǎn)擊下側(cè)邊界區(qū)域
            self._bottom_drag = True
            event.accept()
            
    def mouseMoveEvent(self, QMouseEvent):
        # 判斷鼠標(biāo)位置切換鼠標(biāo)手勢(shì)
        if QMouseEvent.pos() in self._corner_rect:
            self.setCursor(Qt.SizeFDiagCursor)
        elif QMouseEvent.pos() in self._bottom_rect:
            self.setCursor(Qt.SizeVerCursor)
        elif QMouseEvent.pos() in self._right_rect:
            self.setCursor(Qt.SizeHorCursor)
        else:
            self.setCursor(Qt.ArrowCursor)
        # 當(dāng)鼠標(biāo)左鍵點(diǎn)擊不放及滿足點(diǎn)擊區(qū)域的要求后,分別實(shí)現(xiàn)不同的窗口調(diào)整
        if Qt.LeftButton and self._right_drag:
            # 右側(cè)調(diào)整窗口寬度
            self.resize(QMouseEvent.pos().x(), self.height())
            QMouseEvent.accept()
        elif Qt.LeftButton and self._bottom_drag:
            # 下側(cè)調(diào)整窗口高度
            self.resize(self.width(), QMouseEvent.pos().y())
            QMouseEvent.accept()
        elif Qt.LeftButton and self._corner_drag:
            # 右下角同時(shí)調(diào)整高度和寬度
            self.resize(QMouseEvent.pos().x(), QMouseEvent.pos().y())
            QMouseEvent.accept()
        elif Qt.LeftButton and self._move_drag:
            # 標(biāo)題欄拖放窗口位置
            self.move_lf(QMouseEvent.globalPos() - self.move_DragPosition)
            QMouseEvent.accept()

    def mouseReleaseEvent(self, QMouseEvent):
        self._move_drag = False
        self._corner_drag = False
        self._bottom_drag = False
        self._right_drag = False

10.創(chuàng)建圖標(biāo)

參考自:PyQt5 設(shè)置軟件圖標(biāo)(左上角、任務(wù)欄)、軟件主窗口標(biāo)題

from PyQt5.QtGui import QIcon
import ctypes
ctypes.windll.shell32.SetCurrentProcessExplicitAppUserModelID("myappid")


class WinMain(QMainWindow):
    def __init__(self):
        super().__init__()
        self.ui = Ui_MainWindow()
        self.ui.setupUi(self)
		self.setWindowIcon(QIcon("./ICON.png"))
		self.setWindowTitle(_translate("MainWindow", "expressionRecognition"))    #第二個(gè)參數(shù):窗口標(biāo)題

效果:
任務(wù)欄上:

pyqt5優(yōu)化美化界面代碼文章來源地址http://www.zghlxwxcb.cn/news/detail-435348.html

到了這里,關(guān)于pyqt5優(yōu)化美化界面代碼的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!

本文來自互聯(lián)網(wǎng)用戶投稿,該文觀點(diǎn)僅代表作者本人,不代表本站立場(chǎng)。本站僅提供信息存儲(chǔ)空間服務(wù),不擁有所有權(quán),不承擔(dān)相關(guān)法律責(zé)任。如若轉(zhuǎn)載,請(qǐng)注明出處: 如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實(shí)不符,請(qǐng)點(diǎn)擊違法舉報(bào)進(jìn)行投訴反饋,一經(jīng)查實(shí),立即刪除!

領(lǐng)支付寶紅包贊助服務(wù)器費(fèi)用

相關(guān)文章

覺得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請(qǐng)作者喝杯咖啡吧~博客贊助

支付寶掃一掃領(lǐng)取紅包,優(yōu)惠每天領(lǐng)

二維碼1

領(lǐng)取紅包

二維碼2

領(lǐng)紅包