【QT5】<总览四> QT常见绘图、图表及动画

news2024/11/16 20:30:23

文章目录

前言

一、QFile类读写文件

二、QPainter绘简单图形

三、QChart图表

四、QPropertyAnimation属性动画

五、Q_PROPERTY宏简介

六、自定义属性动画


前言

承接【QT5】<总览三> QT常用控件。若存在版权问题,请联系作者删除!


一、QFile类读写文件

1. 作用:读写文件。

2. 文件读写流程:

  • ①找到文件:调用QFileDialog::getOpenFileName(this, "选择文本", "/home/swear"),用户操作界面选择文件,最终函数返回一个字符串(包括了路径和文件名字)
  • ②设置要打开的文件名:调用file.setFileName(fileName);
  • ③打开文件:调用file.open(权限),返回文件打开是否成功。true代表成功,false代表失败。
  • ④读写文件:调用file.readAll()、file.readLine()、file.write()等函数。
  • ⑤关闭文件:调用file.close()。
  • ⑥删除文件(可选):调用file.remove()。

3. 注意事项:

  • 上述文件读写流程中①可以省略。直接通过上述的②设置文件的名字。
  • 当open()的参数为QIODevice::ReadWrite时能够创建不存在的文件。

4. 案例演示:

【1】ui设计器:

【2】打开按钮和关闭按钮的槽函数:

/************************************************
 * 函数:ui中打开按钮的槽
 * 功能:将原文件的文本显示到textEdit中
 ************************************************/
void Widget::on_pushButton_clicked()
{
    //1.找到文件位置
    QString fileName = QFileDialog::getOpenFileName(this, "选择文本", "/home/swear");
    //2.设置要打开的文件
    file.setFileName(fileName);
    //3.打开文件
    if (!file.open(QIODevice::ReadOnly)){
        qDebug() << "打开文件失败" << endl;
        return;
    }
    //4.读入文本,放置于textEdit中
    ui->textEdit->setPlainText(file.readAll());
    //5.关闭文件
    file.close();
}
/************************************************
 * 函数:ui中关闭按钮的槽
 * 功能:将textEdit中的文本写入到原文件中
 ************************************************/
void Widget::on_pushButton_2_clicked()
{
    //1.判断文件是否找到,没有文件名则不操作
    if (file.fileName().isEmpty()){
        return;
    }
    //2.打开文件
    if (!file.open(QIODevice::WriteOnly)){
        qDebug() << "打开文件失败" << endl;
        return;
    }
    //3.将textEdit中的文本写入原文件中
    file.write(ui->textEdit->toPlainText().toUtf8());
    //5.关闭文件
    file.close();
    //6.清空textEdit
    ui->textEdit->clear();
}

【3】实现效果:按“打开”按钮,用户选择文件地址后,就会将文本呈现于textEdit内。然后,用户可以编辑这些文本。最后,用户点击“关闭”按钮,textEdit中的文本就会被写入原文件中,并且清空编辑框。


二、QPainter绘简单图形

1. 作用:绘制简单图形。

2. 基本使用:

  • ①声明:在Widget类的头文件中声明虚函数paintEvent()的重写,即void paintEvent(QPaintEvent *event) override;
  • ②实现:在Widget类的cpp文件中实现paintEvent()。
  • ③绘图:在painEvent()函数中创建QPainter类,并调用如下函数绘制简单图形:
//绘制矩形:左上角坐标为(x,y),宽度w,高度h
paint.drawRect(int x, int y, int w, int h);

//绘制多边形
QPolygon polygon;
polygon.setPoints(int nPoints, int firstx, int firsty, ...);
paint.drawPolygon(polygon);

//绘制直线:点(x1,y1)与点(x2,y2)相连
paint.drawLine(int x1, int y1, int x2, int y2);

//绘制椭圆/圆:左上角坐标为(x,y),半轴宽度w,半轴高度h
paint.drawEllipse(int x, int y, int w, int h);

//绘制文字
QRectF qr(500, 500, 200, 100);//绘制的区域
paint.drawText(qr, Qt::AlignHCenter | Qt::AlignVCenter,"柯同学");//水平对齐并垂直对齐

//绘制路径
QPainterPath path;
path.moveTo(20, 80);
path.lineTo(20, 30);
path.cubicTo(80, 0, 50, 50, 80, 80);
paint.drawPath(path);

//设置线条宽度、颜色
QPen pen;
pen.setWidth(5);
pen.setColor(QColor(200, 100, 50));
paint.setPen(pen);

//设置图形填充
QBrush brush(QColor(200, 100, 50));
paint.setBrush(brush);

//设置抗锯齿,线条更光滑
paint.setRenderHint(QPainter::Antialiasing);

3. 制作轮播文字:

【1】Widget.h:

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QTimer>

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();
    void paintEvent(QPaintEvent *event) override;

private:
    QFont font;//字体
    QString textContent;//字体内容
    int textLength;//字体总长
    int offset;//轮播文字的偏移量
    QTimer *timer;//定时器
private slots:
    void onTimerTimeOut();//定时器槽函数
};
#endif // WIDGET_H

【2】Widget.cpp:

#include "widget.h"
#include <QPainter>
#include <QFontMetrics>
#include <QDebug>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , offset(0)
{
    //设置界面大小
    this->resize(400, 100);
    //设置文字与格式
    textContent = "柯总不care各种儿女情长和科研矛盾!";
    font.setPixelSize(50);
    //求出字体长度
    QFontMetrics fontMetrics(font);
    textLength = fontMetrics.width(textContent);
    //设置定时器
    timer = new QTimer(this);
    connect(timer, SIGNAL(timeout()), this, SLOT(onTimerTimeOut()));
    timer->start(10);
}

Widget::~Widget()
{
}

void Widget::paintEvent(QPaintEvent *event)
{
    //设置painter的属性
    Q_UNUSED(event)
    QPainter painter(this);
    QPen pen;
    pen.setColor(QColor(48,193,227));
    painter.setPen(pen);
    painter.setFont(font);
    //轮播文字
    QRectF rectTmp(this->rect());
    rectTmp.setLeft(this->rect().width() - offset);
    painter.drawText(rectTmp, Qt::AlignVCenter, textContent);
}

void Widget::onTimerTimeOut()
{
    //更新offset
    if (offset < this->rect().width() + textLength) {
        offset++;
    }
    else {
        offset = 0;
    }
    //更新显示
    this->update();
}

【3】实现效果:


三、QChart图表

1. 作用:制作一个图表。四要素:图表本体、图表视图、坐标轴、曲线。

2. 流程:将坐标轴和曲线加载到图表本体中,再让图表加载到图表视图中。

  • ①修改pro文件:在QT += 后面加上"charts"。
  • ②添加头文件和命名空间:头文件<QChart>和<QChartView>,使用宏"QT_CHARTS_USE_NAMESPACE"展开命名空间。
  • ③创建图表视图:在ui设计器中找到"Graphics View"并拖拽至界面中,右击选择"提升为...",然后输入"QChartView"后修改名字为"chartView"。
  • ④创建图表本体:"QChart *chart = new QChart;"
    • 设置图表的标题和图例是否显示:"chart->setTitle(标题文本);"和"chart->legend()->setVisible(true);"
  • ⑤创建坐标轴:"QValueAxis *valueAxisX = new QValueAxis;"
    • 设置坐标轴的范围:"valueAxisX->setRange(最小值, 最大值);"
    • 设置坐标轴标签及格式:"valueAxisX->setTitleText(标签文本)"并且"valueAxisX->setLabelFormat("%d");"
    • 将坐标轴添加到图表中:"chart->addAxis(valueAxisX, Qt::AlignBottom);"
  • ⑥创建曲线:
    • 添加头文件:<QSplineSeries>(曲线)或 <QLineSeries>(折线)。
    • 创建曲线对象:"QSplineSeries *ss = new QSplineSeries;"
    • 添加曲线的点:"ss->append(int x, int y);"
    • 设置曲线颜色:"ss->setPen(QPen(QColor::red));"
    • 图标添加曲线:"chart->addSeries(ss);"
    • 将曲线的数据与坐标轴相连:ss->attachAxis(valueAxisX);注意:这一步必须在图表添加曲线之后。
  • ⑦将图表放置于图表视图中:"ui->chartView->setChart(chart);"

3. 实例结果:

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    this->setLayout(ui->verticalLayout);
    //创建图表,设置标题和图例
    QChart *chart = new QChart;
    chart->setTitle("时间-温度曲线");
    chart->legend()->setVisible(true);
    //创建坐标轴,设置坐标轴标签、数据格式
    QValueAxis *valueAxisX = new QValueAxis;
    QValueAxis *valueAxisY = new QValueAxis;
    valueAxisX->setRange(0, 5000);//时间轴
    valueAxisY->setRange(0, 100);//温度轴
    valueAxisX->setTitleText("时间/ms");
    valueAxisY->setTitleText("温度/摄氏度");
    valueAxisY->setLabelFormat("%.1f");
    //将坐标轴与图表联系
    chart->addAxis(valueAxisX, Qt::AlignBottom);
    chart->addAxis(valueAxisY, Qt::AlignLeft);
    //创建曲线,添加点
    QSplineSeries *ss = new QSplineSeries;
    ss->append(0, 34);
    ss->append(1000, 58.2);
    ss->append(2000, 69.88);
    ss->append(3000, 15.5);
    ss->append(4000, 25.9);
    ss->append(5000, 72.78);
    ss->setName("curve");
    //将曲线与图表联系,将坐标轴与曲线联系
    chart->addSeries(ss);
    ss->attachAxis(valueAxisX);
    ss->attachAxis(valueAxisY);
    //将图表加载到图表视图
    ui->chartView->setChart(chart);
}


四、QPropertyAnimation属性动画

1. 作用:用于创建几何动画、颜色动画和不透明度动画。

2. 说明:除了几何动画在创建对象时直接指明了作用的物体,颜色和不透明度动画需要分别借助QGraphicsColorizeEffect类和QGraphicsOpacityEffect类的对象。在颜色动画中,需要将作用的物体设置颜色效果(调用setsetGraphicsEffect),再创建颜色动画的对象。在不透明度动画中,需要将作用的物体设置颜色效果(调用setsetGraphicsEffect),再创建不透明度动画的对象。

3. 实例演示:

【1】Widget.h中添加以下属性:分别用于几何动画、颜色动画和不透明度动画的对象。

private:
    Ui::Widget *ui;
    QPropertyAnimation *geometryAnimation;
    QPropertyAnimation *colorAnimation;
    QPropertyAnimation *opacityAnimation;

【2】Widget.cpp:

#include "widget.h"
#include "ui_widget.h"
#include <QGraphicsColorizeEffect>
#include <QGraphicsOpacityEffect>

/***********************************************************
  * @函  数:Widget类的构造函数
  * @功  能:对几何动画、颜色动画和透明度动画对象初始化
  * @参  数:parent父类对象
  * @返回值:无
  *********************************************************/
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    /****************************1.几何动画************************************/
    //创建几何动画对象
    geometryAnimation = new QPropertyAnimation(ui->geometryWidget, "geometry");
    //设置几何动画的变换阶段
    geometryAnimation->setStartValue(QRect(0, 0, 100, 100));//起始值
    geometryAnimation->setKeyValueAt(0.5, QRect(600, 0, 150, 150));//0.5比例的值
    geometryAnimation->setEndValue(QRect(0, 0, 200, 200));//终点值
    //设置几何动画的其他属性
    geometryAnimation->setDuration(2000);//持续时间:2000ms
    geometryAnimation->setLoopCount(2);//循环次数:2次
    geometryAnimation->setEasingCurve(QEasingCurve::OutCubic);//变换的速度模式

    /****************************2.颜色动画************************************/
    //创建颜色动画对象
    QGraphicsColorizeEffect *graphicsColorizeEffect = new QGraphicsColorizeEffect(this);
    ui->colorWidget->setGraphicsEffect(graphicsColorizeEffect);
    colorAnimation = new QPropertyAnimation(graphicsColorizeEffect, "color");
    //设置颜色动画的变换属性
    colorAnimation->setStartValue(QColor(Qt::yellow));
    colorAnimation->setEndValue(QColor(Qt::darkGray));
    colorAnimation->setDuration(2000);

    /****************************3.不透明动画************************************/
    //创建颜色动画对象
    QGraphicsOpacityEffect *graphicsOpacityEffect = new QGraphicsOpacityEffect(this);
    ui->opacityWidget->setGraphicsEffect(graphicsOpacityEffect);
    opacityAnimation = new QPropertyAnimation(graphicsOpacityEffect, "opacity");
    //设置颜色动画的变换属性
    opacityAnimation->setStartValue(0.0);//不透明度为0.0最虚
    opacityAnimation->setEndValue(1.0);//不透明度为1.0最实
    opacityAnimation->setDuration(4000);
}


/***********************************************************
  * @函  数:Widget类的析构函数
  * @功  能:析构成员变量
  * @参  数:无
  * @返回值:无
  *********************************************************/
Widget::~Widget()
{
    delete ui;
    delete geometryAnimation;
}


/***********************************************************
  * @函  数:pushButton的槽函数---clicked
  * @功  能:启动几何动画
  * @参  数:无
  * @返回值:无
  *********************************************************/
void Widget::on_pushButton_clicked()
{
    geometryAnimation->start();
}


/***********************************************************
  * @函  数:pushButton1的槽函数---clicked
  * @功  能:启动颜色动画
  * @参  数:无
  * @返回值:无
  *********************************************************/
void Widget::on_pushButton_2_clicked()
{
    colorAnimation->start();
}

/***********************************************************
  * @函  数:pushButton3的槽函数---clicked
  * @功  能:启动不透明度动画
  * @参  数:无
  * @返回值:无
  *********************************************************/
void Widget::on_pushButton_3_clicked()
{
    opacityAnimation->start();
}

【3】实现效果:


五、Q_PROPERTY宏简介

1. 语法:

其中type、name、READ和Function是必需,其他都是可选。type能够被写成任何的由QVariant支持的类型。

2. 作用:撰写该宏之后,用户无需手动调用setMoney()方法来设置某个对象的属性值。可以通过调用setProperty("money", 200)来设置对象的内部属性richMoney。

3. 案例说明:

【1】自定义Rich类的头文件:

【2】自定义类Rich的源程序:

【3】运行结果分析:


六、自定义属性动画

1. 说明:在本篇第五章中,我们已经知道了如何写一个Q_PROPERTY宏。那么,本章我们基于第五章的例程进一步编写自定义属性动画,让界面中显示的金钱数量从0增长到100。

2. 具体实现:

【1】Widget类的源程序:

【2】实现效果:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1800173.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【学习笔记】Windows GDI绘图(十三)动画播放ImageAnimator(可调速)

文章目录 前言定义方法CanAnimate 是否可动画显示Animate 动画显示多帧图像UpdateFramesStopAnimate终止动画Image.GetFrameCount 获取动画总帧数Image.GetPropertyItem(0x5100) 获取帧延迟 自定义GIF播放(可调速) 前言 在前一篇文章中用到ImageAnimator获取了GIF动画的一些属…

Ubuntu 22.04.4 LTS安装cmake-3.29.5

一、下载源码 wget https://github.com/Kitware/CMake/releases/download/v3.29.5/cmake-3.29.5.tar.gz tar -xzvf cmake-3.29.5.tar.gz 二、编译 运行./bootstrap。 如果出现下列问题&#xff1a; -- Could NOT find OpenSSL, try to set the path to OpenSSL root folder …

一个案例,剖析攻防演练中威胁溯源的正确姿势

一年一度的攻防演练即将拉开帷幕。“威胁溯源”一直是演练活动中一个十分重要的工作项&#xff0c;它不仅有助于理解和分析攻击的来源、方法和动机&#xff0c;还能够显著提升整体安全防护水位&#xff0c;提升组件与人员的联动协作能力。在真实的攻击场景中&#xff0c;溯源工…

QT 如何在 QListWidget 的选项中插入自定义组件

有时我们需要 QListWidget 完成更复杂的操作&#xff0c;而不仅限于添加文本或者图标&#xff0c;那么就会使用到 setItemWidget 函数&#xff0c;但是这也会伴生一个问题&#xff0c;插入自定义组件后&#xff0c;QListWidget 对选项点击事件的获取会收到阻塞&#xff0c;因…

ESP使用巴法云远程OTA(VScode + Platform io)

ESP使用巴法云远程OTA&#xff08;Platform&#xff09; 什么是OTA&#xff1a; OTA&#xff08;Over-the-AirTechnology&#xff09;即空中下载技术&#xff0c;是通过移动通信的空中接口实现对移动终端设备及SIM卡数据进行远程管理的技术。OTA升级是物联网&#xff08;IOT&am…

关于RDMA传输的基本流量控制

Basic flow control for RDMA transfers | The Geek in the Corner (wordpress.com) 文心一言 已经介绍了使用发送/接收操作和RDMA读写操作&#xff0c;那么现在是一个很好的机会来结合这两种方法的元素&#xff0c;并讨论一般的流量控制。还会稍微谈谈RDMA带有立即数据的写操…

外部mysql导入

利用这个命令&#xff1a; mysql -u username -p database_name < file.sql 然后就这样。成功导入。

惠海 H5528 升降压芯片 12V24V36V48V60V75V LED恒流驱动IC 调光细腻顺滑无阶梯感

惠海H5528是一款升压、降压、升压降压的LED恒流驱动IC&#xff0c;其具备宽范围调光比且无频闪调光的特性&#xff0c;使得它在智能照明、Dali调光、0~10V调光、摄影灯照明以及补光灯照明等多种应用中具有广泛的应用前景。 这款芯片支持降压、升压和升降压拓扑的应用&#xff0…

torch.cat 与 torch.concat函数

文章目录 区别torch.cat介绍作用参数使用实例关于参数dim为None的使用 区别 先说结论&#xff1a;没有区别在功能、用法以及作用上&#xff0c;concat函数就是cat函数的别名&#xff08;官方就是这样说的&#xff09;。下面截图为证&#xff1a;   因此接下来就主要是介绍 to…

艾体宝方案 | ntopng监测异常流量并通知到企业微信

你是否曾因网络异常而感到困扰&#xff1f;在数字化时代&#xff0c;网络流量异常可能给企业带来巨大损失。但别担心&#xff0c;我们为您准备了一份详尽的解决方案&#xff01;想知道如何利用ntopng及时发现异常流量&#xff0c;并通过企业微信等渠道通知你的团队吗&#xff1…

【Qt秘籍】[007]-LineEdit Pushbutton控件

Qt的中有着各种各样的控件&#xff0c;相较于传统C/C的输出默认只能在控制台实现&#xff0c;Qt中可以有不同的接口实现各种不同的功能&#xff0c;下面我们将实现不同功能的输出 hello world&#xff01; 标签Label 【Qt秘籍】[006]-Label实现Hello World程序-编程第一步-CSD…

C#操作MySQL从入门到精通(13)——对查询结果使用函数

前言 我们有时候需要对查询到的数据使用函数进行处理,比如去掉空格,比如截取一半长度等操作,下面我来详细介绍: 本文使用的测试数据如下: 1、使用文本处理函数 1.1 Left 返回具有指定长度的字符串的左边部分 下面的代码获取email这个列从左边第一个字符开始计算的一共…

使用 ISIC 快速申请 JetBrain 学生免费产品

此篇文章适合急需通过学生优惠使用 JetBrain 产品并且愿意花费 50 &#xff08;申请国际电子学生证 ISIC 需要 50&#xff09;的学生。需要等待时间1-3天&#xff0c;主要是等待 ISIC 的时间&#xff0c;只要 ISIC 发放 ISIC name 和 ISIC ID&#xff0c;将其填写到 JetBrain 的…

Linux学习笔记8

介绍man命令 在Linux中&#xff0c;man命令用于查看系统手册页&#xff08;manual pages&#xff09;。系统手册页是关于各种Linux命令、函数库以及系统调用的详尽文档&#xff0c;能够提供关于命令的使用方法、参数说明、示例以及其他相关信息 可以利用man xxx的命令去查找某…

系统架构设计师【第19章】: 大数据架构设计理论与实践 (核心总结)

文章目录 19.1 传统数据处理系统存在的问题19.2 大数据处理系统架构分析19.2.1 大数据处理系统面临挑战19.2.2 大数据处理系统架构特征 19.3 Lambda架构19.3.1 Lambda架构对大数据处理系统的理解19.3.2 Lambda架构应用场景19.3.3 Lambda架构介绍19.3.4  Lambda架构的实…

MySQL(四) - SQL优化

一、SQL执行流程 MySQL是客户端-服务器的模式。一条SQL的执行流程如下&#xff1a; 在执行过程中&#xff0c;主要有三类角色&#xff1a;客户端、服务器、存储引擎。 大致可以分为三层&#xff1a; 第一层&#xff1a;客户端连接到服务器&#xff0c;构造SQL并发送给服务器…

电源变压器的作用和性能

电源变压器的主要作用是改变输入电压的大小&#xff0c;通常用于降低电压或升高电压&#xff0c;以便适应不同设备的需求。它们还可以提供隔离&#xff0c;使得输出电路与输入电路之间电气隔离&#xff0c;从而提高安全性。性能方面&#xff0c;电源变压器需要具有高效率、低温…

【OpenHarmony】ArkTS 语法基础 ④ ( ArkTS UI 渲染控制 | if else 条件渲染 | ForEach 循环渲染 )

文章目录 一、ArkTS UI 渲染控制1、if else 条件渲染2、ForEach 循环渲染 二、完整代码示例1、自定义组件代码2、主界面代码3、执行结果 参考文档 : <HarmonyOS第一课>ArkTS开发语言介绍 ForEach 渲染控制文档 : https://developer.huawei.com/consumer/cn/doc/harmonyo…

Python中的Paramiko与FTP文件夹及文件检测技巧

哈喽&#xff0c;大家好&#xff0c;我是木头左&#xff01; Python代码的魅力与实用价值 在当今数字化时代&#xff0c;编程已成为一种不可或缺的技能。Python作为一种简洁、易读且功能强大的编程语言&#xff0c;受到了全球开发者的喜爱。它不仅适用于初学者入门&#xff0c…

玩转STM32-通信协议SPI(详细-慢工出细活)

文章目录 一、SPI的基础知识1.1 接口定义1.2 单机和多机通信 二、STM32的SPI工作过程2.1 从选择&#xff08;NSS&#xff09;脚管理2.2 时钟相位与极性2.3 SPI主模式2.4 SPI从模式 三、应用实例 一、SPI的基础知识 1.1 接口定义 SPI系统可直接与各个厂家生产的多种标准外围器…