Qt Implementation of image mobile instances (Graphic tutorial)

During the training this semester, I used MFC for an airplane war. It was boring. I always wanted to use Qt for a war, but I was very bored at school. I came back and looked at it.

The first problem that needs to be solved is the movement of pictures. How can we say that planes and bullets are moving? Of course, images must run.

Let's take a break. First, use QtCreator to create a QtGui program named PaintWidget.

These three files will be generated. You don't need to worry about the ui. The Event is required for moving the experiment images, not the signal slot. So the ui will not work.

The first step is to draw an image. Refer to the Code Section on the path to Qt learning. It is not difficult to draw a picture. It is to rewrite the paintEvent method and use the QPainter object to draw a picture.

Copy codeThe Code is as follows: void PaintedWidget: paintEvent (QPaintEvent * event)
{
QPainter painter (this );
QPixmap pixmap ("Cat.png ");
QBitmap bitmap ("Cat.png ");
Painter. drawPixmap (10, 10,128,128, pixmap );
Painter. drawPixmap (140, 10,128,128, bitmap );
QPixmap pixmap2 ("Cat2.png ");
QBitmap bitmap2 ("Cat2.png ");
Painter. drawPixmap (10,140,128,128, pixmap2 );
Painter. drawPixmap (140,140,128,128, bitmap2 );
}

This is his result.

The question is how to use image resources:

In the book "C ++ GUI Qt4 programming (version 2)", the source code of this book is directly searched and found in src \ chap04, in the past, the resource referenced by Qt was a resource file, which is an xml file and can be conveniently managed in QtCreator.

First, add a file to the project and select the resource file of Qt:

Because there may be many images in the future, I created a folder named img in the project directory to store images.

A prefix is added to the generated resource file, which is required to reference resources in qt. Later, you will not have to worry about adding files.

For convenience, first send the source code

Mainwindow. h

Copy codeThe Code is as follows: # ifndef MAINWINDOW_H
# Define MAINWINDOW_H

# Include <QtGui>

Namespace Ui {
Class MainWindow;
}

Class MainWindow: public QMainWindow
{
Q_OBJECT

Public:
Explicit MainWindow (QWidget * parent = 0 );
~ MainWindow ();
Protected:
Void paintEvent (QPaintEvent * event );
Void mouseMoveEvent (QMouseEvent * event );
Void keyPressEvent (QKeyEvent * event );

Private:
Ui: MainWindow * ui;
QPixmap * worker mg;
QRect * multiple mgrect;

Protected:
Int shrinkMultiple;
Int speed;
};

# Endif // MAINWINDOW_H

QPixmap * between MG is the pointer of the image object, because my image is always a cat, and the name is used.

QRect * contains mgrect. It is the rectangle information of the image. It indicates that when the image is moved, the x and y coordinates of the image change, and the rectangle information changes, there is a function in the plotting function that draws a function based on the rectangle information and the image pointer.

painter.drawPixmap(*catImgRect,*catImg);

For convenience, use the receivmgrect to store the information.

Int shrinkMultiple; this is the scaling factor of the image. My cat's image is a little big and I have reduced it. Of course I can not

This int speed is the number of bytes that the image moves.

OK. The following is mainwindow. cpp.

Copy codeThe Code is as follows: # include "mainwindow. h"
# Include "ui_main1_1_h"

MainWindow: MainWindow (QWidget * parent ):
QMainWindow (parent ),
Ui (new Ui: MainWindow ),
ShrinkMultiple (2), speed (10)
{
Ui-> setupUi (this );
Mg = new QPixmap (":/img/cat.jpg ");
Int width = duplicate Mg-> width ()/shrinkMultiple;
Int height = duplicate Mg-> height ()/shrinkMultiple;
Required mgrect = new QRect (10, 10, width, height );
QRect rect = this-> geometry ();
Rect. setWidth (width * 4 );
Rect. setHeight (height * 4 );
Rect. setX (20 );
Rect. setY (50 );
This-> setGeometry (rect );
}
Void MainWindow: paintEvent (QPaintEvent * event)
{
QPainter painter (this );
Painter. drawPixmap (* distinct mgrect, * distinct mg );
}
Void MainWindow: mouseMoveEvent (QMouseEvent * event)
{
}
Void MainWindow: keyPressEvent (QKeyEvent * event)
{
Int width = Hangzhou mgrect-> width ();
Int height = Hangzhou mgrect-> height ();
Switch (event-> key ())
{
Case Qt: Key_Left:
{

Extends mgrect-> setX (distinct mgrect-> x ()-speed );

Break;
}
Case Qt: Key_Right:
{
Extends mgrect-> setX (distinct mgrect-> x () + speed );
Break;
}
Case Qt: Key_Down:
{
CatImgRect-> setY (catImgRect-> y () + speed );
Break;
}
Case Qt: Key_Up:
{
CatImgRect-> setY (catImgRect-> y ()-speed );
Break;
}
}
Extends mgrect-> setHeight (height );
Extends mgrect-> setWidth (width );
This-> repaint ();

}
MainWindow ::~ MainWindow ()
{
Delete multiple mg;
Delete multiple mgrect;
Delete ui;
}

First, let's look at the constructor, whereCopy codeThe Code is as follows: duplicate Mg = new QPixmap (":/img/cat.jpg ");

Here is the reference resource file:/img/cat.jpg. The first slash after the colon is the prefix just added.

The following lines reduce the cat's image and initialize the cat's rectangle information. The last line is to set the size of the program window to four times the size of the cat's image.

The painting function is the paintEvent function, which is called as long as the window is re-painted.

The key move is rewriting.

Copy codeThe Code is as follows: voidMainWindow: keyPressEvent (QKeyEvent * event)

There is nothing special about this function. The last line is displayed.Copy codeThe Code is as follows: this-> repaint ();

If the keyboard is pressed, the window is re-painted. Without this function, the cat rectangle does change, but the position of the image does not change, the paintEvent function will not be called until re-painting. When will the function be re-painted? When the window is masked, maximized and minimized, and the window is moved (and possibly ), the repaint function is used to re-paint the image immediately.

There is no problem in picture movement, and the key is not to be smooth. At that time, when MFC was used, the timer was used to solve this problem. In Qt, there was also a timer. I will study it again in another day, however, there may be problems, that is, the problem of window flickering. In this case, the dual-buffer drawing technology should be used.

Paste the final image