qt 自定义控件样式01-QComboBox

一、效果

颜色没有定的非常亮丽,可以自行设置,只是将日常设置QComboBox样式用到的一些属性列出来,后续系列也是一样
二、qss样式

QComboBox 
{
border: 1px solid gray;//设置边界线样式
border-radius: 3px;//设置控件四周圆角
padding: 1px 18px 1px 3px;//设置下拉框未打开时显示的内容与边界的距离
min-width: 60px;//最小宽度
}
QComboBox:editable 
{
    background: white;//QComboBox可编辑状态下的背景颜色,需设置其属性可编辑后才能显示,默认是不可编辑的
}
QComboBox:!editable, QComboBox::drop-down:editable //QComboBox不可编辑、下拉子控件可编辑的时候
{
background: qlineargradient//背景线性渐变
(
x1: 0, y1: 0, x2: 0, y2: 1,//初始位置,和结束位置
stop: 0 #E1E1E1, stop: 0.4 #DDDDDD,//stop第一个值为位置,第二个值为颜色RGB值
stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3
);
}
/* QComboBox gets the "on" state when the popup is open */
QComboBox:!editable:on, QComboBox::drop-down:editable:on //设置了控件和子控件在下拉框下拉后的样式
{
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #D3D3D3, stop: 0.4 #D8D8D8,
stop: 0.5 #DDDDDD, stop: 1.0 #E1E1E1);
}
QComboBox:on //下拉框下拉的时候
{ 
/* shift the text when the popup opens */
padding-top: 3px;//下拉框内容距离边界顶部距离
padding-left: 4px;//下拉框内容距离边界左边距离
}
QComboBox::drop-down //下拉按钮
{
subcontrol-origin: padding;//子控件定位位置
subcontrol-position: top right;//子控件水平和竖直对齐方向
width: 15px;
border-left-width: 1px;//边界左边的宽度
border-left-color: darkgray;//边界左边的颜色
border-left-style: solid; //边界左边的形状
border-top-right-radius: 3px;//边界顶部右边的圆角
border-bottom-right-radius: 3px;//边界底部右边的圆角
}
QComboBox::down-arrow //QComboBox的子控件,图中放置箭头的部分
{
    image: url(:/img/row.png);//子控件的图片
}
QComboBox::down-arrow:on
{ /* shift the arrow when popup is open */
    top: 1px;//子控件下拉时,顶部和左边的距离
    left: 1px;
}

你可能感兴趣的:(qt自定义控件,QComboBox样式,QComboBox,美化)