QSlider的qss美化

作者：使徒保罗

联系方式: [email protected]

说明: 有任何疑问可通过邮箱联系本人

本文主要采用qt qss机制对QSlider进行美化.

QSlider有四种辅助控制器：groove(槽部分)、handle(滑块)、add-page(未滑过部分) 、sub-page(已滑过部分)。

核心代码:

m_pSlider = new QSlider(Qt::Horizontal,this);

m_pSlider->setGeometry(100, 100, 200, 20);

m_pSlider->setStyleSheet("QSlider::groove:horizontal{ \

                                                height: 10px; \

                                                left: 5px; \

                                                right: 5px; \

                                                background: #dcdcdc; \

                                              } \

                          QSlider::handle:horizontal{ \

                                                border-radius: 10px; \

                                                width:  20px; \

                                                margin: -5px -1px; \

                                                background: green; } \

                          QSlider::sub-page:horizontal{background: qlineargradient(spread:pad, x1:0, y1:1, x2:0, y2:0, stop:0 rgba(27, 5, 27, 255), stop:0.25 rgba(99, 20, 102, 255), stop:0.5 rgba(154, 30, 158, 255), stop:1 rgba(173, 57, 176, 255));}");

效果如下：