Qt--设置QSlider样式

墨蓝 2023-06-24 14:23 13阅读 0赞

1、样式表

vertical：

QSlider::groove:vertical { 
        border-radius: 5px;
    	width:10px;
    }
    
    QSlider::handle:vertical { 
        height: 32px;  
    	background:transparent;  
    	background-image: url(:/new/prefix1/image/rr.png);
        margin: -2px -13px -2px -10px;
    }
    
    QSlider::sub-page:vertical{     
    		 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 rgb(124, 124, 124), stop: 1 rgb(72, 71, 71));
    }
    
    QSlider::add-page:vertical {   		
    		background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 rgb(72, 71, 71), stop: 1 rgb(5, 184, 204));
    }

horizontal：

QSlider::groove:horizontal { 
    		border-radius: 5px;
            height: 10px;
    }
    QSlider::handle:horizontal { 
            width: 30px;
    		background:transparent;
    		background-image: url(:/new/prefix1/image/rr.png);
            margin: -13px -1px -10px -1px;
    }
    QSlider::sub-page:horizontal{     
    		background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 rgb(72, 71, 71), stop: 1 rgb(5, 184, 204));
    }
    QSlider::add-page:horizontal { 
       		 background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 rgb(124, 124, 124), stop: 1.0 rgb(72, 71, 71));
    }

2、效果  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjcwNDA5MA_size_16_color_FFFFFF_t_70]  
![手柄图片][20191224085841508.png]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjcwNDA5MA_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20191224085810106.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjcwNDA5MA==,size_16,color_FFFFFF,t_70
[20191224085841508.png]: https://img-blog.csdnimg.cn/20191224085841508.png

发表评论取消回复

表情：

评论列表（有 0 条评论，13人围观）

还没有评论，来说两句吧...

相关阅读

相关 qt鼠标样式设置【qt控件篇】

一、用到的类：QCursor类 > 此类主要用于创建关联特定 Widget 的鼠标光标，及获取和设置鼠标光标的位置。 > > Qt 有许多标准光标形状，但也可以制作自定

深藏阁楼爱情的钟/ 2024年03月25日 18:27/ 0 赞/ 74 阅读

相关 Qt 样式设置之 QCheckBox 样式表

QCheckBox \{ color:red; background-color:rgb(101,101,101); \} QCheckBox::

落日映苍穹つ/ 2023年07月11日 11:16/ 0 赞/ 36 阅读

相关 Qt设置鼠标样式

this->setMouseTracking(true); //设置为不按下鼠标键触发moveEvent void mouseMoveEvent(QM

港控/mmm°/ 2023年07月05日 11:51/ 0 赞/ 39 阅读

相关 Qt--设置QSlider样式

1、样式表 vertical： QSlider::groove:vertical { border-radius: 5px; width

墨蓝/ 2023年06月24日 14:23/ 0 赞/ 14 阅读

相关 Qt：QSlider

1、新建QtGUI应用，选取QWidget为基类，取消创建界面 2、widget.h中 ifndef WIDGET_H define WIDGET_H

比眉伴天荒/ 2023年01月12日 11:47/ 0 赞/ 181 阅读

相关 Qt QSlider详解

1.QSlider常用API //设置最大值、最小值、范围 setMaximum(int) setMinimum(int) setRang

谁借莪１个温暖的怀抱￠/ 2022年10月30日 10:24/ 0 赞/ 487 阅读

相关 Qt学习笔记19：QSlider

QSlider部件提供了一个垂直或水平滑动条。滑块是一个用于控制有界值的典型部件。它允许用户沿水平或垂直方向移动滑块，并将滑块所在的位置转换成一个合法范围内的值。 QSlid

墨蓝/ 2022年09月16日 11:12/ 0 赞/ 373 阅读

相关 qt QTableView/QTableWidget样式设置

转载请注明出处：http://blog.csdn.net/neochan1108/article/details/78084052 选中设置： <table style="

蔚落/ 2022年06月08日 12:11/ 0 赞/ 315 阅读

相关 qt qtableview 样式设置

转载请注明出处：http://blog.csdn.net/neochan1108/article/details/78003090 1.设置tableview的列宽时，必须先

向右看齐/ 2022年06月08日 05:37/ 0 赞/ 467 阅读

相关 Qt滑动条的使用——QSlider

目录目录前言原理代码总结参考链接前言在把camshift移植到qt中时，需要滑动条来对阈值进行修改，这时候因为

小灰灰/ 2022年06月03日 07:56/ 0 赞/ 1273 阅读