Question

我正在尝试为QScrollArea和我的样式表的滚动条应用一些样式表，如下所示。

QScrollBar:vertical {

  border-color: rgb(227, 227, 227);
  border-width: 1px;
  border-style: solid;

  background-color: rgb(240, 240, 240);
  width: 15px;
  margin: 21px 0 21px 0;
}

QScrollBar::handle:vertical {

  background-color: rgb(200, 200, 200);
  min-height: 25px;

}

 QScrollBar::add-line:vertical {
    border: 1px solid grey;
  background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: bottom;
    subcontrol-origin: margin;
}

QScrollBar::sub-line:vertical {
    border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: top;
    subcontrol-origin: margin;
}


  QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
      background: none;
  }

QScrollBar::up-arrow:vertical
{
  image: url(:/BarIcon/Icons/uparrow.png);
}

QScrollBar::down-arrow:vertical
{
  image: url(:/BarIcon/Icons/downarrow.png);
}

QScrollBar:horizontal {
  border-color: rgb(227, 227, 227);
  border-width: 1px;
  border-style: solid;
  background-color: rgb(240, 240, 240);
    width: 15px;
    margin: 0px 21px 0 21px;
 }

 QScrollBar::handle:horizontal {
    background-color: rgb(200, 200, 200);
    min-height: 25px;
 }
QScrollBar::add-line:horizontal {
    border: 1px solid grey;
  background-color: rgb(241, 241, 241);
    width: 20px;
    subcontrol-position: right;
    subcontrol-origin: margin;
 }

 QScrollBar::sub-line:horizontal {
  border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    width: 20px;
    subcontrol-position: left;
    subcontrol-origin: margin;
 }

 QScrollBar:left-arrow:horizontal
{
  image: url(:/BarIcon/Icons/leftarrow.png);
}

QScrollBar::right-arrow:horizontal 
{
  image: url(:/BarIcon/Icons/rightarrow.png);
}

QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal {
     background: none;
}

这个样式表完美地完成了它对垂直滚动条的应用，但是由于存在与QScrollBar:horizontal相关的任何单个样式表，该栏就会消失。

任何人都可以指出我的缺陷，我应该怎么做？

注意：使用Qt Designer的Change styleSheet选项将styleSheet应用于QScrollArea对象。

如果水平滚动条显示在此样式表上，请务必确认。

Answer 1

你很幸运，今天发生在我身上的事情也是如此。

这非常简单，这是因为你只是复制了你的水平垂直样式，只是将“垂直”改为“水平”，但实际上还有一些事情需要改变：

“width”参数在水平方向变为“height”。
“height”参数变为“width”。
“top”和“bottom”变为“left”和“right”（你做过）。
此外，如果您有不对称的边距等，请不要忘记调整它们（您也这样做了）。

这为您的特定情况提供了以下样式表：

QScrollBar:vertical {

  border-color: rgb(227, 227, 227);
  border-width: 1px;
  border-style: solid;

  background-color: rgb(240, 240, 240);
  width: 15px;
  margin: 21px 0 21px 0;
}

QScrollBar::handle:vertical {

  background-color: rgb(200, 200, 200);
  min-height: 25px;

}

 QScrollBar::add-line:vertical {
    border: 1px solid grey;
  background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: bottom;
    subcontrol-origin: margin;
}

QScrollBar::sub-line:vertical {
    border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: top;
    subcontrol-origin: margin;
}


  QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
      background: none;
  }

QScrollBar::up-arrow:vertical
{
  image: url(:/BarIcon/Icons/uparrow.png);
}

QScrollBar::down-arrow:vertical
{
  image: url(:/BarIcon/Icons/downarrow.png);
}

QScrollBar:horizontal {
  border-color: rgb(227, 227, 227);
  border-width: 1px;
  border-style: solid;
  background-color: rgb(240, 240, 240);
    height: 15px;
    margin: 0px 21px 0 21px;
 }

 QScrollBar::handle:horizontal {
    background-color: rgb(200, 200, 200);
    min-width: 25px;
 }
QScrollBar::add-line:horizontal {
    border: 1px solid grey;
  background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: right;
    subcontrol-origin: margin;
 }

 QScrollBar::sub-line:horizontal {
  border: 1px solid grey;
    background-color: rgb(241, 241, 241);
    height: 20px;
    subcontrol-position: left;
    subcontrol-origin: margin;
 }

 QScrollBar:left-arrow:horizontal
{
  image: url(:/BarIcon/Icons/leftarrow.png);
}

QScrollBar::right-arrow:horizontal 
{
  image: url(:/BarIcon/Icons/rightarrow.png);
}

QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal {
     background: none;
}

Qt：在QScrollArea上应用样式表使水平滚动条消失但对垂直滚动条完美地工作

1 个答案: