超级超级炫酷!!使用QPixmap绘制图形并移动图形功能的实现

1.概述

  • 本文使用QPixmap在Widget上绘制图片,并且实现点击开始移动按钮自动移动图片,点击暂停移动按钮实现暂停移动图片的功能。

  • 主要涉及的知识点:QPixmap和QTimer(定时器)以及QPaintEvent绘图事件。

  • 软件最终实现效果图如下:

动画.gif

2.QPixmap简要介绍

  • QPixmap继承了QPaintDevice,因此可以使用QPainter直接在上面绘制图形。QPixmap也可以接受一个字符串作为一个文件的路径来显示这个文件,比如你想在程序之中打开png、jpg之类的文件,就可以使用 QPixmap。使用QPainter的drawPixmap()函数可以把这个文件绘制到一个QLabel、QPushButton或者其他的设备上面。QPixmap是针对屏幕进行特殊优化的,因此它与实际的底层显示设备息息相关。注意,这里说的显示设备并不是硬件,而是操作系统提供的原生的绘图引擎。所以,在不同的操作系统平台下,QPixmap的显示可能会有所差别。QPixmap使用底层平台的绘制系统进行绘制,无法提供像素级别的操作,而QImage则是使用独立于硬件的绘制系统,实际上是自己绘制自己,因此提供了像素级别的操作,并且能够在不同系统之上提供一个一致的显示形式。

3.废话少说直接撸代码

Widget.h代码如下:

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>

namespace Ui {
class Widget;
}

class Widget : public QWidget
{
    Q_OBJECT

public:
    explicit Widget(QWidget *parent = 0);
    ~Widget();


    //绘图事件
    void paintEvent(QPaintEvent *);
    //绘制图形的X坐标
    int posX = 0;


private:
    Ui::Widget *ui;
};

#endif // WIDGET_H

复制代码
  • 代码简要说明:

  • 主要声明了一个绘图事件和一个绘制图形的x坐标并初始化其值为0。

Widget.cpp代码如下:

#include "widget.h"
#include "ui_widget.h"
#include <QPainter> //画家类
#include <QTimer>
#include <QDebug>

Widget::Widget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::Widget)
{
    ui->setupUi(this);
    this->setWindowTitle("绘图(作者CSDN:小明明啦,联系+qq:1010735173)");
    this->setWindowIcon(QIcon(":/Image/LuffyQ.png"));
    this->setFixedSize(400,300);
    QTimer * timer = new QTimer(this);
    timer->setInterval(10);

    connect(timer,&QTimer::timeout,[=](){
        posX++;
        update();
    });


    //点击移动按钮,移动图片位置
    connect(ui->btn_Start,&QPushButton::clicked,[=](){
        timer->start();
        ui->btn_Start->setEnabled(false);
        ui->btn_Pause->setEnabled(true);


    });


    //点击暂停按钮,停止移动图片位置
    connect(ui->btn_Pause,&QPushButton::clicked,[=](){
        timer->stop();
        ui->btn_Pause->setEnabled(false);
        ui->btn_Start->setEnabled(true);
    });
}

void Widget::paintEvent(QPaintEvent *)
{

    //利用画家 画资源图片
     QPainter painter(this);
     QPixmap pix = QPixmap(":/Image/Luffy.png");

    //如果超出屏幕 从0开始
     if(posX >= this->width())
     {

         posX = -pix.width();

    }

     painter.drawPixmap(posX,0,pix);
}


Widget::~Widget()
{
    delete ui;

}
复制代码
  • 代码简要说明:

  • 主要设置了一个定时器,每隔10毫秒发出一个信号,并且绑定了一个槽函数,实现定时器开启后绘制的图形的x坐标不断的+1,此槽函数绑定的信号是开始移动按钮,也就是说只要点击开始按钮btn_Start,就会将绘制的图片的的坐标每隔10毫秒的速度+1,并且实时更新图形的界面,在点击开始移动按钮后,其按钮被禁止使用,同时使能暂停移动按钮。

  • 第三个信号与槽连接主要实现暂停移动按钮btn_Pause按下后,停止定时器的计数,同时也就停止了图形的移动,并且禁止暂停按钮的使用,同时使能开始移动按钮。

  • 在绘图事件中主要实现用QPixmap实现绘图,并且判断图形如果超出屏幕的右边界后重新设置其位置,让图形慢慢的从界面左边出现,图形的x坐标随着位置变化会一直变化,但是y值会一直不变,大小是0,这样也就保证了图形一直在平移的效果。

  • 以上就是个人用Qt写的一个小小的功能,还望大家多多交流,共同进步,有需要源代码的可以留言索要,有什么疑问的也可以留言交流,谢谢大家观看本博客。

© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享