Qt 实战（11）样式表 | 11.2、使用样式表

前言：

在Qt框架中，样式表（Style Sheets）是一种功能强大的工具，它允许开发者以一种简洁而高效的方式自定义应用程序的用户界面。Qt样式表借鉴了Web开发中CSS的概念，使得开发者能够轻松调整组件的外观，包括颜色、字体、边框、边距等。本文将详细介绍如何使用Qt样式表来美化应用程序界面。

一、使用样式表

1、盒子模型

Qt样式表的盒子模型（Box Model）是一种用于描述Qt组件（widgets）布局和尺寸的概念框架。它借鉴了Web开发中CSS的盒子模型，使得Qt开发者能够以统一和直观的方式管理组件的外观和布局。盒子模型由以下几个关键部分组成：

• 内容区域（Content ）： 这是组件的实际显示区域，例如按钮的标签、文本框的文本等。
• 填衬（Padding）： 填衬是围绕内容区域的内边距，用于在内容和边框之间提供空间。填衬可以是均匀的，也可以针对每个方向（上、右、下、左）单独设置。
• 边框（Border）： 边框是围绕填衬和内容区域的边界线，用于定义组件的边界和外观。边框的宽度、样式（如实线、虚线、点线等）和颜色都可以自定义。
• 边距（Margin）： 边距是组件外部的空间，用于在组件与其他组件或容器边界之间提供距离。边距同样可以是均匀的，也可以针对每个方向单独设置。

2、应用样式表

Qt样式表可以通过多种方式应用到应用程序中：

2.1、全局应用

使用QApplication::setStyleSheet()函数，将样式表应用到整个应用程序。

QApplication app(argc, argv);  
app.setStyleSheet("QPushButton { background-color: lightblue; color: darkblue; font-size: 16px; }");

2.2、局部应用

使用QWidget::setStyleSheet()函数，将样式表应用到特定的窗口或组件。

QPushButton *button = new QPushButton("Click Me", this);  
button->setStyleSheet("background-color: lightgreen; color: darkgreen;");

2.3、通过文件应用

将样式表定义保存为.qss文件，然后在程序中读取该文件并应用样式表。

• 创建.qss文件：

新建一个style1.qss文件，放在工程目录下，文件内容如下：

QPushButton
{
   
   
    border-radius:5px;
    background:rgb(150, 190, 60);
    color:red;
    font-size:15px;
}

style1.qss文件与resource.qrc文件目录结构如下：

工程目录--
 - resource.qrc
 - style1