QT教程-二十二,QSS界面/控件美化

目录

1. QSS 的基本语法

2. 选择器

3. 常用属性

4. 应用 QSS

5. 常见问题

6. 示例

7. 基本控件qss美化示例

1. 按钮(QPushButton)美化示例

2. 标签(QLabel)美化示例

3. 输入框(QLineEdit)美化示例

4. 滑动条(QSlider)美化示例

5. 进度条(QProgressBar)美化示例

6. 复选框(QCheckBox)美化示例

7. 下拉框(QComboBox)美化示例


        QSS(Qt Style Sheet)是 Qt 框架中用于定制界面样式的一种方式,类似于 CSS(层叠样式表)。通过 QSS,开发者可以轻松地改变 Qt 应用程序的外观,包括窗口、按钮、标签等各种控件的样式。以下是 QSS 的详细解释:

1. QSS 的基本语法

QSS 的基本语法与 CSS 类似,由选择器、属性和值组成。基本格式如下:

选择器 {
    属性1: 值1;
    属性2: 值2;
    ...
}

2. 选择器

选择器用于指定应用样式的控件。以下是一些常见的选择器类型:

  • 类选择器:选择特定类的控件。例如:

    QPushButton {
        color: red;
    }
    

    上面的代码会将所有 QPushButton 的颜色设置为红色。

  • id选择器:选择具有特定对象名的控件。QSS 不直接支持 CSS 中的 # 符号,而是使用 QObject::setObjectName() 来设置对象名,然后在 QSS 中用 # 来选择。例如:

    #myButton {
        background-color: blue;
    }
    

    上面的代码会将对象名为 myButton 的按钮的背景色设置为蓝色。

  • 子控件选择器:选择控件的子控件。例如:

    QComboBox::drop-down {
        image: url(dropdown.png);
    }
    

    上面的代码会将 QComboBox 的下拉按钮的图标设置为 dropdown.png

  • 伪状态选择器:选择处于特定状态的控件。例如:

    QPushButton:hover {
        background-color: yellow;
    }
    

    上面的代码会在鼠标悬停在按钮上时,将按钮的背景色设置为黄色。

3. 常用属性

以下是一些常用的 QSS 属性:

  • color:设置文本颜色。例如:

    QLabel {
        color: green;
    }
    
  • background-color:设置背景颜色。例如:

    QFrame {
        background-color: #f0f0f0;
    }
    
  • border:设置边框。例如:

    QLineEdit {
        border: 2px solid gray;
    }
    
  • font:设置字体。例如:

    QTextEdit {
        font: bold 12pt "Arial";
    }
    
  • padding:设置内边距。例如:

    QPushButton {
     

你可能感兴趣的:(Qt开发基础教程,qt,开发语言,c++,qss)