Qss文件设置Qt界面风格

背景:需要协商才能修改软件界面的风格,所以要留出通用的接口,于是选择使用QSS文件设置软件风格。
一、创建Qss文件
直接创建以.qss为后缀的文件
在这里插入图片描述
二、Qt使用Qss文件有两种办法
1、第一种办法,添加资源文件.qrc,然后在qrc文件中添加qss文件,这一种只能是编译之前就已经写好的
在Qt工程文件中,选择工程右键->添加新文件。
在这里插入图片描述创建好qrc文件后,再将qss文件加入其中
在这里插入图片描述2、第二种方法就是直接使用qss文件,将Qss文件放在指定位置,软件运行时会去读取Qss文件,根据Qss文件设置软件风格。
在这里插入图片描述三、Qss文件设置软件风格
1、假如使用Qss文件使用第一种方法

QFile file(":/qss.qss"); // 将qss文件加入qrc文件中的情况时
file.open(QFile::ReadOnly);
if (file.exists() )
{
    if(file.isOpen())
    {
        QString styleSheet = QLatin1String(file.readAll());
        qApp->setStyleSheet(styleSheet);
        file.close();
        qDebug() << "success";
    }
    else
    {
        qDebug()<< "error";
    }
}

2、使用第二种办法,直接根据路径打开qss文件

QFile file("./qss.qss");
 file.open(QFile::ReadOnly);
 if (file.exists() )
 {
     if(file.isOpen())
     {
         QString styleSheet = QLatin1String(file.readAll());
         qApp->setStyleSheet(styleSheet);
         file.close();
         qDebug() << "success";
     }
     else
     {
         qDebug()<< "error";
     }
 }

四、QSS文件中设置背景图
1、使用qrc文件中的图片
在这里插入图片描述2、使用指定路径的图片
在这里插入图片描述
在这里插入图片描述

QMainWindow
{
    background:url(./picture/mainwindow.png);
}

五、Qss文件说明
1、主界面设置背景

QMainWindow
{
    background:url(./picture/mainwindow.png);
}

2、按键设置状态

/* 正常状态或者鼠标松开按钮的状态,按钮颜色 */
QPushButton
{
    background-color:rgb(240,255,255);
    color: rgb(0, 0, 2);
    border-style: outset;
    border-color: beige;
    border-radius: 10px;
}

/* hover按钮悬浮,鼠标悬浮在按钮上的状态,按钮颜色 */
QPushButton:hover
{
    background-color:rgb(14, 220, 0);
    border-radius: 10px;
    color: rgb(0, 0, 0);
}

 /* 鼠标按下按钮时的状态,按钮颜色 */
QPushButton:checked
{
    background-color:rgb(14, 170, 79);
    border-radius: 10px;
    color: rgb(255, 255, 0);
}

3、指定按键设置背景

/* 结束视频播放按键 */
QPushButton#playStopButton
{
    background:url(./picture/stop.png);
}

/* 音量显示 */
QPushButton#volumeSetButton
{
    background:url(./picture/volume.png);
}

/* 折叠按键 */
QPushButton#foldSetWidgetButton
{
    background:url(./picture/foldSet.png);
}
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值