文章目录

1.下载并安装 Qt5.14.2&VS2019
2.使用vs2019创建空白Qt项目
- 2.1 打开vs2019
- 2.2 创建新项目
- 2.3 创建完成，运行
3.使用QSS进行界面美化
- 3.1 下载样式文件，解压将其放到工程路径下
- 3.2 向qrc文件中添加文件
- 3.3 在程序中加载css文件
- 3.4 加载样式文件函数封装

本篇文章使用的CSS文件由Qt大佬（飞扬青云）开发，他的个人主页：

码云：https://gitee.com/feiyangqingyun
github：https://github.com/feiyangqingyun
CSDN：https://me.csdn.net/feiyangqingyun

1.下载并安装 Qt5.14.2&VS2019

第一步： Qt5.14.2安装
参考： Qt 5.14.2安装教程

第二步： VS2019安装

我们在这里选择社区版：
https://visualstudio.microsoft.com/zh-hans/vs/
下载软件
安装配置
Qt Options配置
配置Qt路径

2.使用vs2019创建空白Qt项目

2.1 打开vs2019

2.2 创建新项目

正在创建
下一步
配置编译器
配置文件名称
正在创建

2.3 创建完成，运行

空白项目创建成功
使用Qt Designer编辑ui文件，添加一些按钮控件，保存
再次运行，查看效果

3.使用QSS进行界面美化

Qt QSS样式文件下载：
https://download.csdn.net/download/u014779536/12968176

3.1 下载样式文件，解压将其放到工程路径下

解压，注意路径
检查文件是否齐全

3.2 向qrc文件中添加文件

双击qrc文件
添加新的空前缀 /
添加文件
全选添加
依次添加flatwhite,lightblue,psblack目录下的全部文件
flatwhite 目录
lightblue 目录
psblack 目录

检查文件URL是否符合规格！！
CSS文件：:/qss/flatwhite.css (必须一致)

PNG文件：:/qss/flatwhite/add_bottom.png (必须一致)

依次类推~

保存！保存！保存！

现在运行程序还是没有样式的，因为我们还没在界面中加载样式：

3.3 在程序中加载css文件

来到构造函数，在顶端引入头文件：

#include <QtWidgets/QApplication>
#include <QFile>

在构造函数中加载样式表：

    //加载样式表QString qss;QFile file(":/qss/lightblue.css");if (file.open(QFile::ReadOnly)){//用readAll读取默认支持的是ANSI格式,如果不小心用creator打开编辑过了很可能打不开qss = QLatin1String(file.readAll());QString paletteColor = qss.mid(20, 7);qApp->setPalette(QPalette(QColor(paletteColor)));qApp->setStyleSheet(qss);file.close();}

运行，展示

3.4 加载样式文件函数封装

void XXXSystem::initQssStyle(QColor color)
{QString cssStr;if (color == Qt::white)cssStr = ":/qss/flatwhite.css";else if (color == Qt::black)cssStr = ":/qss/psblack.css";elsecssStr = ":/qss/lightblue.css";//加载样式表QString qss;QFile file(cssStr);if (file.open(QFile::ReadOnly)){//用readAll读取默认支持的是ANSI格式//如果不小心用creator打开编辑过了很可能打不开qss = QLatin1String(file.readAll());QString paletteColor = qss.mid(20, 7);qApp->setPalette(QPalette(QColor(paletteColor)));qApp->setStyleSheet(qss);file.close();}
}

使用方式：

// 蓝色风格
this->initQssStyle(Qt::blue);
// 白色风格
this->initQssStyle(Qt::white);
// 黑色风格
this->initQssStyle(Qt::black);

Qt5.14.2 VS2019创建Qt项目并使用QSS美化界面(附QSS资源下载)相关推荐

37、VS2019创建QT基础工程
一.VS2019安装Qt Visual Studio Tools插件如果下载缓慢,可以复制下载链接,然后借助迅雷下载,操作如下二.VS2019中对Qt Visual Studio Tools进行配 ...
vs2019中如何创建qt项目_VS2019创建新项目居然没有.NET Core3.0的模板?
今天是个值得欢喜的日子,因为VS2019在今天正式发布了.作为微软粉,我已经用了一段时间的VS2019 RC版本了.但是,今天有很多小伙伴在我的<ASP.NET Core 3.0 上的gRPC服 ...
vs2019中如何创建qt项目_在VS2015中创建Qt项目【VS+Qt项目开发系列】（二）
在VS2015中创建Qt项目[VS+Qt项目开发系列](二) 发布时间:2018-04-20 22:44, 浏览次数:1269 , 标签: VS Qt 在上一篇[VS+Qt项目开发](一)在VS201 ...
C++后续：QT学习（Qt概述，创建QT项目）
目录声明一. Qt概述 1.1 什么是Qt 1.2 Qt的发展史 1.3 Qt支持的平台 1.4 Qt版本 1.5 Qt的下载与安装 1.6 Qt的优点二.创建 Qt项目 2.1 如何创建 2. ...
Vs2019创建新项目时，没有任何模板，导致无法创建新项目
Visual Studio创建新项目时,没有任何模板,导致无法创建新项目问题描述解决办法问题描述 Vs2019创建新项目时,没有任何模板,导致无法创建新项目. 之前都是正常的,今天突然发现没法创 ...
Exception from hresult 0x80041FE2,vs2015创建QT项目报错
vs2015下创建qt项目报错:Exception from hresult 0x80041FE2 安装好vs2015,qt插件等配置好一切,感觉没什么问题的时候,正开心的准备新建一个QT项目测试一下 ...
Qt 局域网聊天(功能完善，界面美观，免费下载)
Qt 局域网聊天(功能完善,界面美观,免费下载) 高清截图登陆界面聊天界面 GIF 登陆界面发送消息发送图片设置头像历史消息查看名称房间人数调整大小窗体全屏截屏(最新的Ubunt ...
vs2019中如何创建qt项目_一、用于VS2019的QT配置
一.前言本期间的主要目的是最后能够使用VS开发关于QT为界面的程序,同时能够使用VTK和ITK程序,这是第一部分. 因为之前查看的有关博客随着时间没有跟随版本变化,所以记录以下最新版本的QT的安装, ...
vs2019中如何创建qt项目_Qt在vs2019中使用及设置方法
下载对应Qt扩展在vs2019中搜索下载qt vs tools 如图所示下载后会自动安装,完成后重启在进行下一步设置. 如果下载卡住或者太慢可以采用网站下载. 在visual studio网站中下载 ...
创建QT项目时只有.pro文件，源文件和头文件
[问题描述] [原因分析] 问题原因:新建工程时没有选择合适的构建套件 [解决方案] 1新建文件 2.选择kits 下面这一步可以根据自己的需要选择相关的Kits 3.此时生成的文件还只有一个.pro ...

Qt5.14.2 VS2019创建Qt项目并使用QSS美化界面(附QSS资源下载)