欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

QT:利用计时器连续播放图片组成动图效果

程序员文章站 2022-05-22 19:20:21
...

一、效果展示

(该动图完全由jpg图片连续播放构成)

QT:利用计时器连续播放图片组成动图效果

二、步骤(代码解释+注意问题)

1. 配置头文件

头文件我就直接上代码了
#ifndef DIALOG_H
#define DIALOG_H

#include <QDialog>

namespace Ui {
class Dialog;
}

class Dialog : public QDialog
{
    Q_OBJECT

public:
    explicit Dialog(QWidget *parent = 0);
    ~Dialog();
    void paintEvent(QPaintEvent * event);//绘图事件,用于绘制图片
    void timerEvent(QTimerEvent * event);//计时器事件,用于更新curIndex索引
    void initPixmap();//通过图片路径将图片存储到pixmap数组中
    int curIndex;//用于充当pixmap容器对应位置的索引
private:
    Ui::Dialog *ui;
    QPixmap pixmap[99];//Qpixmap可以与图片进行绑定,并且将图片用GPU绘制出来
};

#endif // DIALOG_H

2. 创建资源文件,导入图片

(步骤就不用我说了,讲讲注意问题)

因为这里导入的图片数量比较多,我们用到了一种方法,能够快速的将图片绑定至pixmap数组中,而免去了将所有图片路径都敲一遍的困扰。具体方法详见步骤6
此处需要注意的是,由于这种方法,请确保你的图片名完全是由英文、下划线、数字组成。名字不符合的可以利用Windows批处理指令快速修改。方法大家可以在网上查一下,这里不过多叙述。

3. 主函数部分

startTimer() 方法指定了计时器事件所需要的时间间隔值。也就是说,在本案例中,每经过100毫秒,计时器事件就会被调用一次。

Dialog::Dialog(QWidget *parent) :
    QDialog(parent),
    ui(new Ui::Dialog)
{
    ui->setupUi(this);
    resize(524,475);//指定窗口大小,此处选择和图片相一致
    curIndex=0;//初始化索引
    startTimer(100);
    initPixmap();
}

4. 绘画事件

这里的drawPixmap方法,是QPixmap中的一种方法,可以从硬件层面1绘制QPixmap所绑定的图片;
通过QRect类型指定图片的尺寸,当做参数传入drawPixmap方法中对所绘制图片的大小予以设定。

void Dialog::paintEvent(QPaintEvent *event)
{
    QPainter painter(this);
    QRect q(0,0,524,475);//根据图片大小进行调整
    painter.drawPixmap(q,pixmap[curIndex],q);
}

5. 计时器事件

通过计时器事件来更新curIndex索引,使得每经历一次指定的时间间隔,索引就会更新一次,并且将图片通过repaint() 方法进行重绘。如果想实现循环播放的效果,只需要在循环到最后时重置索引值为0即可。

void Dialog::timerEvent(QTimerEvent *event)
{
    curIndex++;
    if (curIndex>=99)
        curIndex=0;
    repaint();
}

6.将图片绑定至pixmap数组中

值得注意的是,在头文件中声明Qpixmap数组时,该数组的大小应当是你所用到图片的数量。

具体讲一下快速绑定大批量图片的步骤:
①: 利用QString类型来保存图片路径,将图片名调整至仅一个数字不同,并且该数字可作为图片播放顺序的依据。
②: 将图片路径不同的部分用参数 %1 代替,利用QString的arg方法,将该参数按照指定的形式填充,本案例的arg方法有四个参数,分别是起始填充数字、参数的最大位数、进制、默认填充参数
③: 以循环的形式更新参数,同时创建和写入新的QPixmap,并存储进QPixmap数组中。

void Dialog::initPixmap()
{
    for(int i=0;i<99;i++)
    {
        QString fileName = QString(":/new/prefix1/chick/res_%1.jpg").arg(i+1,2,10,QLatin1Char('0'));
        QPixmap map(fileName);
        pixmap[i]=map;
    }
}


  1. 硬件层面:指的是相比于QImageQPixmap对于图片的绘制利用了GPU,能够有效提升大图片或者数量较多的图片的绘制速度以及绘制质量。 ↩︎

相关标签: qt qt5