• PyQt5快速开发与实战 8.4 设置窗口背景 && 8.5 不规则窗口的显示


    PyQt5快速开发与实战

    8. 第8章 PyQt5 图形和特效

    8.4 设置窗口背景

    窗口背景主要包括:背景色和背景图片。设置窗口背景主要有三种方法:

    • 使用QSS设置窗口背景。
    • 使用QPalette设置窗口背景。
    • 实现paintEvent,使用QPainter绘制背景。
    8.4.1 使用QSS设置窗口背景

    在QSS中,可以使用background或者background-color的方式来设置背景色。设置窗口背景色之后,子控件默认会继承父窗口的背景色。如果想要为控件设置背景图片或图标,则可以使用setPixmap或者setIcon来完成。

    1. 使用setStyleSheet()设置窗口背景图片

      import sys
      from PyQt5.QtWidgets import QMainWindow , QApplication
      from pyqt5_plugins.examples.exampleqmlitem import QtCore
      QtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)
      app = QApplication(sys.argv)
      win = QMainWindow()
      win.setWindowTitle("界面背景图片设置")
      win.resize(350,  250)
      win.setObjectName("MainWindow")
      win.setStyleSheet("#MainWindow{border-image:url(./images/python.jpg);}")
      #win.setStyleSheet("#MainWindow{background-color: yellow}")
      win.show()
      sys.exit(app.exec_())
      
      • 1
      • 2
      • 3
      • 4
      • 5
      • 6
      • 7
      • 8
      • 9
      • 10
      • 11
      • 12
      • 13

      在这里插入图片描述

    2. 使用setStyleSheet()设置窗口背景色

      在这里插入图片描述

    8.4.2 使用QPalette设置窗口背景
    1. 使用QPalette(调色板)设置窗口背景色

      from PyQt5.QtWidgets import QApplication,  QLabel  ,QWidget, QVBoxLayout , QPushButton, QMainWindow
      from PyQt5.QtGui import QPalette , QBrush , QPixmap
      from PyQt5.QtCore import Qt
      import sys
      from pyqt5_plugins.examples.exampleqmlitem import QtCore
      
      QtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)
      app = QApplication(sys.argv)
      win = QMainWindow()
      win.setWindowTitle("界面背景颜色设置")
      win.resize(350,  250)  
      palette    = QPalette()
      palette.setColor(QPalette.Background   , Qt.red )
      win.setPalette(palette)
      win.show()
      sys.exit(app.exec_())
      
      • 1
      • 2
      • 3
      • 4
      • 5
      • 6
      • 7
      • 8
      • 9
      • 10
      • 11
      • 12
      • 13
      • 14
      • 15
      • 16

      在这里插入图片描述

    2. 使用QPalette设置窗口背景图片

      import sys
      from PyQt5.QtWidgets import QMainWindow , QApplication
      from PyQt5.QtGui import QPalette , QBrush , QPixmap
      
      from pyqt5_plugins.examples.exampleqmlitem import QtCore
      QtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)
      app = QApplication(sys.argv)
      win = QMainWindow()
      win.setWindowTitle("界面背景图片设置")
      palette    = QPalette()
      palette.setBrush(QPalette.Background,QBrush(QPixmap("./images/python.jpg")))
      win.setPalette(palette)
      #当背景图片的宽度和高度大于窗口的宽度和高度时
      # win.resize(460,  255 )
      #当背景图片的宽度和高度小于窗口的宽度和高度时
      win.resize(800,  600 )
      win.show()
      sys.exit(app.exec_())
      
      • 1
      • 2
      • 3
      • 4
      • 5
      • 6
      • 7
      • 8
      • 9
      • 10
      • 11
      • 12
      • 13
      • 14
      • 15
      • 16
      • 17
      • 18

      当使用QPalette设置背景图片时,需要考虑背景图片的尺寸,当背景图片的宽度和高度大于窗口的宽度和高度时,背景图片将会平铺整个背景;当背景图片的宽度和高度小于窗口的宽度和高度时,则会加载多个背景图片。

      当背景图片的宽度和高度大于窗口的宽度和高度时

      在这里插入图片描述

      当背景图片的宽度和高度小于窗口的宽度和高度时

      在这里插入图片描述

    8.4.3 使用paintEvent设置窗口背景
    1. 使用paintEvent设置窗口背景色

      import sys
      from PyQt5.QtWidgets import QApplication, QWidget
      from PyQt5.QtGui import QPainter
      from PyQt5.QtCore import Qt
      
      from pyqt5_plugins.examples.exampleqmlitem import QtCore
      QtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)
      class Winform(QWidget):
          def __init__(self, parent=None):
              super(Winform, self).__init__(parent)
              self.setWindowTitle("paintEvent设置背景颜色")
      
          def paintEvent(self, event):
              painter = QPainter(self)
              painter.setBrush(Qt.yellow);
              # 设置背景颜色
              painter.drawRect(self.rect());
      
      
      if __name__ == "__main__":
          app = QApplication(sys.argv)
          form = Winform()
          form.show()
          sys.exit(app.exec_())
      
      • 1
      • 2
      • 3
      • 4
      • 5
      • 6
      • 7
      • 8
      • 9
      • 10
      • 11
      • 12
      • 13
      • 14
      • 15
      • 16
      • 17
      • 18
      • 19
      • 20
      • 21
      • 22
      • 23
      • 24

      在这里插入图片描述

    2. 使用paintEvent设置窗口背景图片

      import sys
      from PyQt5.QtWidgets import QApplication, QWidget
      from PyQt5.QtGui import QPixmap, QPainter
      from pyqt5_plugins.examples.exampleqmlitem import QtCore
      QtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)
      class Winform(QWidget):
          def __init__(self, parent=None):
              super(Winform, self).__init__(parent)
              self.setWindowTitle("paintEvent设置背景图片")
      
          def paintEvent(self, event):
              painter = QPainter(self)
              pixmap = QPixmap("./images/screen1.jpg")
              # 绘制窗口背景,平铺到整个窗口,随着窗口改变而改变
              painter.drawPixmap(self.rect(), pixmap)
      
      
      if __name__ == "__main__":
          app = QApplication(sys.argv)
          form = Winform()
          form.show()
          sys.exit(app.exec_())
      
      • 1
      • 2
      • 3
      • 4
      • 5
      • 6
      • 7
      • 8
      • 9
      • 10
      • 11
      • 12
      • 13
      • 14
      • 15
      • 16
      • 17
      • 18
      • 19
      • 20
      • 21
      • 22

      在这里插入图片描述

    8.5 不规则窗口的显示

    QWidget类中比较重要的绘图函数:

    函数描述
    setMask(self , QBitmap);setMask(self , QRegion)setMask0的作用是为调用它的控件增加一个遮罩,遮住所选区域以外的部分,使之看起来是透明的。它的参数可以为QBitmap 或 QRegion对象,此处调用QPixmap的 mask()函数获得图片自身的遮罩,是一个 QBitmap对象。在示例中使用的是 PNG格式的图片,它的透明部分实际上就是一个遮罩
    paintEvent(self , QPaintEvent)通过重载paintEvent()函数绘制窗口背景
    1. 实现不规则窗口的最简单方式就是图片素材既当遮罩层又当背景图片,通过重载paintEvent()函数绘制窗口背景。

      import sys
      from PyQt5.QtWidgets import QApplication, QWidget
      from PyQt5.QtGui import QPixmap, QPainter, QBitmap
      
      
      class Winform(QWidget):
          def __init__(self, parent=None):
              super(Winform, self).__init__(parent)
              self.setWindowTitle("不规则窗体的实现例子")
              self.resize(600, 400)
      
          def paintEvent(self, event):
              painter = QPainter(self)
              painter.drawPixmap(0, 0, 280, 390, QPixmap(r"./images/dog.jpg"))
              painter.drawPixmap(300, 0, 280, 390, QBitmap(r"./images/dog.jpg"))
      
      
      if __name__ == "__main__":
          app = QApplication(sys.argv)
          form = Winform()
          form.show()
          sys.exit(app.exec_())
      
      • 1
      • 2
      • 3
      • 4
      • 5
      • 6
      • 7
      • 8
      • 9
      • 10
      • 11
      • 12
      • 13
      • 14
      • 15
      • 16
      • 17
      • 18
      • 19
      • 20
      • 21
      • 22

      在这里插入图片描述

    2. 使用一张遮罩层图片来控制窗口的大小,然后再利用paintEvent()函数重绘窗口的背景图。

      import sys
      from PyQt5.QtWidgets import QApplication, QWidget
      from PyQt5.QtGui import QPixmap, QPainter, QBitmap
      
      
      class Winform(QWidget):
          def __init__(self, parent=None):
              super(Winform, self).__init__(parent)
              self.setWindowTitle("不规则窗体的实现例子")
      
              self.pix = QBitmap("./images/mask.png")
              self.resize(self.pix.size())
              self.setMask(self.pix)
      
          def paintEvent(self, event):
              painter = QPainter(self)
              # 在指定区域直接绘制窗口背景
              painter.drawPixmap(0, 0, self.pix.width(), self.pix.height(), QPixmap("./images/screen1.jpg"))
          # 绘制窗口背景,平铺到整个窗口,随着窗口改变而改变
          # painter.drawPixmap(0,0,self.width(),self.height(),QPixmap("./images/screen1.jpg"))
      
      
      if __name__ == "__main__":
          from pyqt5_plugins.examples.exampleqmlitem import QtCore
          QtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)
          app = QApplication(sys.argv)
          form = Winform()
          form.show()
          sys.exit(app.exec_())
      
      • 1
      • 2
      • 3
      • 4
      • 5
      • 6
      • 7
      • 8
      • 9
      • 10
      • 11
      • 12
      • 13
      • 14
      • 15
      • 16
      • 17
      • 18
      • 19
      • 20
      • 21
      • 22
      • 23
      • 24
      • 25
      • 26
      • 27
      • 28
      • 29

      在这里插入图片描述

    8.5.1 不规则窗口实现动画效果
    1. pixmap.setMask()函数的作用是为调用它的控件增加一个遮罩,遮住所选区域以外的部分,使控件看起来是透明的。它的参数可以是一个QBitmap对象或一个QRegion对象。

    2. paintEvent()函数每次初始化窗口时只调用一次,所以每加载一次图片就重新调用一次paintEvent()函数,即在更新窗口时调用这个函数。

    案例

    import sys
    from PyQt5.QtWidgets import QApplication, QWidget
    from PyQt5.QtGui import QPixmap, QPainter, QCursor
    from PyQt5.QtCore import Qt, QTimer
    
    
    class ShapeWidget(QWidget):
        def __init__(self, parent=None):
            super(ShapeWidget, self).__init__(parent)
            self.i = 1
            self.mypix()
            self.timer = QTimer()
            self.timer.setInterval(500)  # 500毫秒
            self.timer.timeout.connect(self.timeChange)
            self.timer.start()
    
        # 显示不规则 pic
        def mypix(self):
            self.update()
            if self.i == 5:
                self.i = 1
            self.mypic = {1: './images/left.png', 2: "./images/up.png", 3: './images/right.png', 4: './images/down.png'}
            self.pix = QPixmap(self.mypic[self.i], "0", Qt.AvoidDither | Qt.ThresholdDither | Qt.ThresholdAlphaDither)
            self.resize(self.pix.size())
            self.setMask(self.pix.mask())
            self.dragPosition = None
    
        def mousePressEvent(self, event):
            if event.button() == Qt.LeftButton:
                self.m_drag = True
                self.m_DragPosition = event.globalPos() - self.pos()
                event.accept()
                self.setCursor(QCursor(Qt.OpenHandCursor))
    
        def mouseMoveEvent(self, QMouseEvent):
            if Qt.LeftButton and self.m_drag:
                self.move(QMouseEvent.globalPos() - self.m_DragPosition)
                QMouseEvent.accept()
    
        def mouseReleaseEvent(self, QMouseEvent):
            self.m_drag = False
            self.setCursor(QCursor(Qt.ArrowCursor))
    
        def paintEvent(self, event):
            painter = QPainter(self)
            painter.drawPixmap(0, 0, self.pix.width(), self.pix.height(), self.pix)
    
        # 鼠标双击事件
        def mouseDoubleClickEvent(self, event):
            if event.button() == 1:
                self.i += 1
                self.mypix()
    
        # 每500毫秒修改paint
        def timeChange(self):
            self.i += 1
            self.mypix()
    
    
    if __name__ == '__main__':
        from pyqt5_plugins.examples.exampleqmlitem import QtCore
        QtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)
        app = QApplication(sys.argv)
        form = ShapeWidget()
        form.show()
        sys.exit(app.exec_())
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66

    在这里插入图片描述

    8.5.2 加载GIF动画效果

    案例

    import sys
    from PyQt5.QtWidgets import QApplication,  QLabel  ,QWidget
    from PyQt5.QtCore import Qt
    from PyQt5.QtGui import QMovie
    
    class LoadingGifWin( QWidget):
        def __init__(self,parent=None):
            super(LoadingGifWin, self).__init__(parent)
            self.label =  QLabel('', self)
            self.setFixedSize(128,128)
            self.setWindowFlags( Qt.Dialog| Qt.CustomizeWindowHint)
            self.movie =  QMovie("./images/loading.gif")
            self.label.setMovie(self.movie)
            self.movie.start()
    
    if __name__ == '__main__':
        from pyqt5_plugins.examples.exampleqmlitem import QtCore
        QtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)
        app =  QApplication(sys.argv)
        loadingGitWin = LoadingGifWin()
        loadingGitWin.show()
        sys.exit(app.exec_())
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22

    在这里插入图片描述

  • 相关阅读:
    在Linux系统中搜索当前路径及其子目录下所有PDF文件中是否包含特定字符串
    高颜值markdown解析器:粘贴复制代码即可用(不用编译打包)
    【系统稳定性 - 测试】2.2 谈谈Monkey老化测试场景的ANR问题分析
    git 报错Failed to connect to github.com port 443 after 21224 ms: Timed out 解决办法
    计算机等级考试Python二级
    MongoDB游标
    Nginx安装
    【1161. 最大层内元素和】
    Linux 中的 cpp 命令及示例
    IDEA 导入 spring 源码
  • 原文地址:https://blog.csdn.net/weixin_44226181/article/details/126069350