自定义Qt控件
Qt提供了两种方式自定义控件的外观：样式表和QStyle。
自定义控件的使用有两种方式：提升法和插件法。提升法的优点是配置简单，缺点是在designer中不能使用自定义的属性和方法。插件法的优点是在designer中可以灵活使用，但是需要编译，配置复杂，涉及32bit/64bit的不同版本就更麻烦了。
目前我接触的应用场景，通过样式表+提升法的结合已经可以满足绝大部分需求。将常用的自定义控件总结在这，用于参考。
QPushButton
样式表：
QPushButton{color:white;border-image:url(:/ControlsDemo/Resources/pics/btn.png)}//按钮默认贴图
QPushButton:hover{border-image:url(:/ControlsDemo/Resources/pics/btnhover.png)}//按钮悬停贴图
QPushButton:pressed{border-image:url(:/ControlsDemo/Resources/pics/btnpressed.png)}//按钮按下贴图效果展示：
QCheckBox
样式表：
QCheckBox{color:white;spacing:2px;min-height:28px;min-width:60px;border:2px solid rgb(255, 87, 90,55)}
QCheckBox::indicator{min-width: 25px;min-height: 25px;border-radius:3px}
QCheckBox::indicator:unchecked{image:url(:/ControlsDemo/Resources/pics/checked.bmp)}
QCheckBox::indicator:checked{image:url(:/ControlsDemo/Resources/pics/unChecked.bmp)}效果展示：
QRadioButton
样式表：
QRadioButton{color:white;spacing: 5px;min-height:28px;min-width:60px;border:2px solid rgb(255, 87, 90,55)}
QRadioButton::indicator{min-width: 25px;min-height: 25px;}
QRadioButton::indicator:unchecked{image: url(:/ControlsDemo/Resources/pics/ratioOn.png)}
QRadioButton::indicator:checked{image: url(:/ControlsDemo/Resources/pics/ratioOff.png)}效果展示：
QScrollBar
样式表：
QScrollBar::vertical{min-width:24px;min-height:80px;background:#1e3c6e;margin:24px 0 24px 0;}//垂直滚动条
QScrollBar::handle:vertical{margin:2px;height:30px;background:#295dab;border-radius:5px}//滚动条滑块的样式
QScrollBar::handle:vertical:hover{background:#125ddb}
QScrollBar::handle:vertical:pressed{background:#125ddb}
QScrollBar::sub-line:vertical{border-image:url(:/ControlsDemo/Resources/pics/listUpArrow.png);height:24px;subcontrol-position:top;subcontrol-origin:margin}
QScrollBar::add-line:vertical{border-image:url(:/ControlsDemo/Resources/pics/listDownArrow.png);height:24px;subcontrol-position:bottom;subcontrol-origin:margin}
QScrollBar::sub-page:vertical{background:#1e3c6e;}//滑块与向上按钮之间区域
QScrollBar::add-page:vertical{background:#1e3c6e;}//滑块与向下按钮之间区域
//水平滚动条类似；效果展示：见QListView
QListView
样式表：
QListView{outline:0px;background: #1e3c6e}
QListView::item{color:white;min-height:30px;border-top:1px solid #63709c;}//列表项样式
QListView::item:selected{color:red;background:#295dab;}
QListView::item:hover{background:#295dab;}
// +自定义的QScrollBar qss效果展示：
QComboBox
样式表：
QComboBox{background:#1e3c6e;color:white;border:2px solid gray;border-radius:3px}
QComboBox::editable{background:#23b8ff;}
QComboBox::drop-down{border-radius:3px;min-width:30px;
border-image:url(:/ControlsDemo/Resources/pics/DownArrow.bmp);}
QComboBox::drop-down:pressed{position:relative;top:1px;left:1px}
QComboBox::drop-down:on {top: 1px;left: 1px}
效果展示：
QSpinBox
样式表：
QSpinBox{font:bold 19px;background:#1e3c6e;color:white;border:2px solid gray;border-radius:3px;padding-right:15px;selection-background-color: red;}
QSpinBox::down-button{border-radius:3px;min-width:30px;border-image:url(:/ControlsDemo/Resources/pics/DownArrow.bmp);}
QSpinBox::down-button:pressed{position:relative;top:1px;left:1px}
QSpinBox::up-button{border-radius:3px;min-width:30px;border-image:url(:/ControlsDemo/Resources/pics/UpArrow.bmp);}
QSpinBox::up-button:pressed{position:relative;top:1px;left:1px}效果展示：
QTableView
样式表：
*{background:#1e3c6e;color:white}
QHeaderView::section:horizontal{background:#1e3c6e;color:white;padding-left:8px;padding-top:5px;border:1px solid gray;min-height:30px}
QHeaderView::section:vertical{background:#1e3c6e;color:white;padding-left:5px;padding-top:3px;border:1px solid gray;min-width:30px}
QTableView{outline:0px;gridline-color:gray;}
QTableView::item{border:0px solid white;}
QTableView::item:hover{background-color:#2e4c7c;}
QTableView::item:selected{background-color:#3e5c7c;}
QTableView::item:editable{background-color:#3e5c7c;color:red}
QTableView QTableCornerButton::section{background-color:#1e3c6e;效果展示：
QTreeView
样式表：
QHeaderView::section{color:white;background-color: #1e3c6e;padding-left:8px;padding-top:5px;border:1px solid gray;min-height:30px}
QTreeView{alternate-background-color: blue;background-color: #1e3c6e; outline:0px; color:white }
QTreeView::item{border:1px solid transparent; border-bottom-color:gray;min-height:30px}
QTreeView::item:hover{background-color: #1e3c6e88;}
QTreeView::item:selected{background-color: #1e3c6e55;}
QTreeView::branch:adjoins-item {image:url(:/ControlsDemo/Resources/pics/rightArrow.png)
QTreeView::branch:open{image:url(:/ControlsDemo/Resources/pics/rightDownArrow.png)}效果展示：
