滚动条问题。。

[lee819310]

怎样改变滚动条滑块的样式？？能不能把滑块贴成一张图片呢？？这样可以实现吗？求指导啊。。。

[xiachm]

你需要使用QSS，即Qt Style Sheet，

请参考官方文档:
《Qt Style Sheets》

其中有专门的章节来描述如何利用QSS渲染QScrollBar
《Customizing QScrollBar》

[lee819310]

[Quote=引用 1 楼 的回复:]

你需要使用QSS，即Qt Style Sheet，

请参考官方文档:
《Qt Style Sheets》

其中有专门的章节来描述如何利用QSS渲染QScrollBar
《Customizing QScrollBar》
[/Quote]谢谢啊，对我很有帮助，关于ui方面的界面优化，你有没有好的资料啊。让我参考参考。跪谢。。。

[xiachm]

Qt的界面美化都在上面的文档里呢，非常全面。

另外一种方式是使用QML，这要看具体的产品设计了。

[圆圆胖胖的车车]

[Quote=引用 1 楼 的回复:]

你需要使用QSS，即Qt Style Sheet，

请参考官方文档:
《Qt Style Sheets》

其中有专门的章节来描述如何利用QSS渲染QScrollBar
《Customizing QScrollBar》
[/Quote]谢了~

[wlxj8284]

使用QSS


QScrollBar:horizontal
{
height:16px;
border:1px solid rgb(210,210,210);
margin:0px,0px,0px,0px;
padding-left:10px;
padding-right:10px;
}
QScrollBar::handle:horizontal
{
height:16px;
min-width:20;
border:1px solid rgb(134,134,134);
background:qlineargradient(spread:reflect, x1:0, y1:0, x2:0, y2:1,
stop:0 rgb(240, 240, 240) stop:0.4 rgb(220, 220, 220), stop:1 rgb(200, 200, 200));
border-radius:1px;
image:url(:/images/hScrollHandle.png);
}
QScrollBar::handle:horizontal::disabled
{
background:rgb(240,240,240);
image:url(:/images/hScrollHandle.png);
}
QScrollBar::handle:horizontal:hover
{
background:qlineargradient(spread:reflect, x1:0, y1:0, x2:0, y2:1,
stop:0 rgb(233,247,253) stop:0.4 rgb(181,228,247), stop:1 rgb(102,186,221));
border:1px solid rgb(24,89,138);
}
QScrollBar::add-line:horizontal
{
width:10px;
background:rgb(200,200,200);
subcontrol-position:right;
}
QScrollBar::sub-line:horizontal
{
width:10px;
background:rgb(200,200,200);
subcontrol-position:left;
}
QScrollBar::add-page:horizontal,QScrollBar::sub-page:horizontal
{
background:qlineargradient(spread:reflect, x1:0, y1:0, x2:0, y2:1,
stop:0 rgba(180, 180, 180, 255),
stop:1 rgba(210, 210, 210, 255));
}
QScrollBar::left-arrow:horizontal
{
border:1px;
max-height:16px;
min-width:18px;
image:url(:/images/scrollLeft.png);
}
QScrollBar::right-arrow:horizontal
{
border:1px;
max-height:16px;
min-width:18px;
image:url(:/images/scrollRight.png);
}
QScrollBar:vertical
{
width:16px;
border:1px solid rgb(210,210,210);
margin:0px,0px,0px,0px;
padding-top:10px;
padding-bottom:10px;
}

QScrollBar::handle:vertical
{
width:16px;
border:1px solid rgb(134,134,134);
background:qlineargradient(spread:reflect, x1:0, y1:0, x2:1, y2:0,
stop:0 rgb(240, 240, 240) stop:0.4 rgb(220, 220, 220), stop:1 rgb(200, 200, 200));
min-height: 20;
border-radius:2px;
image:url(:/images/vScrollHandle.png);
}
QScrollBar::handle:vertical:hover
{
background:qlineargradient(spread:reflect, x1:0, y1:0, x2:1, y2:0,
stop:0 rgb(233,247,253) stop:0.4 rgb(181,228,247), stop:1 rgb(102,186,221));
border:1px solid rgb(24,89,138);
}
QScrollBar::handle:vertical::disabled
{
background:rgb(240,240,240);
image:url(:/images/vScrollHandle.png);
}
QScrollBar::add-line:vertical
{
height:10px;
background:rgb(200,200,200);
subcontrol-position:bottom;
}
QScrollBar::sub-line:vertical
{
height:10px;
background:rgb(200,200,200);
subcontrol-position:top;
}
QScrollBar::add-page:vertical,QScrollBar::sub-page:vertical
{
background:qlineargradient(spread:reflect, x1:0, y1:0, x2:1, y2:0,
stop:0 rgba(180, 180, 180, 255),
stop:1 rgba(210, 210, 210, 255));
border:1px,solid,rgb(134,134,134);
}
QScrollBar::up-arrow:vertical
{
border-height:0px;
min-height:16px;
max-width:16px;
image:url(:/images/scrollUp.png);
}
QScrollBar::down-arrow:vertical
{
/*border-style:outset;*/
border-height:0px;
min-height:16px;
max-width:16px;
image:url(:/images/scrollDown.png);
}

[wlxj8284]

在QSS中设置QScrollBar的handle的image即可