【QT】QLinearGradient 线性渐变类简单使用教程

ops/2025/3/3 20:37:43/

目录

0.简介

qtDesigner%E4%B8%AD-toc" name="tableOfContents" style="margin-left:40px">1)qtDesigner中

2)实际执行

1.功能详述

3.举一反三的样式


0.简介

QLinearGradient 是 Qt 框架中的一个类,用于定义线性渐变效果(通过样式表设置)。它可以用来填充形状、背景或其他图形元素,创建从一个颜色到另一个颜色的平滑过渡效果。

先看下实现效果(我用了一个label控件承接,一个从浅灰到深灰的渐变,带50的圆角)

qtDesigner%E4%B8%AD" name="1%EF%BC%89qtDesigner%E4%B8%AD">1)qtDesigner中

2)实际执行

想要彩色?满足你

1.功能详述

1)首先我们看下用样式是如何设置的(以下均已彩色图的颜色为准)

ui->label->setStyleSheet("background:qlineargradient(x1:1, y1:0, x2:0, y2:1, stop:0.0 red, stop:0.5 green, stop:1 blue);""border-radius:50px;");

重点就是这一句代码,设置样式。

通过给label设置一个背景颜色,再加一个border-radius的圆角即可实现,重点是qlineargradient的参数,我们来分析下:

qlineargradient(x1:1, y1:0, x2:0, y2:1, stop:0.0 red, stop:0.5 green, stop:1 blue)

别看参数这么多,分组看就好了,一共有5个组:

a)起始点坐标(x1,y1)

b)结束点坐标(x2,y2)

c)起始点颜色和开始点(stop:0.0 red)

d)中间段颜色和中间点(stop:0.5 green)

e)结束点颜色和结束点(stop:1 blue)

(参考图)

参数含义

qlineargradient(...)

设置背景为线性渐变
x1:1, y1:0(x1,y1要一起看)

渐变起点的坐标(看上面的参考图中的红色坐标,仅看四个点坐标)

也就是颜色从(1,0)开始,也就是右上角

  • x1:1 表示起点的水平位置为 1(相对于元素的宽度,1 表示最右侧)

  • y1:0 表示起点的垂直位置为 0(相对于元素的高度,0 表示最顶部)

x2:0, y2:1(x2,y2要一起看)

渐变终点的坐标(看上面的参考图的红色坐标)

也就是颜色到(0,1)结束,也就是左下角

  • x2:0 表示终点的水平位置为 0(最左侧)

  • y2:1 表示终点的垂直位置为 1(最底部)

stop:0.0 red

在渐变线的起点(位置 0.0)设置颜色为红色,参考上图的橙色数字位置

stop:0.5 green

在渐变线的中间点(位置 0.5)设置颜色为绿色,参考上图的橙色数字位置

stop:1 blue

在渐变线的终点(位置 1.0)设置颜色为蓝色,参考上图的橙色数字位置

也就是先看起点终点,再看颜色。

如上述代码样式可简述为:从右上到左下,分别是红、绿、蓝三个颜色。

3.举一反三的样式

1)如果要调换开始和结束的颜色(红蓝调换),有两种方式:

        i)调换起始点:

        (x1,y1),原(1,0)变为(0,1)+ (x2,y2),原(0,1)变为(1,0)

        ii)调换起点(red)和终点(blue)的颜色

2)我想让红色少一点

第二段stop的值少一点,意思是绿色的中心点是0.2

//    ui->label->setStyleSheet("background:qlineargradient(x1:1, y1:0, x2:0, y2:1, stop:0.0 red, stop:0.5 green, stop:1 blue);"ui->label->setStyleSheet("background:qlineargradient(x1:1, y1:0, x2:0, y2:1, stop:0.0 red, stop:0.2 green, stop:1 blue);""border-radius:50px;");

3)如果我只想要两个颜色,不想要中间的绿色了

去掉第二段stop参数(, stop:0.5 green)即可

//    ui->label->setStyleSheet("background:qlineargradient(x1:1, y1:0, x2:0, y2:1, stop:0.0 red, stop:0.5 green, stop:1 blue);"ui->label->setStyleSheet("background:qlineargradient(x1:1, y1:0, x2:0, y2:1, stop:0.0 red,stop:1 blue);""border-radius:50px;");

大家可自行发挥想象力,可以创造出很多样式

--END--


http://www.ppmy.cn/ops/162858.html

相关文章

Golang学习笔记_39——策略模式

Golang学习笔记_36——装饰器模式 Golang学习笔记_37——外观模式 Golang学习笔记_38——享元模式 文章目录 一、核心概念1. 定义2. 解决的问题3. 核心角色4. 类图 二、特点分析三、适用场景1. 支付系统2. 数据压缩3. 游戏AI4. 折扣计算 四、代码示例(Go语言&#x…

2025年AI网络安全攻防战:挑战深度解析与全链路防御体系构建指南

2025年AI网络安全攻防战:挑战深度解析与全链路防御体系构建指南 引言:AI技术是一把双刃剑 随着ChatGPT、Sora等生成式AI技术的爆发式应用,2025年被称为“AI应用元年”。然而,AI在赋能网络安全防御的同时,也为攻击者提供了新型武器。根据瑞星《2024年中国网络安全报告》,…

Python学习第十八天之深度学习之Tensorboard

Tensorboard 1.TensorBoard详解2.安装3.使用4.图像数据格式的一些理解 后续会陆续在词博客上更新Tensorboard相关知识 1.TensorBoard详解 TensorBoard是一个可视化的模块,该模块功能强大,可用于深度学习网络模型训练查看模型结构和训练效果(…

Redis 高可用性:如何让你的缓存一直在线,稳定运行?

🎯 引言:Redis的高可用性为啥这么重要? 在现代高可用系统中,Redis 是一款不可或缺的分布式缓存与数据库系统。无论是提升访问速度,还是实现数据的高效持久化,Redis 都能轻松搞定。可是,当你把 …

面试八股文--数据库基础知识总结(2) MySQL

本文介绍关于MySQL的相关面试知识 一、关系型数据库 1、定义 关系型数据库(Relational Database)是一种基于关系模型的数据库管理系统(DBMS),它将数据存储在表格(表)中,并通过表格…

DeepSeek 接入PyCharm实现AI编程!(支持本地部署DeepSeek及官方DeepSeek接入)

前言 在当今数字化时代,AI编程助手已成为提升开发效率的利器。DeepSeek作为一款强大的AI模型,凭借其出色的性能和开源免费的优势,成为许多开发者的首选。今天,就让我们一起探索如何将DeepSeek接入PyCharm,实现高效、智…

Android NDK打包封装教程与优化技巧

关于NDK打包封装的问题。首先,用户可能不太清楚NDK的基本概念,所以我应该先解释NDK是什么以及它的作用。然后,用户可能想知道如何在Android项目中使用NDK,所以需要分步骤说明配置过程,包括安装NDK、配置CMake或ndk-build,创建JNI接口,编写C/C++代码,编译和打包。 接下…

LeetCode 贪心算法经典题目 (C++实现)

121. 买卖股票的最佳时机 题目描述 给定一个数组 prices ,它的第 i 个元素 prices[i] 表示一支给定股票第 i 天的价格。 你只能选择 某一天 买入这只股票,并选择在 未来的某一个不同的日子 卖出该股票。设计一个算法来计算你所能获取的最大利润。 返…