Qt 小部件 setStyleSheet

Question

由于我正在为平板电脑环境编程，因此某些小部件太小而无法进行可触摸交互。我特别想把 QSpinBox 按钮做得更大。

经过一番搜索，我发现唯一的方法出现了 setStyleSheet 函数，但是并没有很好地解释如何使用它。在这个link to Qt reference 中描述了我应该将什么传递给 setStyleSheet 函数，但不清楚我是否可以使用它的一部分，或者即使我只想更改一件事，我也应该使用它的全部。

无论如何，使用它的一部分或整个文本，我的 QDoubleSpinBox 在应用此设置后看起来是默认的。当我在 mi ui 文件中绘制时，它甚至比现在更大。当然，它不会将其背景涂成黄色（只是为了检查它是否工作）或使按钮变大。

我正在使用这个功能：

customizeSpinBox(ui.doubleSpinBoxDistanciaLocalizador);
                ui.doubleSpinBoxDistanciaLocalizador->setVisible(true);

void MyClass::customizeSpinBox(QDoubleSpinBox *spinBox){

qApp->setStyleSheet("QSpinBox { border: 3px solid red; border-radius: 5px; background-color: yellow; }"
                       "QSpinBox::up-arrow { border-left: 17px solid none;"
                       "border-right: 17px solid none; border-bottom: 17px solid black; width: 0px; height: 0px; }"
                       "QSpinBox::up-arrow:hover { border-left: 17px solid none;"
                       "border-right: 17px solid none; border-bottom: 17px solid black; width: 0px; height: 0px; }"
                       "QSpinBox::up-button { width: 80px; height: 77px; background-color: yellow; }"
                       "QSpinBox::up-button:hover { width: 80px; height: 77px; background-color: yellow; }"

                       "QSpinBox::down-arrow { border-left: 17px solid none;"
                       "border-right: 17px solid none; border-top: 17px solid black; width: 0px; height: 0px; }"
                       "QSpinBox::down-arrow:hover { border-left: 17px solid none;"
                       "border-right: 17px solid none; border-top: 17px solid black; width: 0px; height: 0px; }"
                       "QSpinBox::down-button { width: 80px; height: 77px; background-color: yellow; }"
                       "QSpinBox::down-button:hover { width: 80px; height: 77px; background-color: yellow; }"
    );

}

有什么帮助吗？

Answer 1

首先 - 这个样式表代码不能工作。在某些行中缺少结束“}”。

为了设置 QSpinBox 的最小尺寸，试试这个： QSpinBox { border: 3px solid red; border-radius: 5px; background-color: yellow; min-width: 200px; min-height: 200px; }

使用这种方法，我得到了具有这种样式的又大又丑的旋转框：

"QSpinBox { border: 3px solid red; border-radius: 5px; background-color: yellow; min-height: 150px; min-width: 150px; }"
"QSpinBox::up-arrow { border-left: 17px solid none;"
"border-right: 17px solid none; border-bottom: 17px solid black; width: 0px; height: 0px; }"
"QSpinBox::up-arrow:hover { border-left: 17px solid none; "
"border-right: 17px solid none; border-bottom: 17px solid black; width: 0px; height: 0px; }"
"QSpinBox::up-button { min-width: 80px; min-height: 77px; background-color: yellow; }"
"QSpinBox::up-button:hover { min-width: 80px; min-height: 77px; background-color: yellow; }"
"QSpinBox::down-arrow { border-left: 17px solid none;"
"border-right: 17px solid none; border-top: 17px solid black; width: 0px; height: 0px; }"


"QSpinBox::down-arrow:hover { border-left: 17px solid none;"
"border-right: 17px solid none; border-top: 17px solid black; width: 0px; height: 0px; }"
"QSpinBox::down-button { min-width: 80px; min-height: 77px; background-color: yellow; }"
"QSpinBox::down-button:hover { min-width: 80px; min-height: 77px; background-color: yellow; }"

Answer 2

将分号放在样式表字符串的最后一行。

使用

"QSpinBox::down-button:hover { width: 80px; height: 77px; background-color: yellow; };"

而不是

"QSpinBox::down-button:hover { width: 80px; height: 77px; background-color: yellow; }"

Answer 3

对不起，我迟到了。 Check this。我意识到“subcontrol-origin: ...”和“subcontrol-position: ...”都必须设置在向下按钮和向上按钮上。我正在使用python + pyqt。希望对你有帮助。