QT改变滑动条的显示样式
作者：互联网
可以通过修改控件的样式表来达到显示自定义的滑动条。
效果图：
完整代码：
1 ui->hsPosition->setStyleSheet(tr("QSlider::groove:horizontal{ \
2 border-radius:5px;\
3 height:10px;\
4 left:5px;\
5 right:5px;\
6 border-image:url(:/slider_bg.png);\
7 }\
8 QSlider::handle:horizontal{\
9 border-radius:10px;\
10 width:20px;\
11 height:20px;\
12 margin-top:-5px;\
13 margin-bottom:-5px;\
14 margin-right:-5px;\
15 margin-left:-5px;\
16 border-image:url(:/5.png);\
17 }\
18 QSlider::sub-page:horizontal{border-radius:5px;border-image:url(:/slider.png);}"));
代码单步分析
1 QSlider::groove:horizontal{ \ //groove代表未划过的、horizontal代表横向条与之对应的是纵向vercital
2 border-radius:5px;\ //圆角化
3 height:10px;\ //设定高度
4 left:5px;\ //设定左边界
5 right:5px;\ //设定右边界
6 border-image:url(:/slider_bg.png);\ //设置显示的图片
7 }\
1 QSlider::handle:horizontal{\ //handle代表滑动块
2 border-radius:10px;\ //圆角化
3 width:20px;\ //设置宽度
4 height:20px;\ //设置高度
5 margin-top:-5px;\ //设置页面顶边距
6 margin-bottom:-5px;\ //设置页面底边距
7 margin-right:-5px;\ //设置页面右边距
8 margin-left:-5px;\ //设置页面左边距
9 border-image:url(:/5.png);\ //设置显示的图片
10 }\
1 QSlider::sub-page:horizontal{\ //sub-page代表已经划过的区域
2 border-radius:5px;\ //圆角化
3 border-image:url(:/slider.png);}")); //设置显示的图片
标签：QT,样式,border,image,radius,5px,滑动,horizontal,margin 来源： https://www.cnblogs.com/zswd-hwj/p/12394356.html