QT样式表的使用

原创已于 2022-09-05 15:22:08 修改 · 1.9k 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#qt #开发语言

于 2022-09-05 15:16:31 首次发布

本文详细介绍了如何在QTdesigner中通过改变样式选项来定制控件的外观，包括字体颜色、字号、背景色等。通过示例代码展示了QPushButton的不同状态（普通态、鼠标悬停态、按下态）下的样式设置，如边框图片、颜色变化及内边距调整，帮助开发者实现更加美观和交互丰富的GUI设计。

1、在QT designer界面，选择待编辑控件，右击选择“改变样式”选项。

2、在其中编辑控件文本字体颜色、字号、背景色等。

3、常用的样式表代码如下：

QPushButton#pushButton_3
{
	border-image: url(:/Demo/Resources/icon/Min.png);
}
QPushButton#pushButton_3:hover
{
	border-color: rgb(85, 255, 255);
	border: 2px solid rgb(15 , 150 , 255);
}
QPushButton#pushButton_3:pressed
{
    
}
QPushButton#pushButton_3:move
{
    
}
QPushButton#pushButton_3:release
{
    
}

/*按钮普通态*/
QPushButton
{
    /*字体为微软雅黑*/
    font-family:Microsoft Yahei;
    /*字体大小为20点*/
    font-size:20pt;
    /*字体颜色为白色*/    
    color:white;
    /*背景颜色*/  
    background-color:rgb(14 , 150 , 254);
    /*边框圆角半径为8像素*/ 
    border-radius:8px;
}

/*按钮停留态*/
QPushButton:hover
{
    /*背景颜色*/  
    background-color:rgb(44 , 137 , 255);
}

/*按钮按下态*/
QPushButton:pressed
{
    /*背景颜色*/  
    background-color:rgb(14 , 135 , 228);
    /*左内边距为3像素，让按下时字向右移动3像素*/  
    padding-left:3px;
    /*上内边距为3像素，让按下时字向下移动3像素*/  
    padding-top:3px;
}