1

使用以下代码设置垂直 Qscrollbar 的样式。它给出了附加照片的外观/结果。我想将向上和向下箭头从 Square 更改为顶部的实际向上箭头（三角形）和底部的向下箭头（倒三角形）。如何获得？

在此处输入图像描述

   QScrollBar:vertical {
   background: rgb(220,220,220);
   width: 15px;
   margin: 22px 0 22px 0; }

   QScrollBar::handle:vertical {
   background: rgb(169,169,169);
   min-height: 10px; }
   
   QScrollBar::add-line:vertical {
   border: 0px solid grey;
   background: rgb(220,220,220);
   height: 20px;
   subcontrol-position: bottom;
   subcontrol-origin: margin; }

   QScrollBar::sub-line:vertical {
   border: 0px solid red;
   background: rgb(220,220,220);
   height: 20px;
   subcontrol-position: top;
   subcontrol-origin: margin;}
   
   QScrollBar::up-arrow:vertical, QScrollBar::down-arrow:vertical {
   border: 0px solid red;
   display: ᐃ
   width: 5px;
   height: 5px;
   background:black;}
4

2 回答 2

1

除了手动为箭头提供图像外，您还可以尝试不同的窗口样式。如果您将 Designer 用于您的应用程序，则可以从 Form...Preview In -> Style 预览样式。在文档中很难找到，但如果你看这里，有一些样式。

在您的代码中，您可以在应用程序级别执行此操作：

if __name__ == '__main__':
    app = QApplication(sys.argv)
    app.setStyle(QStyleFactory.create('fusion'))
于 2021-07-04T15:32:33.660 回答
1

您必须使用图像来获取箭头图标。

QScrollBar::right-arrow,
QScrollBar::left-arrow,
QScrollBar::up-arrow,
QScrollBar::down-arrow {
    width: 12px;
    height: 12px;
    background: black;
}

QScrollBar::right-arrow {
    image: url("://icons/theme-dark/caret_right.svg");
}
QScrollBar::left-arrow {
    image: url("://icons/theme-dark/caret_left.svg");
}
QScrollBar::up-arrow {
    image: url("://icons/theme-dark/caret_up.svg");
}
QScrollBar::down-arrow {
    image: url("://icons/theme-dark/caret_down.svg");
}

图像可以是任何东西，Qt 支持的任何格式（png、jpg、gif 等）。上面的 URL 语法使用嵌入在包含的 Qt 资源文件中的图像（但它们也可以是file://URL，或实际的网络请求（http/s 等））。

您不需要:verticalor:horizontal限定符（元素已经是“定向的”）。此外，您使用的方式display也不正确，而且 Qt 也不支持它（content我认为这也不是您的意思）。

于 2021-07-04T11:59:57.220 回答