在 Qt 中，QScrollArea 是用于显示可以滚动内容的控件，通常用于处理视图中内容超出可见区域的情况。它提供了一种在有限的视窗内显示大量内容的解决方案，如显示大图像、长文本、多个小部件等。

常用方法和属性

• setWidget(QWidget *widget)：

  • 设置视口小部件，这是 QScrollArea 中显示的实际内容。

• setWidgetResizable(bool resizable)：

  • 设置是否自动调整视口小部件的大小以适应 QScrollArea 的大小变化。

• verticalScrollBar() 和 horizontalScrollBar()：

  • 返回垂直和水平滚动条的实例，可以通过这些方法来调整滚动条的属性和行为。

• setStyleSheet(const QString &styleSheet)：

  • 设置样式表，可以用来自定义 QScrollArea 的外观，包括滚动条的样式和背景等。

使用场景

QScrollArea 在以下场景特别有用：

• 显示大图像：允许用户在有限的窗口大小内查看整个大图像。

• 长文本显示：用于显示超出单个窗口的长文本，如日志文件或者长文章。

• 多个小部件：组合多个小部件以创建一个复杂的用户界面，使得用户可以在有限空间内查看和操作多个部件。

通过 QScrollArea，开发者可以提供更好的用户体验，确保所有内容都能够被用户访问到，而不会被限制在固定的窗口大小内。

在创建好工程后，我们进入 ui 界面，我们到左边的控件栏找到  scroll area：

这个就是做可以拖动的滚动视图的效果。

把他放进界面里，把他拖动和窗口一样高， 我这里是 600。

我们调节一下这个滚动面板的长度，让他有滚动条，我们选中：

改一下他的长度和高度：

我们就只设置高度了：

现在的颜色还和背景一样我们改一下样式表，设置白色：

background-color: #ffffff

这个拖动条有点太细了，我们给他加粗一点，直接右击改变样式表：

QScrollBar:vertical{width: 20px;background: white;
}

我们改成圆角灰色的，就像我们页面右边的那个样子：

QScrollBar::handle:vertical{background:rgba(200,200,200,30%);min-width:20px;border-radius:10px
}

这个上箭头和下箭头太碍事了，我们给他去掉：

QScrollBar::add-line:vertical{
width:0px;
height:0px;
}
QScrollBar::sub-line:vertical{
width:0px;
height:0px;
}

看看效果：

嗯，差不多是这样，但是还没有点击反馈，放上去要变色：

QScrollBar::handle::hover{
background:rgba(200,200,200,70%);
}

这样放上去就能变色了。