PySide2值QPushButton


1.简介

QPushButton是界面中常见的按钮控件，提供按钮的功能。我们在使用时，对QPushButton关注的重点在于显示的样式和点击后执行的功能，下面就这两点进行说明。

2.样式

2.1 QPushButton的样式主要分边框、背景及字体

1
2
3
4
5
6
7
8
9
10
11
12
import sys
from PySide2.QtWidgets import QPushButton, QApplication

if __name__ == "__main__":
    app = QApplication(sys.argv)
    button = QPushButton()                     # 定义一个按钮
    button.setText("button")                   # 设置按钮显示的文字
    button.setStyleSheet("background: rgba(2,231,226,0.20);border: 3px solid blue;\
    border-radius: 25px;font-family: Microsoft YaHei;font-size: 24pt;color: #FFFFFF;")   # 设置样式    
    button.show()
   
    sys.exit(app.exec_())

这里使用setStyleSheet来设置样式，样式属性分很多种，每种用分号隔开。下面就设置项进行说明

1
2
3
4
5
6
background: rgba(2,231,226,0.20);    # 设置背景色及背景透明度，0.20为透明度
border: 3px solid blue;              # 设置边框宽度为3px, 边框线为实线，边框色为#02E7E2
border-radius: 25px;                 # 设置边框圆角为25px
font-family: Microsoft YaHei;        # 显示字体为微软雅黑
font-size: 24pt;                     # 显示字体大小24pt
color: #FFFFFF;                      # 显示字体颜色为白色

字体使用微软雅黑，这种字体是Windows系统自带的，而其他如幼圆、仿宋等字体在系统不一定存在。这在设置字体时需要注意。

2.2 QPushButton对鼠标动作的反应

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
import sys
from PySide2.QtWidgets import QPushButton, QApplication

if __name__ == "__main__":
    app = QApplication(sys.argv)
    button = QPushButton()                     # 定义一个按钮
    button.setText("button")                   # 设置按钮显示的文字
    button.setStyleSheet('''
    QPushButton{background: rgba(2,231,226,0.20);
                border: 3px solid blue;
                border-radius: 25px;
                font-family: Microsoft YaHei;
                font-size: 24pt;
                color: #FFFFFF;}
    QPushButton:pressed{background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                    stop: 0 #dadbde, stop: 1 #f6f7fa);}''')   # 设置样式    
    button.show()
   
    sys.exit(app.exec_())

这里对setStyleSheet的内容进行了扩充，''' '''内QPushButton{}是对button的设置，与2.1相同；不同之处在QPushButton:pressed{}，这里是鼠标点击按钮后，按钮的样式，使用了一个线性渐变的背景。

1
2
3
4
5
6
7
8
9
10
11
12
qlineargradient(x1: 0,    
                y1: 0,
                x2: 0,
                y2: 1,
                stop: 0 #dadbde,
                stop: 1 #f6f7fa)
#(x1, y1) 渐变起始点
#(x2, y2) 渐变结束点
#这里的起始点和结束点不是真的位置点，而是逻辑点，这里(0,0)和(0,1) 是一个垂直方向，
#表示渐变从上往下；若设置(0,0)和(1,1)就从左上角到右下角的渐变
#stop设置渐变色，这里设置一个起始点的颜色stop: 0 #dadbde和终点的颜色stop: 1 #f6f7fa
#如果还想在中间加颜色，可以设置stop: 0.5 white或stop: 0.61 blue

3.按钮点击

利用qt的信号和槽功能可以实现按钮点击后，执行相应的动作。信号即我们点击按钮后，按钮发出的信号，就像我们扇某人一耳光，被扇的人会发出哭的信号一样；槽即接收到信号后，执行的函数，这里还是以前面扇耳光的例子，如果我们扇的是一个孩子，那么孩子的爸妈接收到孩子被打的信号，爸妈会做什么，爸妈可能回送我们一耳光，也可能报警，爸妈做的事就是槽。

这个过程用代码实现

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
import sys
from PySide2.QtWidgets import QPushButton, QApplication
# 增加一个简单的类
class testSlot():
    def __init__(self):
        pass
    def test(self):
        print("test print")

if __name__ == "__main__":
    app = QApplication(sys.argv)
    button = QPushButton()                     # 定义一个按钮
    button.setText("button")                   # 设置按钮显示的文字
    button.setStyleSheet('''
    QPushButton{background: rgba(2,231,226,0.20);
                border: 3px solid blue;
                border-radius: 25px;
                font-family: Microsoft YaHei;
                font-size: 24pt;
                color: #FFFFFF;}
    QPushButton:pressed{background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                        stop: 0 #dadbde, stop: 1 #f6f7fa);}''')   # 设置样式
    testslot = testSlot()     # 创建一个类实例
    # 使用button的clicked信号连接testslot的test()函数
    # button被点击后发出clicked信号，testslot接收到此信号后执行test()
    button.clicked.connect(testslot.test)  
    button.show()
    sys.exit(app.exec_())