Qt界面优化(一): qss修改按钮样式

        Qt的界面可以通过qss语法优化,相对于MFC方便了很多,不用继承,重写按钮类的相关类和方法,用类似css样式表的语句即可进行美化,UI和主程序无关,例如下面是一个优化后的按:

                                                                  

       设置了倒角,边框,背景,鼠标停留,按下的效果,qss语句如下:

QPushButton
{  
    /* 前景色 */  
    color:green;  

    /* 背景色 */  
    background-color:rgb(223,223,223);  

    /* 边框风格 */  
    border-style:outset;  

    /* 边框宽度 */  
    border-width:0.5px;  

    /* 边框颜色 */  
    border-color:rgb(10,45,110);  

    /* 边框倒角 */  
    border-radius:10px;  

    /* 字体 */  
    font:bold 14px;  

    /* 控件最小宽度 */  
    min-width:100px;  

    /* 控件最小高度 */  
    min-height:20px;  

    /* 内边距 */  
    padding:4px;  
} 

/* 鼠标按下时的效果 */ 
QPushButton#pushButton:pressed 
{  
    /* 改变背景色 */  
    background-color:rgb(40,85,20);  

    /* 改变边框风格 */  
    border-style:inset;  

    /* 使文字有一点移动 */  
    padding-left:6px;  
    padding-top:6px;  
}

/* 按钮样式 */ 
QPushButton:flat 
{  
    border:2px solid red;  
} 

/*鼠标悬浮时的效果*/
QPushButton:hover
{
    color:#0000ff;
    background-color:rgb(210, 205, 205); /*改变背景色*/
    border-style:inset;/*改变边框风格*/
    padding-left:8px;
    padding-top:8px;
}

       如果有很多按钮,要每个按钮的样式都不同,可以在界面统一设置样式,不同的样式单独设置,不过要加上按钮的ID,例如在QPushButton后加上#myButton:

/*鼠标悬浮时的效果*/
QPushButton#myButton:hover
{
    color:#0000ff;
    background-color:rgb(100, 100, 20); /*改变背景色*/
    border-style:inset;/*改变边框风格*/
    padding-left:8px;
    padding-top:8px;
}

 

展开阅读全文

没有更多推荐了,返回首页