本文主要讲述如何通过qss
自定义滚动条QScrollBar
,我们先以实现一个扁平化的滚动条为例,效果如下图所示。
扁平化滚动条实现
在windows
中,如果不设置add-page,sub-page:background: none;
,则背景将会变为网格样式。mac
系统下无此特性。
自定义背景图片
通过上面的例子,我们可以用设置背景色的方式,来实现扁平化风格的滚动条,如果我们想有更绚丽的效果,可以通过修改背景图片,来自定义滚动条。我们以纵向为例,参考代码如下:
默认隐藏滚动条
现代风格的软件中,很多情况下滚动条默认是隐藏的,当鼠标进入相关区域后,显示当前区域的滚动条,这样做节省了空间,提高了整体观感。如微信的PC版本,Github客户端等均为此风格。实现方式也很简单,就是在鼠标进入和离开目标区域时,分别显示和隐藏滚动条即可,参考代码如下:
使用QObject::setProperty
方法是为了适配多个窗体的情况,代码可复用,只需条件中添加obj == ui->listWidget2
即可。