QT软件开发: 设置QSlider样式

2022-01-12 10:34:18 浏览数 (1)

示例样式:

代码语言:javascript复制
ui->horizontalSlider->setStyleSheet("");
代码语言:javascript复制
/*滑块的样式*/
QSlider::groove:horizontal {
border: 1px solid #00B0AE;
background: #00B0AE;
height: 2px;
border-radius: 1px;
padding-left:0px;
padding-right:0px;
}

/*滑块经过的颜色:前面的颜色*/
QSlider::sub-page:horizontal {
background: #00B0AE;
border: 1px solid #00B0AE;
height: 2px;
border-radius: 2px;
}

QSlider::add-page:horizontal {
background: #EAEAEA;
border: 0px solid #EAEAEA;
height: 2px;
border-radius: 2px;
}
QSlider::handle:horizontal 
{
    background: qradialgradient(spread:pad, cx:0.5, cy:0.5, radius:0.5, fx:0.5, fy:0.5, 
    stop:0.6 #00B0AE,stop:0.98409 rgba(255, 255, 255, 255));

    width: 15px;
    margin-top: -6px;
    margin-bottom: -6px;
    border-radius: 5px;
}

QSlider::handle:horizontal:hover {
    background: qradialgradient(spread:pad, cx:0.5, cy:0.5, radius:0.5, fx:0.5, fy:0.5, 
    stop:0.6 #00B0AE,stop:0.98409 rgba(255, 255, 255, 255));

    width: 15px;
    margin-top: -6px;
    margin-bottom: -6px;
    border-radius: 5px;
}

0 人点赞