1. 程式人生 > >【Qt】QSlider----qss(round handle) 圓形滑塊

【Qt】QSlider----qss(round handle) 圓形滑塊

       QSlider是Qt中常用的控制元件,樣式也各種各樣,自己嘗試做的一個樣式,儘管handle能用圖片做的更完美,不用圖片,視覺效果上,仍然沒什麼問題,round handle

1、漸變在右上角

QSlider
{
    background-color: #ff00ff; 
	border-style: outset; 
	border-radius: 10px; 
}

QSlider::groove:horizontal
{
	height: 12px;
	background: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 #B1B1B1, stop:1 #c4c4c4);
	margin: 2px 0
}
QSlider::handle:horizontal 
{
	background: QRadialGradient(cx:0, cy:0, radius: 1, fx:0.5, fy:0.5, stop:0 white, stop:1 green);
	width: 16px;
	height: 16px;
	margin: -5px 6px -5px 6px;
	border-radius:11px; 
	border: 3px solid #ffffff;
}

效果如下圖:

round handle

2、漸變在圓形中心

QSlider
{
    background-color: #ff00ff; 
	border-style: outset; 
	border-radius: 10px; 
}

QSlider::groove:horizontal
{
	height: 12px;
	background: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 #B1B1B1, stop:1 #c4c4c4);
	margin: 2px 0
}
QSlider::handle:horizontal 
{
	background: qradialgradient(spread:pad, cx:0.5, cy:0.5, radius:0.5, fx:0.5, fy:0.5, stop:0 white, stop:1 green);
	width: 16px;
	height: 16px;
	margin: -5px 6px -5px 6px;
	border-radius:11px; 
	border: 3px solid #ffffff;
}


    大家有一些好的樣式效果,一起學習下。。。。。。有好的想法,可以留言。。