Qt中QSS文件的导入与使用-书写格式（笔记）

QSS文件的导入与使用（笔记）

想要美化Qt界面，就需要手动设定控件的qss样式

如果是直接在cpp文件中设定样式，则使用setStyleSheet(“xxx”)函数，但控件一多，你的代码界面就会变成这样

为了方便源码的阅读，这时要么考虑使用宏定义设定重复的qss，要么考虑使用qss文件

QSS文件加载

#include "mainwindow.h"
#include <QApplication>
#include <QFile>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    
    QFile qssFile("./qss/style.qss");//1.
    if(qssFile.open(QFile::ReadOnly)){//2.
    	a.setStyleSheet(qssFile.readAll());//3.
    }
    qssFile.close();//4.
    
    MainWindow w;
    w.show();

    return a.exec();
}

QSS文件书写格式

qss文件的书写格式类似css

设定所有该类控件的样式

控件类名{

样式声明；

}

例：

/*设置整个Widget样式*/
QWidget{
    background-color: rgb(255,255,255);
}
/*设置界面中所有QPushButton样式*/
QPushButton{
    font: 25 14pt "微软雅黑 Light";
    color: rgb(255,255,255);
    background-color: rgb(80,92,102);
    border: none;
    border-radius:8px;
}

设置控件处于某状态下(鼠标悬停/点击)的样式

控件类名:控件状态

{

样式声明；

}

/*hover样式*/
QPushButton:hover{
    background-color: rgb(95,107,117);
}
/*pressed样式*/
QPushButton:pressed{
    background-color: rgb(54,54,54);
}

设定控件类的子控件样式

/*设置QcomboBox的子控件下拉框样式*/
QComboBox QAbstractItemView::item{
    height:40px;
}

注意：此处QcomboBox的子控件下拉框，无法直接被qss文件设定样式，需要在构造函数中设定如下语句：

ui->filetype_choose_Box->setView(new QListView());

之后qss样式就可以使用了

设定控件类的子控件某种状态下样式

/*设置QcomboBox的子控件下拉框hover时的样式*/
QComboBox QAbstractItemView::item:hover{
    color: rgb(20,20,20);
    background-color: rgb(255,209,71);
}

设定具体控件对象的样式

控件类名#具体的对象名

{

样式声明；

}

/*设置SP_dir_Button控件的样式*/
QPushButton#SP_dir_Button{
    font:75 13pt "微软雅黑";
    color: rgb(20,20,20);
    background-color: rgba(255,209,71,0);
    border:2px solid rgb(20,20,20);
}
QPushButton#SP_dir_Button:hover{
    color: rgb(255,255,255);
    background-color: rgb(255,172,0);
    border: none;
}
QPushButton#SP_dir_Button:pressed{
    color: rgb(20,20,20);
    background-color: rgb(222,222,222);
}

加载qss前

加载qss后

QSS文件的代码块高亮显示

默认 QtCreator 没有qss代码高亮提示，可以在设置中添加如下设置：

1. 【工具】->【选项】->【环境】-> 【MIMF】类型
2. 已注册的MIME类型输入框中输入：text 查找
3. MIME类型中找到 text/css
4. 在下方 详情 - 模式 中追加 ;*qss