Qt StyleShett 实现 Metro 风格之 - QPushButton

时间 2020-08-05 标签 qt styleshett 实现 metro 风格 qpushbutton

今天查了一些文档，准备本身一步一步地使用Qss来模仿一下windows的Metro风格，我不会CSS也不会Qss全是查文档而来的，因此有点粗糙，今天是QPushbutton的Qss代码：windows

 
       01 
       QPushButton 
     
       02 
       { 
     
       03 
           color: rgb(255, 255, 255); 
     
       04 
           background-color: rgb(167, 205, 255); 
     
       05 
           border:none; 
     
       06 
           padding: 3px; 
     
       07 
           font-family: "Verdana"; 
     
       08 
           font-size: 15px; 
     
       09 
           text-align: center; 
     
       10 
       } 
     
       11 
       QPushButton:hover, QPushButton:pressed , QPushButton:checked 
     
       12 
       { 
     
       13 
           background-color: rgb(85, 170, 255); 
     
       14 
           text-align: right; 
     
       15 
           padding-right: 20px; 
     
       16 
           font-weight:100 
     
       17 
       } 
     
       18 
       QPushButton:hover 
     
       19 
       { 
     
       20 
           background-image: url(:/icon/icons/dark/appbar.navigate.next.png); 
     
       21 
           background-repeat:no-repeat; 
     
       22 
           background-position: center left; 
     
       23 
       } 
     
       24 
       QPushButton:pressed, QPushButton:checked 
     
       25 
       { 
     
       26 
           background-image: url(:/icon/icons/light/appbar.navigate.next.png); 
     
       27 
           background-repeat:no-repeat; 
     
       28 
           background-position: center left; 
     
       29 
       }

其中用到了两张资源图片（http://modernuiicons.com/ 下载的Metro图标）做为美化，在hovering到按钮上面的时候和按下的时候用不一样的颜色。app

下面是效果图。ui