QprogressBar 和 QSlider 样式设置

QprogressBar 

1. 在布局中添加QprogressBar 

2. 右键"样式设置"

添加:

QProgressBar {

border: 2px solid grey;

border-radius: 5px;

background-color: #FFFFFF;

}

QProgressBar::chunk {

background-color: #05B8CC;

width: 20px;

}

QProgressBar {

text-align: center;

color: rgb(255, 85, 0);

}

QSlider

1. 在布局中添加 QSlider  

2. 右键"样式设置"

 /* 整个拖动条的设置 */

QSlider::groove{

border: 1px solid #00ff00; /* 边框颜色 */

height: 8px; /* 整体高度 */

background: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 #c40000, stop:1 #c4c4c4);

margin: 0px 0; /* 0px 设置已划过的地方高度, "0" 距离父控件的距离*/

}

/* 顶部拖动设计 */

QSlider::handle{

background: qlineargradient(x1:0, y1:0, x2:1, y2:1, stop:0 #b4b4b4, stop:1 #8f8f8f);

border: 1px solid #5c5c5c; /*边框*/

width: 18px;

margin: -2px 0; /*滑块大小设置*/

border-radius: 3px; /* 圆角设置 */

background-color: #05B8CC;

}

/* 未滑动的区域 */

QSlider::add-page:horizontal

{

border-radius: 3px;

height: 8px; /* 整体高度 */

}

/* 已划过的设置*/

QSlider::sub-page:horizontal

{

border: 1px solid #00ffFF; /* 边框颜色 */

background:qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 #000000, stop:1 #0000FF); /* 颜色渐变*/

border-radius: 3px;

height: 8px; /* 整体高度 */

}