当前位置: 首页 > news >正文

基于 C++ Qt 的 Fluent Design 组件库 QFluentWidgets

简介
QFluentWidgets 是一个基于 Qt 的 Fluent Designer 组件库,内置超过 150 个开箱即用的 Fluent Designer 组件,支持亮暗主题无缝切换和自定义主题色。
在这里插入图片描述

编译示例
以 Qt5 为例(Qt6 也支持),将 libQFluentWidgets.dll、libFramlessHelperCore.dll和 libFramelessHelperWidgets.dll 放在 lib 文件夹中,QFluentWidgets 头文件放在 include 文件夹中,项目结构如下图所示
在这里插入图片描述

接着在终端输入指令进行编译,其中 -DCMAKE_PREFIX_PATH 用于设置本机 Qt5 SDK 的路径:

cmake -B ./build -DCMAKE_BUILD_TYPE=Release -DCMAKE_PREFIX_PATH="D:/Qt/5.15.2/mingw81_64" -G "MinGW Makefiles" .cd build
cmake --build . --config Release --target all --parallel

编译完成后可以在 build/bin 目录下看到所有生成的 exe 示例文件:

在这里插入图片描述

搭配 Fluent Designer
项目结构如下图所示:

在这里插入图片描述

其中 LoginWindow.py.ui 是使用 Fluent Designer 拖拽 PyQt-Fluent-Widgets 组件生成的 ui 文件,预览效果如下:

在这里插入图片描述

ui 代码如下,从 可以看到导入的组件来自 PyQt-Fluent-Widgets :

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0"><class>Form</class><widget class="QWidget" name="Form">省略代码</widget><customwidgets><customwidget><class>LineEdit</class><extends>QLineEdit</extends><header>qfluentwidgets</header></customwidget><customwidget><class>CheckBox</class><extends>QCheckBox</extends><header>qfluentwidgets</header></customwidget><customwidget><class>PrimaryPushButton</class><extends>QPushButton</extends><header>qfluentwidgets</header></customwidget><customwidget><class>HyperlinkButton</class><extends>QPushButton</extends><header>qfluentwidgets</header></customwidget><customwidget><class>BodyLabel</class><extends>QLabel</extends><header>qfluentwidgets</header></customwidget></customwidgets><resources><include location="login.qrc"/></resources><connections/>
</ui>

将该 ui 文件拖拽到 Fluent Studio 软件的设计师界面中,点击转换按钮,即可得到 C++ 组件库使用的 ui 文件。

在这里插入图片描述

项目使用的 CMakeLists.txt 代码如下:

set(DEMO_NAME LoginDemo)
cmake_minimum_required(VERSION 3.5)
project(${DEMO_NAME} VERSION 1.0)set(CMAKE_RUNTIME_OUTPUT_DIRECTORY ${CMAKE_BINARY_DIR}/bin)
set(CMAKE_CXX_STANDARD 17)
set(CMAKE_INCLUDE_CURRENT_DIR ON)
set(CMAKE_AUTOUIC ON)
set(CMAKE_AUTOMOC ON)
set(CMAKE_AUTORCC ON)find_package(Qt5 COMPONENTS Widgets Multimedia REQUIRED)# -----------------------------------------------------------------------------
file(GLOB inc_files ${CMAKE_SOURCE_DIR}/*.h)
file(GLOB src_files ${CMAKE_SOURCE_DIR}/*.cpp)qt5_wrap_ui(UI_FILES ${CMAKE_SOURCE_DIR}/ui/LoginWindow.ui)# add resource
SET(RCC_FILES ${CMAKE_SOURCE_DIR}/login.qrc)
qt5_add_resources(RCC_SOURCES ${RCC_FILES})# 设置 dll 文件夹
link_directories(${CMAKE_SOURCE_DIR}/lib)add_executable(${DEMO_NAME} ${src_files} ${inc_files} ${UI_FILES} ${RCC_SOURCES})target_link_libraries(${PROJECT_NAME} PRIVATE Qt::Widgets QFluentWidgets FramelessHelperCore FramelessHelperWidgets)# 设置头文件搜索路径
target_include_directories(${PROJECT_NAME}PRIVATE${CMAKE_SOURCE_DIR}/include${CMAKE_SOURCE_DIR}/include/framelesshelper/include${CMAKE_SOURCE_DIR}/include/framelesshelper/src/core${CMAKE_SOURCE_DIR}/include/framelesshelper/src/widgets${CMAKE_SOURCE_DIR}/include/framelesshelper/qmake/inc/core
)

拷贝 dll 到 bin 目录

configure_file(${CMAKE_SOURCE_DIR}/lib/libFramelessHelperCore.dll C M A K E S O U R C E D I R / b u i l d / b i n / l i b F r a m e l e s s H e l p e r C o r e . d l l C O P Y O N L Y ) c o n f i g u r e f i l e ( {CMAKE_SOURCE_DIR}/build/bin/libFramelessHelperCore.dll COPYONLY) configure_file( CMAKESOURCEDIR/build/bin/libFramelessHelperCore.dllCOPYONLY)configurefile({CMAKE_SOURCE_DIR}/lib/libFramelessHelperWidgets.dll C M A K E S O U R C E D I R / b u i l d / b i n / l i b F r a m e l e s s H e l p e r W i d g e t s . d l l C O P Y O N L Y ) c o n f i g u r e f i l e ( {CMAKE_SOURCE_DIR}/build/bin/libFramelessHelperWidgets.dll COPYONLY) configure_file( CMAKESOURCEDIR/build/bin/libFramelessHelperWidgets.dllCOPYONLY)configurefile({CMAKE_SOURCE_DIR}/lib/libQFluentWidgets.dll ${CMAKE_SOURCE_DIR}/build/bin/libQFluentWidgets.dll COPYONLY)
main.cpp 代码如下,可以看到这里通过 #include “ui_LoginWindow.h” 和 ui->setupUi(this) 来使用 Fluent 组件初始化界面:

#include "ui_LoginWindow.h"
#include <FramelessHelper/Core/FramelessManager>
#include <FramelessHelper/Widgets/FramelessWidgetsHelper>
#include <FramelessHelper/Widgets/StandardSystemButton>
#include <framelessconfig_p.h>
#include <QApplication>#include <QFluentWidgets/Common/FluentApp.h>
#include <QFluentWidgets/Common/Translator.h>
#include <QFluentWidgets/Window/FluentWindow.h>using namespace qfluentwidgets;
FRAMELESSHELPER_USE_NAMESPACE
using namespace Global;class Demo : public QWidget
{Q_OBJECT
public:Demo(QWidget *parent = nullptr) : QWidget(parent), ui(new Ui::Form), titleBar(new SplitTitleBar(this)){// 启用无边框FramelessWidgetsHelper::get(this)->extendsContentIntoTitleBar();// 设置主题色setThemeColor("#28afe9");// 初始化 UIui->setupUi(this);setWindowIcon(QIcon(":/qfluentwidgets/images/logo.png"));setWindowTitle("QFluentWidgets");resize(1000, 650);setStyleSheet("Demo{background: transparent}");titleBar->titleLabel()->setStyleSheet("QLabel{ background: transparent; font: 13px 'Segoe UI'; padding: 0 4px; color: white}");// 隐藏系统标题栏的最大化和最小化按钮setWindowFlags(windowFlags() & ~Qt::WindowMinMaxButtonsHint & ~Qt::WindowCloseButtonHint);// 设置标题栏FramelessWidgetsHelper *helper = FramelessWidgetsHelper::get(this);helper->setTitleBarWidget(titleBar);helper->setSystemButton(titleBar->minButton(), SystemButtonType::Minimize);helper->setSystemButton(titleBar->maxButton(), SystemButtonType::Maximize);helper->setSystemButton(titleBar->closeButton(), SystemButtonType::Close);titleBar->raise();}protected:void resizeEvent(QResizeEvent *e){QWidget::resizeEvent(e);titleBar->resize(width(), titleBar->height());}private:Ui::Form *ui;SplitTitleBar *titleBar;
};int main(int argc, char *argv[])
{// enable dpi scale
#if (QT_VERSION > QT_VERSION_CHECK(5, 14, 0))QApplication::setHighDpiScaleFactorRoundingPolicy(Qt::HighDpiScaleFactorRoundingPolicy::PassThrough);
#endifQApplication::setAttribute(Qt::AA_EnableHighDpiScaling);QApplication::setAttribute(Qt::AA_UseHighDpiPixmaps);QApplication app(argc, argv);// 启用云母效果FramelessConfig::instance()->set(Option::EnableBlurBehindWindow);FramelessConfig::instance()->set(Option::DisableLazyInitializationForMicaMaterial);// 国际化ftranslator.load(QLocale());Demo w;w.show();return app.exec();
}#include "main.moc"

编译指令不变,双击 build/bin/LoginWindow.exe 就能看到效果:

在这里插入图片描述

写在最后
C++ 组件库需要许可证才能拿到头文件和动态链接库使用,如果想体验运行效果,可以安装 Python 组件库并运行各个 demo.py,或者下载编译好的 PyQt-Fluent-Widgets-Gallery,最终效果和 C++ 是一样的。

相关文章:

基于 C++ Qt 的 Fluent Design 组件库 QFluentWidgets

简介 QFluentWidgets 是一个基于 Qt 的 Fluent Designer 组件库&#xff0c;内置超过 150 个开箱即用的 Fluent Designer 组件&#xff0c;支持亮暗主题无缝切换和自定义主题色。 编译示例 以 Qt5 为例&#xff08;Qt6 也支持&#xff09;&#xff0c;将 libQFluentWidgets.d…...

OpenCV(6):图像边缘检测

图像边缘检测是计算机视觉和图像处理中的一项基本任务&#xff0c;它用于识别图像中亮度变化明显的区域&#xff0c;这些区域通常对应于物体的边界。是 OpenCV 中常用的边缘检测函数及其说明: 函数算法说明适用场景cv2.Canny()Canny 边缘检测多阶段算法&#xff0c;检测效果较…...

多模态人物视频驱动技术回顾与业务应用

一种新的商品表现形态&#xff0c;内容几乎存在于手淘用户动线全流程&#xff0c;例如信息流种草内容、搜索消费决策内容、详情页种草内容等。通过低成本、高时效的AIGC内容生成能力&#xff0c;能够从供给端缓解内容生产成本高的问题&#xff0c;通过源源不断的低成本供给倒推…...

星海智算+ DeepSeek-R1:技术突破与行业应用的协同革新

一、前言 在当今数字化时代&#xff0c;人工智能&#xff08;AI&#xff09;正以前所未有的速度改变着商业和社会的方方面面。最近爆火的DeepSeek-R1系列模型&#xff0c;以其强大的推理能力和在中文的推理、代码和数学任务高效的性能得到了全球用户的热议。该模型不仅在多项专…...

选择排序:简单高效的选择

大家好&#xff0c;今天我们来聊聊选择排序&#xff08;Selection Sort&#xff09;算法。这是一个非常简单的排序算法&#xff0c;适合用来学习排序的基本思路和操作。选择排序在许多排序算法中以其直观和易于实现的特点著称&#xff0c;虽然它的效率不如其他高效算法&#xf…...

考研/保研复试英语问答题库(华工建院)

华南理工大学建筑学院保研/考研 英语复试题库&#xff0c;由华工保研er和学硕笔试第一同学一起整理&#xff0c;覆盖面广&#xff0c;助力考研/保研上岸&#xff01;需要&#x1f447;载可到文章末尾见小&#x1f360;。 以下是主要内容&#xff1a; Part0 复试英语的方法论 Pa…...

ARM Cortex-M处理器中的MSP和PSP

在ARM Cortex-M系列处理器中&#xff0c;MSP&#xff08;主堆栈指针&#xff09;和PSP&#xff08;进程堆栈指针&#xff09;是两种不同的堆栈指针&#xff0c;主要用于实现堆栈隔离和提升系统可靠性。以下是它们的核心区别和应用场景&#xff1a; 1. 基本定义 MSP&#xff08;…...

《Keras 3 使用 NeRF 进行 3D 体积渲染》:此文为AI自动翻译

《Keras 3 使用 NeRF 进行 3D 体积渲染》 作者: Aritra Roy Gosthipaty, Ritwik Raha 创建日期: 2021/08/09 最后修改时间: 2023/11/13 描述: 体积渲染的最小实现,如 NeRF 中所示。 (i) 此示例使用 Keras 3 在 Colab 中查看 GitHub 源 介绍 在此示例中,我们展示了…...

Pytorch实现之浑浊水下图像增强

简介 简介:这也是一篇非常适合GAN小白们上手的架构文章!提出了一种基于GAN的水下图像增强网络。这种网络与其他架构类似,生成器是卷积+激活函数+归一化+残差结构的组成,鉴别器是卷积+激活函数+归一化以及全连接层。损失函数是常用的均方误差、感知损失和对抗损失三部分。 …...

【redis】数据类型之Bitfields

Redis的Bitfields&#xff08;位域&#xff09;与Bitmaps一样&#xff0c;在Redis中并不是一种独立的数据类型&#xff0c;而是一种基于字符串的数据结构&#xff0c;用于处理位级别的操作。允许用户将一个Redis字符串视作由一系列二进制位组成的数组&#xff0c;并对这些位进行…...

Python入门 — 类

面向对象编程中&#xff0c;编写表示现实世界中的事物和情景的类&#xff08;class&#xff09;&#xff0c;并基于这些类来创建对象&#xff08;object&#xff09;。根据类来创建对象称为实例化&#xff0c;这样就可以使用类的实例&#xff08;instance&#xff09; 一、创建…...

R-INLA实现绿地与狐狸寄生虫数据空间建模:含BYM、SPDE模型及PC先验应用可视化...

全文链接&#xff1a;https://tecdat.cn/?p40720 本论文旨在为对空间建模感兴趣的研究人员客户提供使用R-INLA进行空间数据建模的基础教程。通过对区域数据和地统计&#xff08;标记点&#xff09;数据的分析&#xff0c;介绍了如何拟合简单模型、构建和运行更复杂的空间模型&…...

Linux云计算SRE-第十五周

1.总结Dockerfile的指令和Docker的网络模式 一、Dockerfile 核心指令详解 1、基础构建指令 指令 功能描述 关键特性 FROM 指定基础镜像&#xff08;必须为首条指令&#xff09; - 支持多阶段构建&#xff1a;FROM node AS builder - scratch 表示空镜像 RUN 在镜像构建…...

2014年下半年试题一:论软件需求管理

论文库链接&#xff1a;系统架构设计师论文 论文题目 软件需求管理是一个对系统需求变更了解和控制的过程。需求管理过程与需求开发过程相互关联&#xff0c;初始需求导出的同时就要形成需求管理规划&#xff0c;一旦启动了软件开发过程需求管理活动就紧密相伴。 需求管理过程中…...

podman加速器配置,harbor镜像仓库部署

Docker加速器 registries加速器 [rootlocalhost ~]# cat /etc/redhat-release CentOS Stream release 8 [rootlocalhost ~]# cd /etc/containers/ [rootlocalhost containers]# ls certs.d policy.json registries.conf.d storage.conf oci registries.conf re…...

信息学奥赛一本通 1522:网络 | OpenJudge 百练 1144:Network

【题目链接】 ybt 1522&#xff1a;网络 OpenJudge 百练 1144:Network 【题目考点】 1. 图论&#xff1a;割点 【解题思路】 每个交换机是一个顶点&#xff0c;如果两地点之间有电话线连接&#xff0c;那么两顶点之间有一条无向边&#xff0c;该图是无向图。 初始时任何地…...

本地部署DeepSeek的硬件配置建议

本地部署DeepSeek的硬件配置需求因模型参数规模和部署工具不同而有所差异&#xff0c;以下是综合多个来源的详细要求&#xff1a; 1. 基础配置&#xff08;适用于7B参数模型&#xff09; 内存&#xff1a;最低8GB&#xff0c;推荐16GB及以上&#xff1b;若使用Ollama工具&…...

Redis面试题----Redis 的持久化机制是什么?各自的优缺点?

Redis 提供了两种主要的持久化机制,分别是 RDB(Redis Database)和 AOF(Append Only File),下面将详细介绍它们的原理、优缺点。 RDB(Redis Database) 原理 RDB 持久化是将 Redis 在某个时间点上的数据集快照以二进制文件的形式保存到磁盘上。可以通过手动执行 SAVE …...

C#实现本地AI聊天功能(Deepseek R1及其他模型)。

前言 1、C#实现本地AI聊天功能 WPFOllamaSharpe实现本地聊天功能,可以选择使用Deepseek 及其他模型。 2、此程序默认你已经安装好了Ollama。 在运行前需要线安装好Ollama,如何安装请自行搜索 Ollama下载地址&#xff1a; https://ollama.org.cn Ollama模型下载地址&#xf…...

Metal 学习笔记四:顶点函数

到目前为止&#xff0c;您已经完成了 3D 模型和图形管道。现在&#xff0c;是时候看看 Metal 中两个可编程阶段中的第一个阶段&#xff0c;即顶点阶段&#xff0c;更具体地说&#xff0c;是顶点函数。 着色器函数 定义着色器函数时&#xff0c;可以为其指定一个属性。您将在本…...

【Linux】shell脚本忽略错误继续执行

在 shell 脚本中&#xff0c;可以使用 set -e 命令来设置脚本在遇到错误时退出执行。如果你希望脚本忽略错误并继续执行&#xff0c;可以在脚本开头添加 set e 命令来取消该设置。 举例1 #!/bin/bash# 取消 set -e 的设置 set e# 执行命令&#xff0c;并忽略错误 rm somefile…...

生成 Git SSH 证书

&#x1f511; 1. ​​生成 SSH 密钥对​​ 在终端&#xff08;Windows 使用 Git Bash&#xff0c;Mac/Linux 使用 Terminal&#xff09;执行命令&#xff1a; ssh-keygen -t rsa -b 4096 -C "your_emailexample.com" ​​参数说明​​&#xff1a; -t rsa&#x…...

Neo4j 集群管理:原理、技术与最佳实践深度解析

Neo4j 的集群技术是其企业级高可用性、可扩展性和容错能力的核心。通过深入分析官方文档,本文将系统阐述其集群管理的核心原理、关键技术、实用技巧和行业最佳实践。 Neo4j 的 Causal Clustering 架构提供了一个强大而灵活的基石,用于构建高可用、可扩展且一致的图数据库服务…...

微服务商城-商品微服务

数据表 CREATE TABLE product (id bigint(20) UNSIGNED NOT NULL AUTO_INCREMENT COMMENT 商品id,cateid smallint(6) UNSIGNED NOT NULL DEFAULT 0 COMMENT 类别Id,name varchar(100) NOT NULL DEFAULT COMMENT 商品名称,subtitle varchar(200) NOT NULL DEFAULT COMMENT 商…...

全面解析各类VPN技术:GRE、IPsec、L2TP、SSL与MPLS VPN对比

目录 引言 VPN技术概述 GRE VPN 3.1 GRE封装结构 3.2 GRE的应用场景 GRE over IPsec 4.1 GRE over IPsec封装结构 4.2 为什么使用GRE over IPsec&#xff1f; IPsec VPN 5.1 IPsec传输模式&#xff08;Transport Mode&#xff09; 5.2 IPsec隧道模式&#xff08;Tunne…...

Spring数据访问模块设计

前面我们已经完成了IoC和web模块的设计&#xff0c;聪明的码友立马就知道了&#xff0c;该到数据访问模块了&#xff0c;要不就这俩玩个6啊&#xff0c;查库势在必行&#xff0c;至此&#xff0c;它来了。 一、核心设计理念 1、痛点在哪 应用离不开数据&#xff08;数据库、No…...

Springboot社区养老保险系统小程序

一、前言 随着我国经济迅速发展&#xff0c;人们对手机的需求越来越大&#xff0c;各种手机软件也都在被广泛应用&#xff0c;但是对于手机进行数据信息管理&#xff0c;对于手机的各种软件也是备受用户的喜爱&#xff0c;社区养老保险系统小程序被用户普遍使用&#xff0c;为方…...

LOOI机器人的技术实现解析:从手势识别到边缘检测

LOOI机器人作为一款创新的AI硬件产品&#xff0c;通过将智能手机转变为具有情感交互能力的桌面机器人&#xff0c;展示了前沿AI技术与传统硬件设计的完美结合。作为AI与玩具领域的专家&#xff0c;我将全面解析LOOI的技术实现架构&#xff0c;特别是其手势识别、物体识别和环境…...

消息队列系统设计与实践全解析

文章目录 &#x1f680; 消息队列系统设计与实践全解析&#x1f50d; 一、消息队列选型1.1 业务场景匹配矩阵1.2 吞吐量/延迟/可靠性权衡&#x1f4a1; 权衡决策框架 1.3 运维复杂度评估&#x1f527; 运维成本降低策略 &#x1f3d7;️ 二、典型架构设计2.1 分布式事务最终一致…...

QT开发技术【ffmpeg + QAudioOutput】音乐播放器

一、 介绍 使用ffmpeg 4.2.2 在数字化浪潮席卷全球的当下&#xff0c;音视频内容犹如璀璨繁星&#xff0c;点亮了人们的生活与工作。从短视频平台上令人捧腹的搞笑视频&#xff0c;到在线课堂中知识渊博的专家授课&#xff0c;再到影视平台上扣人心弦的高清大片&#xff0c;音…...