一个比较挫的drak style 的设置界面,原谅我的设计能力。。。
主要是QSS的学习,使界面美化与业务逻辑分离。
不想说什么语法,什么介绍,直接上QSS加注释,方便自己查看。
QSpinBox,QComboBox{ //设置spinBox combox 类和他们的所有子类的style
border:1px solid #242424; //设置border
border-radius:3px;//设置border圆角
padding:2px;
background:#484848; //背景颜色
/*selection-background-color:#484848;
selection-color:#DCDCDC;*/
color : white;//文本颜色,ComboBox上显示的,不是item里的
}
QComboBox::down-arrow{//设置combox 的下三角 style
image:url(:/psblack/add_bottom.png); //设置图片
width:10px;
height:10px;
right:2px;
}
QComboBox::drop-down:on{
top:1px;
}
QComboBox::drop-down{
subcontrol-origin:padding; //在padding区域 显示三角
subcontrol-position:top right; //设置子控件的位置 右上
width:15px;
border-left-width:0px;
border-left-style:solid;
border-top-right-radius:3px;
border-bottom-right-radius:3px;
border-left-color:#242424;
}
QComboBox:hover{ //QComboBox的鼠标滑过 设置渐变色
background:qlineargradient(spread:pad,x1:0,y1:0,x2:0,y2:1,stop:0 gray,stop:1 #525252);
}
QComboBox QAbstractItemView { //设置IQComboBox里的item 属性
/* border: 2px solid darkgray;*/
selection-color: white; //选泽时的字体颜色
selection-background-color: #484848;//选泽时的背景颜色
color : black;//未被选择的字体颜色
border: 0px;
outline:0px; //去掉虚线
}
QRadioButton{ //设置QRadioButton的字体颜色
color : white;
}
QRadioButton::indicator::unchecked{ //当radiobutton不被选中是的圆圈图片
image:url(:/psblack/radiobutton_unchecked.png);
}
QRadioButton::indicator::unchecked:disabled{//当radiobutton不被选中同时disabled状态时,的圆圈图片
image:url(:/psblack/radiobutton_unchecked_disable.png);
}
QRadioButton::indicator::checked{ //同理选中时
image:url(:/psblack/radiobutton_checked.png);
}
QRadioButton::indicator::checked:disabled{
image:url(:/psblack/radiobutton_checked_disable.png);
}
QTabWidget::pane{ //好像是tabwidget的窗口
background-color:#484848;
}
/* shuxing wei tab=true de suoyou widget baohan ta de zilei keyi
ba tabwidget nong quan hei le */
QWidget[tab="true"],.QWidget,QTabWidget{
background:#484848;
}
.QWidget{//只是设置QWidget这一类,不会涉及到子类
border-bottom:1px solid #242424;
}
QTabBar::tab{ //设置tab标签
border:1px solid #242424;
color:#DCDCDC;
margin:0px;
min-height: 12;
background:qlineargradient(spread:pad,x1:0,y1:0,x2:0,y2:1,stop:0 #646464,stop:1 #525252);
}
/*tabBar bei xuanzhong he shubiao huaguo*/
QTabBar::tab:selected,QTabBar::tab:hover{
border-style:solid;
border-color: white;
background:#444444;
}
/* shangfang de tabBar hai you zuo you xia fang de bar */
//设置在上面的tab标签,默认tab在控件上方
QTabBar::tab:top,QTabBar::tab:bottom{
padding:3px 8px 3px 8px;
}
/*QTabBar::tab:left,QTabBar::tab:right{
padding:8px 3px 8px 3px;
} 被选中和鼠标滑过时*/
QTabBar::tab:top:selected,QTabBar::tab:top:hover{
border-width:0px 0px 2px 0px;
border-left-width:1px;
border-left-color:#242424;
border-right-width:1px;
border-right-color:#242424;
}
.QLabel:disabled{
color : gray;
}
QCheckBox,QLabel{
color : white;
}
QCheckBox:disabled{
color : gray;
}
QCheckBox::indicator:unchecked{//QCheckbox的方框
image:url(:/psblack/checkbox_unchecked.png);
}
QCheckBox::indicator:unchecked:disabled{
image:url(:/psblack/checkbox_unchecked_disable.png);
}
QCheckBox::indicator:checked{
image:url(:/psblack/checkbox_checked.png);
}
QCheckBox::indicator:checked:disabled{
image:url(:/psblack/checkbox_checked_disable.png);
}
QCheckBox::indicator:indeterminate{
image:url(:/psblack/checkbox_parcial.png);
}
QCheckBox::indicator:indeterminate:disabled{
image:url(:/psblack/checkbox_parcial_disable.png);
}
.QGroupBox{
border:1px solid darkgray;
border-radius:4px;
margin-top:8px;
padding: 6px 0;
}
.QGroupBox::title{ //groupbox 的 标题
subcontrol-origin:margin;
position:relative;
left:10px;
color : white;
}
QLineEdit {
border: 1px solid gray;
border-radius: 4px;
padding: 0 0;
background: gray;