利用Qt完成动图

2024-02-24 14:50:34

我作为一个Qt的初学者，也是一个编程的萌新，我想今天教大家如何使用Qt来编写一个把多张图片合成动图的程序。

首先我们要学会如何在页面中显示一张图片

具体步骤如下：
1）创建一个MainWindow文件，不需要ui
2）在.h文件中函数声明：void paintEvent(QPaintEvent* event);
3) 在文件中新建一个“res”文件夹，将你需要的图片添加进去
如图：
4）再插入图片，过程：打开左上角的新建->新建文件或项目->Qt->Qt Recource File->名称填写res->一直下一步->add Files 中选择你需要的图片->ctrl+s保存
5）完成如下代码：

void MainWindow::paintEvent(QPaintEvent *event)
{
    QPainter painter(this);
    QPixmap map(":/new/res/IMG_3556(20200415-224940).JPG");//图片的位置
    QRect q(0,0,640,640);//图片的大小
    painter.drawPixmap(q,map,q);
}

效果如图：

其次，我们要学会定时器的使用

在Qt中使用定时器有两种方法，一种是QObject类，一种是QTimer类
QObject类
QObject类是所以Qt对象的基类，它提供了一个基本的定时器。通过QObject::startTimer函数可以启动一个寄存器，这个函数返回一个唯一的整数表示这个定时器。这个定时器每到一个时间间隔就会“触发”并产生一个定时器事件，直到使用这个定时器的标识符来调用QObject::KillTimer结束。
QObject类中与定时器相关的成员函数有startTimer，timeEvent，killTimer。
startTimer，timeEvent，killTimer的原型如下：

int QObject::startTimer(int interval, Qt::TimerType timerType);
void QObject::timerEvent(QTimerEvent *event);
void QObject::killTimer(int id);

QTimer类
通常的使用方法：

//创建定时器
QTimer *testTimer=new QTimer(this);
//将定时器超时信号与槽练习起来
connect(testTimer,SIGNAL(timeout()),this,SLOT(testFunction()));
//开始运行定时器，时间间隔为1000ms
testTimer->start(1000);

最后，就是完成动图

动图就是把很多张图片以很快的速度浏览，在视觉上“动起来”，每隔0.1秒切换到下一张图片就好了。
话不多说，直接上代码：
.h文件：

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();
   void timerEvent(QTimerEvent* event);

   void  InitPixmap();

   void  paintEvent(QPaintEvent* event);

   int eventID;

   int curIndex;

private:
     QPixmap pixmap[64];
    Ui::MainWindow *ui;
};
#endif // MAINWINDOW_H

.cpp文件：

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include<QPainter>
#include<QPixmap>

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    resize(500,500);
    eventID=startTimer(100);
    curIndex=0;
    InitPixmap();
}
MainWindow::~MainWindow()
{
    delete ui;
}

void MainWindow::timerEvent(QTimerEvent*event)
{
    curIndex++;//图片标号加
    if(curIndex>=64)
    {
        curIndex=0;
    }
    repaint();
}
 void  MainWindow::InitPixmap()
 {
     for(int i=0;i<64;i++)
     {
         QString filename=QString(":/new/prefix1/res/1_%1.png").arg(i+1,2,10,QLatin1Char('0'));
         //1_%1：切换到下一张
         QPixmap map(filename);

         pixmap[i]=map;
     }
 }
 void MainWindow::paintEvent(QPaintEvent *event)
 {
     QPainter painter(this);
     QRect q(0,0,80,91);
     QRect q2(0,0,width(),height());
     painter.drawPixmap(q2,pixmap[curIndex],q);
 }

效果图：

总结：
1）制作动图就是添加图片和定时器应用的结合，难度不高，掌握理论知识后就可以上机实验了。
2）图片的名称要有序，否则++不起作用，图片不会切换，例如：

3）快速寻找图片地址的方法：单击res.qrc -> Open With -> 资源编辑器 -> 肤质资源路径到剪切板

文中的一些理论知识选自清华大学出版社仇国巍《Qt图形界面编程入门》

最后，作为一名萌新，如果有大佬发现文章中有不正确的地方可以及时指出，也可以提出你们宝贵的建议。

码农公寓

首先我们要学会如何在页面中显示一张图片

其次，我们要学会定时器的使用

最后，就是完成动图

相关文章