本文详细介绍了PyQt中图像类QPixmap, QImage, QPicture, QBitmap的使用，并通过实例展示了如何利用QSS进行UI美化，包括设置窗口背景、实现不规则窗口、设置样式、窗口透明化以及加载QSS文件等技巧。QSS的选择器、子控件和伪状态在创建美观界面中起到关键作用。"
109612499,10247036,uni-app调用外部应用：浏览器、淘宝、AppStore、QQ实战,"['uni-app', '移动开发', 'Android开发', 'iOS开发']
目录
1，图像类：QPixmap，QImage，QPicture，QBitmap
1，图像类：QPixmap，QImage，QPicture，QBitmap
PyQt中常用的图像类有四个：QPixmap，QImage，QPicture，QBitmap
--QPixmap是专门为绘图而设计的，在绘制图片时需要使用Qpixmap
--QImage提供了一个与硬件无关的图像表示函数，可以用于图片的像素级访问
--QPicture是一个绘图设备类，它继承自QPainter类，可以使用QPainter的begin（）函数在QPicture上绘图，使用end（）函数结束绘图，使用QPicture的save（）函数将Qpainter所使用过的绘图指令保存到文件中
--QBitmap是一个继承QPixmap的简单类，它提供了1bit深度的二值图像的类，QBitmap提供的单色图像，可以用来制作游标（QCursor）或者笔刷（QBrush）
'''绘图板'''
import sys
from PyQt5.QtWidgets import QApplication,QWidget,QHBoxLayout,QPushButton,QLabel,QComboBox,QStyleFactory
from PyQt5.QtWebEngineWidgets import QWebEngineView
from PyQt5.QtCore import QUrl,QObject,Qt,QPoint
from PyQt5.QtGui import QPixmap,QPainter
class GuiDemo(QWidget):
def __init__(self):
super(GuiDemo, self).__init__()
self.startPoint=QPoint()
self.endPoint = QPoint()
self.initUi()
def initUi(self):
self.setWindowTitle('demo')
self.setGeometry(300,300,500,300)
#鼠标绘图流程:1，建立Qpixmap绘图面板2，将面板加入到绘制到主界面3，定义鼠标函数和绘制函数绘制到绘图面板
self.pix=QPixmap(200,200)
self.pix.fill(Qt.white)
def paintEvent(self, QPaintEvent):#自动调用该函数
# 将画布绘制到主界面上
main_painter = QPainter(self) #必须在paintEvent中使用才有效
main_painter.drawPixmap(0, 0, self.pix)
#将图型绘制到画布上
draw_painter=QPainter(self.pix)
draw_painter.drawLine(self.startPoint,self.endPoint)
self.startPoint=self.endPoint
def mousePressEvent(self, QMouseEvent):
if QMouseEvent.button()==Qt.LeftButton:
self.startPoint=QMouseEvent.pos()
self.endPoint=self.startPoint
def mouseMoveEvent(self, QMouseEvent):
if QMouseEvent.buttons() and Qt.LeftButton:
self.endPoint=QMouseEvent.pos()
self.update()
def mouseReleaseEvent(self, QMouseEvent):
if QMouseEvent.button()==Qt.LeftButton:
self.endPoint=QMouseEvent.pos()
self.update()
if __name__=='__main__':
app=QApplication(sys.argv)
demo=GuiDemo()
demo.show()
sys.exit(app.exec_())2，QSS的UI美化
Qss是Qt的样式表，是用来自定义控件外观的一种机制，使页面美化和代码层分开，利于维护，QSS样式由两部分组成，其中一部分是选择器（selector），指定哪些控件会受到影响：另一部分是声明，指定哪些属性应该在控件上进行设置。声明部分是一系列的“属性：值”对，使用分号（；）分割不同的属性值对，使用大括号将所有的声明包括在内
QSS选择器有如下几种类型
- 通配选择器：*，匹配所有的控件
- 类型选择器：QPushButton，匹配所有的QPushButton类及其子类的实例
- 属性选择器：QPushButton[name=’mybtn’],匹配所有的name属性是mybtn的QPushButton实例
qss_style='''QPushButton[name='btn1']{background-color:black}''' btn=QPushButton('演示',self) btn.setProperty('name','btn1') self.setStyleSheet(qss_style) - 类选择器：.QPushButton，匹配所有的QPushButton实例，但是并不匹配其子类。注意前面有一个点
- ID选择器：#myButton，匹配所有的ID为myButton的控件，这里的ID实际上就是objectName指定的值
- 后代选择器：QDialog QPushButton，匹配所有QDialog容器中包含的QPushButton
-
QSS子控件
-
QSS子控件实际上也是一种选择器，其应用在一些复合控件上，典型的如QCombox。例如将下拉箭头改为图片
QSS伪状态
伪状态选择器是以冒号开头的一个选择表达式，例如：hover，表示当鼠标指针经过时的状态例如
QComboBox:hover{background-color:red}
具体有哪些伪状态可以查看帮助文档
2.1，使用QSSS设置窗口背景
设置控件背景图或图标，可以使用setPixmap或setIcon
- 使用setStyleSheet（）设置窗口背景图片
（2）使用QPalette设置背景图片时，需要考虑背景图片的尺寸，当背景图片的宽度和高度大于窗口时，会平铺，小于时会加载多个背景图片
（3）使用paintEvent设置窗口背景
2.2，不规则窗口的显示
| 函数 | 描述 |
| setMask(self,QBitmap) setMask(self,QRegion) | setMask()的作用是为调用它的控件增加一个遮罩，遮住所选区域以外的部分，使之看起来是透明的。它的参数可以为QBitmap或QRegion对象，此处调用QPixmap的mask（）函数获得图片自身的遮罩，是一个QBitmap对象，在示例中使用的是Png格式，它的透明部分实际上就是一个遮罩 |
| paintEvent（self，QpaintEvent） | 通过重载paintEvent（）函数绘制窗口背景 |
例子：
import sys
from PyQt5.QtWidgets import QApplication,QWidget
from PyQt5.QtGui import QBitmap,QPixmap,QPainter
class MaskDemo(QWidget):
def __init__(self):
super(MaskDemo, self).__init__()
self.initUI()
def initUI(self):
self.mask=QBitmap('mask.png')
#设置遮罩
self.resize(self.mask.size())
self.setMask(self.mask)
#绘制背景
def paintEvent(self,event):
back=QPixmap('back.jpg')
painter=QPainter(self)
painter.drawPixmap(0,0,self.mask.width(),self.mask.height(),back)
if __name__=='__main__':
app=QApplication(sys.argv)
demo=MaskDemo()
demo.show()
sys.exit(app.exec_())
注意：形成的窗口移动不了
2，实现可拖动和点击鼠标右键关闭窗口
首先鼠标点击事件有三个坐标（event.globalPos(),event.pos(),self.pos()）
'''
流程：获取点击点到窗口边的距离-》当鼠标拖动时，得到当前窗口的位置，进行移动
'''
import sys
from PyQt5.QtWidgets import QApplication,QWidget
from PyQt5.QtGui import QBitmap,QPixmap,QPainter,QCursor
from PyQt5.QtCore import Qt
class MaskDemo(QWidget):
def __init__(self):
super(MaskDemo, self).__init__()
self.initUI()
self.mouse_flag=False
def initUI(self):
self.mask=QBitmap('mask.png')
#设置遮罩
self.resize(self.mask.size())
self.setMask(self.mask)
#绘制背景
def paintEvent(self,event):
back=QPixmap('back.jpg')
painter=QPainter(self)
painter.drawPixmap(0,0,self.mask.width(),self.mask.height(),back)
def mousePressEvent(self,event):
if event.button()==Qt.LeftButton:
self.setCursor(QCursor(Qt.OpenHandCursor))#将鼠标切换成小手
self.mouse_flag=True #用来判断鼠标的按下与释放
#获取点击点到窗口边的距离
self.win_distance=event.globalPos()-self.pos()
if event.button()==Qt.RightButton:
self.close()
def mouseMoveEvent(self,event):
if event.button and self.mouse_flag:
#得到当前窗口的位置，进行移动
self.now_position=event.globalPos()-self.win_distance
self.move(self.now_position)
def mouseReleaseEvent(self,event):
self.mouse_flag=False
self.setCursor(QCursor(Qt.ArrowCursor))
#----------------------main---------------------------------------------
if __name__=='__main__':
app=QApplication(sys.argv)
demo=MaskDemo()
demo.show()
sys.exit(app.exec_())3，加载gif图片
'''
流程：Qmovie()读取gif ，将setmovie（）放在label上，开启movie
'''
import sys
from PyQt5.QtWidgets import QApplication,QWidget,QLabel
from PyQt5.QtGui import QBitmap,QPixmap,QPainter,QCursor,QMovie
from PyQt5.QtCore import Qt
class MaskDemo(QWidget):
def __init__(self):
super(MaskDemo, self).__init__()
self.initUI()
self.mouse_flag=False
def initUI(self):
self.setWindowTitle('demo')
label=QLabel('',self)
# 加载gif
gif=QMovie('timg.gif')
label.setMovie(gif)
gif.start()
#----------------------main---------------------------------------------
if __name__=='__main__':
app=QApplication(sys.argv)
demo=MaskDemo()
demo.show()
sys.exit(app.exec_())
2.3，设置样式
为标签和按钮添加背景图片
import sys
from PyQt5.QtWidgets import QApplication,QWidget,QLabel,QPushButton,QVBoxLayout
from PyQt5.QtGui import QBitmap,QPixmap,QPainter,QCursor
from PyQt5.QtCore import Qt
class Demo(QWidget):
def __init__(self):
super(Demo, self).__init__()
self.initUI()
def initUI(self):
self.setWindowTitle('demo')
self.setGeometry(300,300,300,200)
layout=QVBoxLayout(self)
self.label=QLabel('为label设置背景图片')
self.label.setObjectName('label1')
layout.addWidget(self.label)
self.setStyleSheet("#label1{border-image:url(back.jpg)}")
self.button=QPushButton('为按钮设置背景')
self.button.setObjectName('btn')
layout.addWidget(self.button)
qss="#btn{ border-top-left-radius:6px;border-top-right-radius:6px;border-bottom-left-radius:6px;border-bottom-right-radius:6px; background-image:url('back.jpg')}" #当border-radius无效时，使用这个方法设置圆角和背景
self.button.setStyleSheet(qss)
#----------------------main---------------------------------------------
if __name__=='__main__':
app=QApplication(sys.argv)
demo=Demo()
demo.show()
sys.exit(app.exec_())
2.4，设置窗口透明
要想实现窗口的透明效果，就要设置窗口的透明度，核心代码如下：
win=QMainWindow（）
win.setWindowOpacity(0.5)
透明度取值范围为：0.0（全透明）~1.0（不透明），默认值为1.0
2.5，加载Qss
参考文章：https://blog.csdn.net/La_vie_est_belle/article/details/83718128
from PyQt5.QtWidgets import QApplication,QWidget,QPushButton,QMainWindow
import sys
class CommonHelp():
def __init__(self):
pass
@staticmethod
def readStyle(style):
with open(style,'r') as f:
return f.read()
class ChangeStyle(QMainWindow):
def __init__(self):
super().__init__()
self.initUI()
def initUI(self):
self.setWindowTitle('change style')
self.setGeometry(300,300,300,200)
self.btn=QPushButton('改变类型',self)
self.btn.clicked.connect(self.change_style)
def change_style(self):
style='style.qss'
qss=CommonHelp.readStyle(style)
self.setStyleSheet(qss)
#--------------------main-------------------------------
if __name__=='__main__':
app=QApplication(sys.argv)
demo=ChangeStyle()
demo.show()
sys.exit(app.exec_())
style.qss代码
QPushButton{border-image:url(1.jpg);}
扫一扫
8931
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
