PyQt5 QSpinBox - 设置过度线

PyQt5是一种Python语言的GUI框架，其中的QSpinBox控件可以用于输入数字。设置过度线可以使QSpinBox的值在超出范围时呈现红色，方便用户发现错误。下面是关于如何使用PyQt5 QSpinBox-设置过度线的完整使用攻略：

步骤1：导入必要库

首先需要导入PyQt5库，以及QtWidgets模块中的QSpinBox类。示例代码如下：

from PyQt5 import QtWidgets
from PyQt5.QtWidgets import QSpinBox

步骤2：创建QSpinBox对象并设置过度线

接下来创建QSpinBox对象，使用setRange()方法指定范围，setStyleSheet()方法设置过度线。具体代码如下：

spinbox = QSpinBox()
spinbox.setRange(0, 100)
spinbox.setStyleSheet('''
                    QSpinBox::up-button { subcontrol-position: right; } 
                    QSpinBox::down-button { subcontrol-position: left; }
                    QSpinBox::up-arrow, QSpinBox::down-arrow {image: none;}
                    QSpinBox::up-arrow {width:0px;height:0px;}
                    QSpinBox::down-arrow {width:0px;height:0px;}
                    QSpinBox::up-button, QSpinBox::down-button {
                    background-color: #F0F0F0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-button:hover, QSpinBox::down-button:hover {
                    background-color: #D0D0D0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-button:pressed, QSpinBox::down-button:pressed {
                    background-color: #B0B0B0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-button:hover:pressed, QSpinBox::down-button:hover:pressed {
                    background-color: #898989;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-arrow {border-color: #7777EE;}
                    QSpinBox::down-arrow {border-color: #7777EE;''')

其中，setRange()方法接收两个参数，即QSpinBox能够展示的最小值和最大值，本例中为0-100。setStyleSheet()方法设置QSpinBox的样式表，通过子控制选择器subcontrol-position指定QSpinBox中的上下箭头的位置，使用background-color设置按钮的背景颜色，使用border-style和border-width属性设置按钮边框的样式和宽度，使用border-color设置边框的颜色，使用border-radius设置按钮边框的圆角半径。另外设置箭头的宽高均为0，可使箭头不出现，使用border-color设置箭头的边框颜色。

示例1：设置QSpinBox过度线为红色

可以将QSpinBox的值范围限定为1-10，如果输入不合法的值，QSpinBox就会显示过度线并将文字颜色设定为红色。示例代码如下：

spinbox = QSpinBox()
spinbox.setRange(1, 10)
spinbox.setStyleSheet('''
                    QSpinBox::up-button { subcontrol-position: right; } 
                    QSpinBox::down-button { subcontrol-position: left; }
                    QSpinBox::up-arrow, QSpinBox::down-arrow {image: none;}
                    QSpinBox::up-arrow {width:0px;height:0px;}
                    QSpinBox::down-arrow {width:0px;height:0px;}
                    QSpinBox::up-button, QSpinBox::down-button {
                    background-color: #F0F0F0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-button:hover, QSpinBox::down-button:hover {
                    background-color: #D0D0D0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-button:pressed, QSpinBox::down-button:pressed {
                    background-color: #B0B0B0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-button:hover:pressed, QSpinBox::down-button:hover:pressed {
                    background-color: #898989;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-arrow {border-color: #7777EE;}
                    QSpinBox::down-arrow {border-color: #7777EE;
                    }
                    QSpinBox::up-disabled, QSpinBox::down-disabled {
                    background-color: #F0F0F0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-disabled:hover, QSpinBox::down-disabled:hover {
                    background-color: #D0D0D0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-disabled:pressed, QSpinBox::down-disabled:pressed {
                    background-color: #B0B0B0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-disabled:hover:pressed, QSpinBox::down-disabled:hover:pressed {
                    background-color: #898989;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-disabled {
                    border-color: #A8A8A8;color:#AAAAAA}
                    QSpinBox::down-disabled {
                    border-color: #A8A8A8;color:#AAAAAA}
                    QSpinBox::up {border-left: none; border-top:none; border-bottom:none;}
                    QSpinBox::down {border-left: none;border-right:none; border-top:none;}
                    QSpinBox::up:focus , QSpinBox::down:focus{
                    border-color: #B8D5FC;}
                    QSpinBox::up:pressed, QSpinBox::down:pressed {
                    background-color: #DADADA;border-style: solid;border-width:1px;}
                    QSpinBox:focus {
                    border-color: #B8D5FC;}
                    QSpinBox::up:!enabled, QSpinBox::down:!enabled {
                    border-color: #A8A8A8;}
                    QSpinBox::lineEdit{
                    selection-background-color: #00BFFF;
                    selection-color:white;}
                    QSpinBox::invalid{
                    color:red;}
                    QSpinBox::valid{
                    color:black;}
                    ''')
spinbox.setValue(11)   # 超出范围的值

在上面的代码中，使用setValue方法将QSpinBox的值设为超出范围值11，便会触发设置的过度线，QSpinBox上将展示出红色的过度线和红色的文字。

示例2：修改QSpinBox的过度线样式

可以将QSpinBox的过度线颜色设为绿色和宽度加倍，使其更加醒目。示例代码如下：

spinbox = QSpinBox()
spinbox.setRange(0, 200)
spinbox.setStyleSheet('''
                    QSpinBox::up-button { subcontrol-position: right; } 
                    QSpinBox::down-button { subcontrol-position: left; }
                    QSpinBox::up-arrow, QSpinBox::down-arrow {image: none;}
                    QSpinBox::up-arrow {width:0px;height:0px;}
                    QSpinBox::down-arrow {width:0px;height:0px;}
                    QSpinBox::up-button, QSpinBox::down-button {
                    background-color: #F0F0F0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-button:hover, QSpinBox::down-button:hover {
                    background-color: #D0D0D0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-button:pressed, QSpinBox::down-button:pressed {
                    background-color: #B0B0B0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-button:hover:pressed, QSpinBox::down-button:hover:pressed {
                    background-color: #898989;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-arrow {border-color: #7777EE;}
                    QSpinBox::down-arrow {border-color: #7777EE;}
                    QSpinBox::up-disabled, QSpinBox::down-disabled {
                    background-color: #F0F0F0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-disabled:hover, QSpinBox::down-disabled:hover {
                    background-color: #D0D0D0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-disabled:pressed, QSpinBox::down-disabled:pressed {
                    background-color: #B0B0B0;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-disabled:hover:pressed, QSpinBox::down-disabled:hover:pressed {
                    background-color: #898989;border-style: solid;border-width: 1px;
                    border-color: #A8A8A8;border-radius: 2px;min-width:2px;min-height:2px;}
                    QSpinBox::up-disabled {
                    border-color: #A8A8A8;color:#AAAAAA}
                    QSpinBox::down-disabled {
                    border-color: #A8A8A8;color:#AAAAAA}
                    QSpinBox::up {border-left: none; border-top:none; border-bottom:none;}
                    QSpinBox::down {border-left: none;border-right:none; border-top:none;}
                    QSpinBox::up:focus , QSpinBox::down:focus{
                    border-color: #B8D5FC;}
                    QSpinBox::up:pressed, QSpinBox::down:pressed {
                    background-color: #DADADA;border-style: solid;border-width:1px;}
                    QSpinBox:focus {
                    border-color: #B8D5FC;}
                    QSpinBox::up:!enabled, QSpinBox::down:!enabled {
                    border-color: #A8A8A8;}
                    QSpinBox::lineEdit{
                    selection-background-color: #00BFFF;
                    selection-color:white;}
                    QSpinBox::invalid{
                    color:green;border-color: green;width:2px;}
                    QSpinBox::valid{
                    color:black;}
                    ''')

在上面的代码中，将QSpinBox的setValue方法注释掉，然后在setStyleSheet方法中设置QSpinBox::invalid伪状态，将文字颜色设为绿色并将边框宽度加倍。使用QSpinBox时，当值超出范围时，QSpinBox会呈现绿色的过度线和绿色的文字。

步骤1：导入必要库

步骤2：创建QSpinBox对象并设置过度线

示例1：设置QSpinBox过度线为红色

示例2：修改QSpinBox的过度线样式

你可能也喜欢

PyQt5 QSpinBox – 使文本变粗

PyQt5 QColorDialog – 测试颜色对话框选项

PyQt5组合框 当它处于关闭状态时不同的边框颜色

PyQt5组合框当它处于关闭状态时不同的边框颜色