博客

PyQt5 – 制作圆形组合框

  • Post category:Python

PyQt5是一个使用Python语言开发的GUI框架，提供了丰富的图形组件和工具类，可以实现各种复杂的应用程序。制作圆形组合框是PyQt5中常用的组件之一，可以用于让用户选择多个选项中的一个，本文将详细讲解如何制作圆形组合框。

环境准备

在开始制作圆形组合框之前，需要确保已经安装好了PyQt5和相关的Python开发环境。可以通过以下命令安装：

pip install pyqt5

制作圆形组合框的步骤

  1. 导入必要的模块和类

制作圆形组合框首先需要导入必要的模块和类，包括QtWidgets模块中的QComboBox类、QApplication类和QVBoxLayout类。

from PyQt5.QtWidgets import QComboBox, QApplication, QVBoxLayout
  1. 创建圆形组合框对象

创建圆形组合框对象，可使用QComboBox类来实现，使用构造函数创建对象。

combo_box = QComboBox()
  1. 设置圆形组合框样式

设置圆形组合框的样式，包括外观和大小，颜色等。

combo_box.setStyleSheet("QComboBox {border-radius: 10px;"
                         "padding: 1px 18px 1px 3px;"
                         "min-width: 6em;"
                         "color: white;"
                         "background-color: #555555;"
                         "selection-color: white;"
                         "selection-background-color: #7193ff;}")
combo_box.setMaximumHeight(36)
combo_box.setMinimumHeight(36)
  1. 添加选项

向圆形组合框中添加选项，使用addItem()函数添加选项，或者使用addItems()函数添加多个选项。

combo_box.addItem("选项1")
combo_box.addItem("选项2")
combo_box.addItem("选项3")
  1. 设置默认选项

设置圆形组合框的默认选项，使用setCurrentIndex()函数实现，其中参数为默认选项的下标值。

combo_box.setCurrentIndex(0)
  1. 显示圆形组合框

将圆形组合框显示出来，可以使用QVBoxLayout类来布局组合框，并通过QApplication类的exec_()函数来运行应用程序。

layout = QVBoxLayout()
layout.addWidget(combo_box)

app = QApplication([])
app.setStyleSheet("QComboBox:down-arrow {image: none;}"
                  "QComboBox:drop-down {background-color: #555555;}"
                  "QComboBox QAbstractItemView {border-radius: 10px;"
                  "background-color: #555555;"
                  "color: white;"
                  "selection-background-color: #7193ff;"
                  "selection-color: white;}")
window = QWidget()
window.setLayout(layout)
window.show()

app.exec_()

示例一：单选圆形组合框

from PyQt5.QtWidgets import QComboBox, QApplication, QVBoxLayout, QWidget

combo_box = QComboBox()
combo_box.setStyleSheet("QComboBox {border-radius: 10px;"
                         "padding: 1px 18px 1px 3px;"
                         "min-width: 6em;"
                         "color: white;"
                         "background-color: #555555;"
                         "selection-color: white;"
                         "selection-background-color: #7193ff;}")
combo_box.setMaximumHeight(36)
combo_box.setMinimumHeight(36)
combo_box.addItem("选项1")
combo_box.addItem("选项2")
combo_box.addItem("选项3")
combo_box.setCurrentIndex(0)

layout = QVBoxLayout()
layout.addWidget(combo_box)

app = QApplication([])
app.setStyleSheet("QComboBox:down-arrow {image: none;}"
                  "QComboBox:drop-down {background-color: #555555;}"
                  "QComboBox QAbstractItemView {border-radius: 10px;"
                  "background-color: #555555;"
                  "color: white;"
                  "selection-background-color: #7193ff;"
                  "selection-color: white;}")
window = QWidget()
window.setLayout(layout)
window.show()

app.exec_()

示例二：多选圆形组合框

from PyQt5.QtWidgets import QComboBox, QApplication, QVBoxLayout, QWidget

combo_box = QComboBox()
combo_box.setDuplicatesEnabled(False)
combo_box.setStyleSheet("QComboBox {border-radius: 10px;"
                         "padding: 1px 18px 1px 3px;"
                         "min-width: 6em;"
                         "color: white;"
                         "background-color: #555555;"
                         "selection-color: white;"
                         "selection-background-color: #7193ff;}"
                         "QListView::item:hover {background: #7193ff;}")
combo_box.setMaximumHeight(36)
combo_box.setMinimumHeight(36)
combo_box.setEditable(True)
combo_box.addItems(["选项1", "选项2", "选项3"])
combo_box.view().pressed.connect(lambda: combo_box.lineEdit().deselect())
combo_box.view().pressed.connect(lambda: combo_box.view().currentIndex().row() != -1 and combo_box.setCurrentIndex(combo_box.view().currentIndex().row()))

layout = QVBoxLayout()
layout.addWidget(combo_box)

app = QApplication([])
app.setStyleSheet("QComboBox:down-arrow {image: none;}"
                  "QComboBox:drop-down {background-color: #555555;}"
                  "QComboBox QAbstractItemView {border-radius: 10px;"
                  "background-color: #555555;"
                  "color: white;"
                  "selection-background-color: #7193ff;"
                  "selection-color: white;}")

window = QWidget()
window.setLayout(layout)
window.show()

app.exec_()

通过以上步骤和示例，我们可以轻松地制作出漂亮的圆形组合框，并将其加入到我们的PyQt5程序中。可以根据需求对其进行进一步修改和调整，为用户提供更好的交互体验。

Tags: