MainWindow ._pyqt5按钮事件">
当前位置:   article > 正文

PyQt5 按钮Button 添加事件(信号/槽)_pyqt5按钮事件

pyqt5按钮事件

本文基于PyQt5 按钮Buttons样式设计,针对按钮添加响应的点击事件触发。

效果截图:

PyQt 模型设计:

 PyQt 设计器截图:

*.UI 源码

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <ui version="4.0">
  3. <class>MainWindow</class>
  4. <widget class="QMainWindow" name="MainWindow">
  5. <property name="geometry">
  6. <rect>
  7. <x>0</x>
  8. <y>0</y>
  9. <width>800</width>
  10. <height>600</height>
  11. </rect>
  12. </property>
  13. <property name="windowTitle">
  14. <string>MainWindow</string>
  15. </property>
  16. <widget class="QWidget" name="centralwidget">
  17. <widget class="QWidget" name="horizontalLayoutWidget">
  18. <property name="geometry">
  19. <rect>
  20. <x>20</x>
  21. <y>30</y>
  22. <width>478</width>
  23. <height>80</height>
  24. </rect>
  25. </property>
  26. <layout class="QHBoxLayout" name="horizontalLayout">
  27. <item>
  28. <widget class="QPushButton" name="pushButton_5">
  29. <property name="minimumSize">
  30. <size>
  31. <width>0</width>
  32. <height>48</height>
  33. </size>
  34. </property>
  35. <property name="text">
  36. <string>PushButton</string>
  37. </property>
  38. </widget>
  39. </item>
  40. <item>
  41. <widget class="QPushButton" name="pushButton_4">
  42. <property name="minimumSize">
  43. <size>
  44. <width>0</width>
  45. <height>48</height>
  46. </size>
  47. </property>
  48. <property name="text">
  49. <string>PushButton</string>
  50. </property>
  51. </widget>
  52. </item>
  53. <item>
  54. <widget class="QPushButton" name="pushButton_3">
  55. <property name="minimumSize">
  56. <size>
  57. <width>0</width>
  58. <height>48</height>
  59. </size>
  60. </property>
  61. <property name="text">
  62. <string>PushButton</string>
  63. </property>
  64. </widget>
  65. </item>
  66. <item>
  67. <widget class="QPushButton" name="pushButton_2">
  68. <property name="minimumSize">
  69. <size>
  70. <width>0</width>
  71. <height>48</height>
  72. </size>
  73. </property>
  74. <property name="text">
  75. <string>PushButton</string>
  76. </property>
  77. </widget>
  78. </item>
  79. <item>
  80. <widget class="QPushButton" name="pushButton">
  81. <property name="minimumSize">
  82. <size>
  83. <width>0</width>
  84. <height>48</height>
  85. </size>
  86. </property>
  87. <property name="text">
  88. <string>PushButton</string>
  89. </property>
  90. </widget>
  91. </item>
  92. </layout>
  93. </widget>
  94. <widget class="QWidget" name="horizontalLayoutWidget_2">
  95. <property name="geometry">
  96. <rect>
  97. <x>20</x>
  98. <y>110</y>
  99. <width>478</width>
  100. <height>80</height>
  101. </rect>
  102. </property>
  103. <layout class="QHBoxLayout" name="horizontalLayout_2">
  104. <item>
  105. <widget class="QPlainTextEdit" name="plainTextEdit"/>
  106. </item>
  107. </layout>
  108. </widget>
  109. </widget>
  110. </widget>
  111. <resources/>
  112. <connections>
  113. <connection>
  114. <sender>pushButton</sender>
  115. <signal>clicked()</signal>
  116. <receiver>plainTextEdit</receiver>
  117. <slot>zoomIn()</slot>
  118. <hints>
  119. <hint type="sourcelabel">
  120. <x>362</x>
  121. <y>39</y>
  122. </hint>
  123. <hint type="destinationlabel">
  124. <x>258</x>
  125. <y>149</y>
  126. </hint>
  127. </hints>
  128. </connection>
  129. <connection>
  130. <sender>pushButton_2</sender>
  131. <signal>clicked()</signal>
  132. <receiver>plainTextEdit</receiver>
  133. <slot>zoomIn()</slot>
  134. <hints>
  135. <hint type="sourcelabel">
  136. <x>355</x>
  137. <y>69</y>
  138. </hint>
  139. <hint type="destinationlabel">
  140. <x>258</x>
  141. <y>149</y>
  142. </hint>
  143. </hints>
  144. </connection>
  145. <connection>
  146. <sender>pushButton_3</sender>
  147. <signal>clicked()</signal>
  148. <receiver>plainTextEdit</receiver>
  149. <slot>zoomIn()</slot>
  150. <hints>
  151. <hint type="sourcelabel">
  152. <x>258</x>
  153. <y>69</y>
  154. </hint>
  155. <hint type="destinationlabel">
  156. <x>258</x>
  157. <y>149</y>
  158. </hint>
  159. </hints>
  160. </connection>
  161. <connection>
  162. <sender>pushButton_4</sender>
  163. <signal>clicked()</signal>
  164. <receiver>plainTextEdit</receiver>
  165. <slot>zoomIn()</slot>
  166. <hints>
  167. <hint type="sourcelabel">
  168. <x>162</x>
  169. <y>69</y>
  170. </hint>
  171. <hint type="destinationlabel">
  172. <x>258</x>
  173. <y>149</y>
  174. </hint>
  175. </hints>
  176. </connection>
  177. <connection>
  178. <sender>pushButton_5</sender>
  179. <signal>clicked()</signal>
  180. <receiver>plainTextEdit</receiver>
  181. <slot>zoomIn()</slot>
  182. <hints>
  183. <hint type="sourcelabel">
  184. <x>65</x>
  185. <y>69</y>
  186. </hint>
  187. <hint type="destinationlabel">
  188. <x>258</x>
  189. <y>149</y>
  190. </hint>
  191. </hints>
  192. </connection>
  193. </connections>
  194. </ui>

*.UI 源码 转换为*.py

  1. # -*- coding: utf-8 -*-
  2. # Form implementation generated from reading ui file 'untitled2.ui'
  3. #
  4. # Created by: PyQt5 UI code generator 5.15.4
  5. #
  6. # WARNING: Any manual changes made to this file will be lost when pyuic5 is
  7. # run again. Do not edit this file unless you know what you are doing.
  8. import sys
  9. from PyQt5 import QtCore, QtGui, QtWidgets
  10. from PyQt5.QtWidgets import QApplication, QMainWindow
  11. StyleSheet = """
  12. /*这里是通用设置,所有按钮都有效,不过后面的可以覆盖这个*/
  13. QPushButton {
  14. border: none; /*去掉边框*/
  15. }
  16. /*
  17. QPushButton#xxx
  18. 或者
  19. #xx
  20. 都表示通过设置的objectName来指定
  21. */
  22. QPushButton#pushButton {
  23. background-color: #f44336; /*背景颜色*/
  24. }
  25. #pushButton:hover {
  26. background-color: #e57373; /*鼠标悬停时背景颜色*/
  27. }
  28. /*注意pressed一定要放在hover的后面,否则没有效果*/
  29. #pushButton:pressed {
  30. background-color: #ffcdd2; /*鼠标按下不放时背景颜色*/
  31. }
  32. #pushButton_2 {
  33. background-color: #4caf50;
  34. border-radius: 5px; /*圆角*/
  35. }
  36. #pushButton_2:hover {
  37. background-color: #81c784;
  38. }
  39. #pushButton_2:pressed {
  40. background-color: #c8e6c9;
  41. }
  42. #pushButton_3 {
  43. background-color: #2196f3;
  44. /*限制最小最大尺寸*/
  45. min-width: 96px;
  46. max-width: 96px;
  47. min-height: 96px;
  48. max-height: 96px;
  49. border-radius: 48px; /*圆形*/
  50. }
  51. #pushButton_3:hover {
  52. background-color: #64b5f6;
  53. }
  54. #pushButton_3:pressed {
  55. background-color: #bbdefb;
  56. }
  57. #pushButton_4 {
  58. max-height: 48px;
  59. border-top-right-radius: 20px; /*右上角圆角*/
  60. border-bottom-left-radius: 20px; /*左下角圆角*/
  61. background-color: #ff9800;
  62. }
  63. #pushButton_4:hover {
  64. background-color: #ffb74d;
  65. }
  66. #pushButton_4:pressed {
  67. background-color: #ffe0b2;
  68. }
  69. /*根据文字内容来区分按钮,同理还可以根据其它属性来区分*/
  70. #pushButton_5 {
  71. color: white; /*文字颜色*/
  72. background-color: #9c27b0;
  73. }
  74. """
  75. class Ui_MainWindow(object):
  76. def setupUi(self, MainWindow):
  77. MainWindow.setObjectName("MainWindow")
  78. MainWindow.resize(800, 600)
  79. self.centralwidget = QtWidgets.QWidget(MainWindow)
  80. self.centralwidget.setObjectName("centralwidget")
  81. self.horizontalLayoutWidget = QtWidgets.QWidget(self.centralwidget)
  82. self.horizontalLayoutWidget.setGeometry(QtCore.QRect(20, 30, 478, 80))
  83. self.horizontalLayoutWidget.setObjectName("horizontalLayoutWidget")
  84. self.horizontalLayout = QtWidgets.QHBoxLayout(self.horizontalLayoutWidget)
  85. self.horizontalLayout.setContentsMargins(0, 0, 0, 0)
  86. self.horizontalLayout.setObjectName("horizontalLayout")
  87. self.pushButton_5 = QtWidgets.QPushButton(self.horizontalLayoutWidget)
  88. self.pushButton_5.setMinimumSize(QtCore.QSize(0, 48))
  89. self.pushButton_5.setObjectName("pushButton_5")
  90. self.horizontalLayout.addWidget(self.pushButton_5)
  91. self.pushButton_4 = QtWidgets.QPushButton(self.horizontalLayoutWidget)
  92. self.pushButton_4.setMinimumSize(QtCore.QSize(0, 48))
  93. self.pushButton_4.setObjectName("pushButton_4")
  94. self.horizontalLayout.addWidget(self.pushButton_4)
  95. self.pushButton_3 = QtWidgets.QPushButton(self.horizontalLayoutWidget)
  96. self.pushButton_3.setMinimumSize(QtCore.QSize(0, 48))
  97. self.pushButton_3.setObjectName("pushButton_3")
  98. self.horizontalLayout.addWidget(self.pushButton_3)
  99. self.pushButton_2 = QtWidgets.QPushButton(self.horizontalLayoutWidget)
  100. self.pushButton_2.setMinimumSize(QtCore.QSize(0, 48))
  101. self.pushButton_2.setObjectName("pushButton_2")
  102. self.horizontalLayout.addWidget(self.pushButton_2)
  103. self.pushButton = QtWidgets.QPushButton(self.horizontalLayoutWidget)
  104. self.pushButton.setMinimumSize(QtCore.QSize(0, 48))
  105. self.pushButton.setObjectName("pushButton")
  106. self.horizontalLayout.addWidget(self.pushButton)
  107. self.horizontalLayoutWidget_2 = QtWidgets.QWidget(self.centralwidget)
  108. self.horizontalLayoutWidget_2.setGeometry(QtCore.QRect(20, 110, 478, 80))
  109. self.horizontalLayoutWidget_2.setObjectName("horizontalLayoutWidget_2")
  110. self.horizontalLayout_2 = QtWidgets.QHBoxLayout(self.horizontalLayoutWidget_2)
  111. self.horizontalLayout_2.setContentsMargins(0, 0, 0, 0)
  112. self.horizontalLayout_2.setObjectName("horizontalLayout_2")
  113. self.plainTextEdit = QtWidgets.QPlainTextEdit(self.horizontalLayoutWidget_2)
  114. self.plainTextEdit.setObjectName("plainTextEdit")
  115. self.horizontalLayout_2.addWidget(self.plainTextEdit)
  116. MainWindow.setCentralWidget(self.centralwidget)
  117. self.retranslateUi(MainWindow)
  118. # Qt Designer 设计器自动生成相关事件代码(信号/槽)
  119. # self.pushButton.clicked.connect(self.plainTextEdit.zoomIn)
  120. # self.pushButton_2.clicked.connect(self.plainTextEdit.zoomIn)
  121. # self.pushButton_3.clicked.connect(self.plainTextEdit.zoomIn)
  122. # self.pushButton_4.clicked.connect(self.plainTextEdit.zoomIn)
  123. # self.pushButton_5.clicked.connect(self.plainTextEdit.zoomIn)
  124. # 自定义函数进行相关(信号/槽)事件绑定
  125. self.pushButton.clicked.connect(self.onClicked)
  126. self.pushButton_2.clicked.connect(self.onPressed)
  127. self.pushButton_3.clicked.connect(self.onReleased)
  128. self.pushButton_4.clicked.connect(self.onToggled)
  129. self.pushButton_5.clicked.connect(self.onToggled)
  130. QtCore.QMetaObject.connectSlotsByName(MainWindow)
  131. def retranslateUi(self, MainWindow):
  132. _translate = QtCore.QCoreApplication.translate
  133. MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
  134. self.pushButton_5.setText(_translate("MainWindow", "PushButton"))
  135. self.pushButton_4.setText(_translate("MainWindow", "PushButton"))
  136. self.pushButton_3.setText(_translate("MainWindow", "PushButton"))
  137. self.pushButton_2.setText(_translate("MainWindow", "PushButton"))
  138. self.pushButton.setText(_translate("MainWindow", "PushButton"))
  139. # 自定义按钮点击触发事件
  140. def onClicked(self):
  141. self.plainTextEdit.appendPlainText(
  142. '按钮{0}被点击'.format(self.pushButton.objectName()))
  143. def onPressed(self):
  144. self.plainTextEdit.appendPlainText(
  145. '按钮{0}被按下'.format(self.pushButton_2.objectName()))
  146. def onReleased(self):
  147. self.plainTextEdit.appendPlainText(
  148. '按钮{0}被释放'.format(self.pushButton_3.objectName()))
  149. def onToggled(self, checked):
  150. self.plainTextEdit.appendPlainText(
  151. '按钮{0}被选中:{1}'.format(self.pushButton_4.objectName(), checked))
  152. if __name__ == '__main__':
  153. app = QApplication(sys.argv)
  154. app.setStyleSheet(StyleSheet)
  155. MainWindow = QMainWindow()
  156. ui = Ui_MainWindow()
  157. ui.setupUi(MainWindow)
  158. MainWindow.show()
  159. sys.exit(app.exec_())

 重点:

1、通过组件的ObjectName + 应用app的setStyleSheet(StyleSheet) 实现自定义样式绑定

2、通过组件的Clicked.connect() 绑定自定义函数。

        # 自定义函数进行相关(信号/槽)事件绑定
        self.pushButton.clicked.connect(self.onClicked)  # pushButton 绑定onClicked 函数
        self.pushButton_2.clicked.connect(self.onPressed)# pushButton_2绑定onPressed函数
        self.pushButton_3.clicked.connect(self.onReleased)# pushButton_3绑定onReleased函数
        self.pushButton_4.clicked.connect(self.onToggled)# pushButton_4绑定onToggled函数
        self.pushButton_5.clicked.connect(self.onToggled)# pushButton_5 绑定onToggled函数

本文内容由网友自发贡献,转载请注明出处:https://www.wpsshop.cn/w/Guff_9hys/article/detail/838930
推荐阅读
相关标签