QT样式表单-QPushButton

QT的CSS样式表单是相当强大，跟网页设计的差不多，语法规范也大同小异。可以通过设置每个控件的样式，每个控件在不同状态下的样式，复合控件在不同环境下的样式。

QPushButton可以设置的选项有border，包含border-width、border-color、border-radius等。还可以设置QPushButton的前景和背景色。以及字体的样式和大小。

对于颜色，QT的样式表单还支持线性渐变和光圈渐变

UI源码，将如下文件保存为*.ui即可

<?xml version="1.0" encoding="UTF-8"?><ui version="4.0"> <class>testui</class> <widget class="QWidget" name="testui">  <property name="geometry">   <rect>    <x>0</x>    <y>0</y>    <width>712</width>    <height>428</height>   </rect>  </property>  <property name="windowTitle">   <string>testui</string>  </property>  <property name="autoFillBackground">   <bool>false</bool>  </property>  <property name="styleSheet">   <string notr="true">/*default button style sheet*/QPushButton:default{background-color:rgba(125,200,0,200);border-style:none;}QPushButton:default:hover{background-color:rgba(0,0,125,255);}/*flat button style sheet*//*flat QPushButton :default style is not work*/QPushButton:flat{background-color:yellow;border-width:3px;border-color:blue;border-style:solid;/*border的样式直接影响是否应该绘制边界，border样式必须要设置*/}/*most styles will not paint the button background unless the button is being pressed*/QPushButton:flat:hover{background-color:red;background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0, stop:0 rgba(255, 0, 0, 255), stop:0.166 rgba(255, 255, 0, 255), stop:0.333 rgba(0, 255, 0, 255), stop:0.5 rgba(0, 255, 255, 255), stop:0.666 rgba(0, 0, 255, 255), stop:0.833 rgba(255, 0, 255, 255), stop:1 rgba(255, 0, 0, 255));}</string>  </property>  <widget class="QPushButton" name="pushButton">   <property name="geometry">    <rect>     <x>30</x>     <y>30</y>     <width>121</width>     <height>41</height>    </rect>   </property>   <property name="styleSheet">    <string notr="true">QPushButton {    border: 2px solid #8f8f91;    border-radius: 6px;    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,                                      stop: 0 #f6f7fa, stop: 1 #dadbde);    min-width: 80px;}QPushButton:pressed {    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,                                      stop: 0 #dadbde, stop: 1 #f6f7fa);}QPushButton:flat {    border: none; /* no border for a flat push button */}QPushButton:default {    border-color: navy; /* make the default button prominent */}</string>   </property>   <property name="text">    <string>PushButton</string>   </property>  </widget>  <widget class="QPushButton" name="pushButton_2">   <property name="geometry">    <rect>     <x>30</x>     <y>100</y>     <width>121</width>     <height>41</height>    </rect>   </property>   <property name="styleSheet">    <string notr="true">QPushButton{font: 75 12pt "微软雅黑";border-width:2px;border-color:blue;background-color:yellow;border-style: solid;}QPushButton:pressed{background-color:rgb(0,0,125);}/*QPushButton:hover{background-color:green;}*/</string>   </property>   <property name="text">    <string>PushButton</string>   </property>  </widget>  <widget class="QPushButton" name="pushButton_3">   <property name="geometry">    <rect>     <x>30</x>     <y>160</y>     <width>121</width>     <height>51</height>    </rect>   </property>   <property name="styleSheet">    <string notr="true">QPushButton#pushButton_3{border-width:2px;border-style:solid;border-color:yellow;margin-width:3px;background-color:blue;color:green;font:75 12pt "微软雅黑";}</string>   </property>   <property name="text">    <string>PushButton</string>   </property>  </widget>  <widget class="QPushButton" name="pushButton_4">   <property name="geometry">    <rect>     <x>30</x>     <y>230</y>     <width>121</width>     <height>51</height>    </rect>   </property>   <property name="styleSheet">    <string notr="true">/*x direction linear gradiant*/background-color:qlineargradient(x1:0, y1:0, x2:0, y2:1, stop: 0 rgba(255,255,0,255), stop: 1 #654321);</string>   </property>   <property name="text">    <string>PushButton</string>   </property>  </widget>  <widget class="QPushButton" name="pushButton_5">   <property name="geometry">    <rect>     <x>180</x>     <y>30</y>     <width>121</width>     <height>41</height>    </rect>   </property>   <property name="text">    <string>Default_PushButton</string>   </property>   <property name="default">    <bool>true</bool>   </property>   <property name="flat">    <bool>false</bool>   </property>  </widget>  <widget class="QPushButton" name="pushButton_6">   <property name="geometry">    <rect>     <x>180</x>     <y>100</y>     <width>121</width>     <height>41</height>    </rect>   </property>   <property name="autoFillBackground">    <bool>false</bool>   </property>   <property name="text">    <string>Flat_PushButton</string>   </property>   <property name="flat">    <bool>true</bool>   </property>  </widget>  <widget class="QPushButton" name="pushButton_7">   <property name="geometry">    <rect>     <x>180</x>     <y>160</y>     <width>121</width>     <height>51</height>    </rect>   </property>   <property name="text">    <string>NoStyle_PushButton</string>   </property>  </widget> </widget> <layoutdefault spacing="6" margin="11"/> <resources/> <connections/></ui>

效果图：