在属性编辑器中设置stylesheet来修改界面
1.QRadioButton
QRadioButton{
spacing: 5px;
}
QRadioButton::indicator{
width: 45px;
height: 30px;
}
QRadioButton::indicator:unchecked{
image:url(:/RoomService/switch_off.png);
}
QRadioButton::indicator:checked{
image:url(:/RoomService/switch_on.png);
}
QRadioButton::indicator:checked:disabled{
image:url(:/RoomService/switch_off.png);
}
/** style2**/
QRadioButton{
margin: 6px 4px 6px 4px;
}
QRadioButton:unchecked{
border-image: url(:/tools/tools/pick-normal.png);
}
QRadioButton:checked{
border-radius: 2px;
background-color:#33000000;
border-image: url(:/tools/tools/pick-press.png);
}
QRadioButton::indicator {
width: 28px;
height: 24px;
image: none;
border-image: url(:/tools/tools/eraser-normal.png);
}
QRadioButton::indicator:hover {
border-image: url(:/tools/tools/eraser-hover.png);
}
2.QSlider
QSlider::groove:horizontal {
border: 1px solid #999999;
height: 5px;
border-radius: 9px;
margin: 0px;
left : 9px;
right: 9px;
}
QSlider::handle:horizontal {
width: 18px;
background-image: url(:/RoomService/slider.png);
margin: -7px -7px -7px -7px;
}
QSlider::add-page:qlineargradient {
background: lightgrey;
border-top-right-radius: 9px;
border-bottom-right-radius: 9px;
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
}
QSlider::sub-page:qlineargradient {
background: #006eff;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
border-top-left-radius: 9px;
border-bottom-left-radius: 9px;
}
3.Qbutton
QPushButton {
border: none;
background: #006eff;
color: #ffffff;
font: 10pt "Microsoft YaHei";
}
QPushButton:hover {
background: #0068f2;
}
QPushButton:pressed {
background: #0062e5;
}
QPushButton:disable {
border: 1px solid #d5d5d5;
color: #bbbbbb;
background: #f2f2f2;
}
/**close btn**/
QPushButton{
font: 10pt "Microsoft YaHei";
border: none;
image: url(:/RoomService/close-button.png);
background-position: center;
}
QPushButton:hover{
background-color: rgb(255, 99, 71);
}
QPushButton:pressed{
background-color: rgb(255, 99, 71);
}
4.QTabWidget
#tabWidget{
background-color: #ffffff;
}
QTabWidget::pane { /* The tab widget frame */
top: 0px;
border-top: 1px solid #dddddd;
margin-left: 0px;
margin-right: 0px;
margin-bottom:0px;
}
/* Style the tab using the tab sub-control. Note that
it reads QTabBar _not_ QTabWidget */
QTabBar::tab {
margin-top: 16px;
margin-left: 2px;
padding-left:0px;
padding-right:0px;
height:18px;
width: 84px;
}
QTabBar::tab:selected {
font: bold 11pt "Microsoft YaHei";
color: #006eff;
background: #ffffff;
border-bottom: 2px solid #006eff;
}
QTabBar::tab:!selected {
margin-top: 16px; /* make non-selected tabs look smaller */
font: 11pt "Microsoft YaHei";
color: #444444;
background: #ffffff;
}
CustomTextEdit
#tb_msg{
border: none;
background: #f2f2f2;
font: 9pt "Microsoft YaHei";
color: #bbbbbb;
}
/**dd**/
QWidget {
background-color: rgb(229, 240, 255);
border-style: solid;
border-width: 1px;
border-color: rgb(151, 199, 255);
}
4.QCheckBox
QCheckBox{
margin: 6px 4px 6px 4px;
}
QCheckBox:unchecked{
border-image: url(:/tools/tools/pick-normal.png);
}
QCheckBox:checked{
border-radius: 2px;
background-color:#33000000;
border-image: url(:/tools/tools/pick-press.png);
}
QCheckBox::indicator {
background-color: #0075ff;
margin:5px;
width: 18px;
height: 14px;
image: none;
}
eg:运行效果
eg:设计效果 class QMdiArea
2.
eg:资源图片