Qt Animation Quick Start (i)

Qt-4.6 Animation Animation Quick Start three-word decision


Qt-4.6 has added the animation framework (animation framework), allowing us to easily write some vivid programs. It doesn't have to be like the previous version, all the controls are dull in the great glorious qlayout, maybe they can sing a song and dance.
The so-called animation is in a time period of different points of time have different states, as long as the definition of such a state, the realization of animation is the thing. Of course, the best thing to do this is the state machine, yes Qt-4.6.0 provides the Qstatemachine class, but today I want to talk about the three words must be simple.

First decision: Qpropertyanimation

Qpropertyanimation is used to communicate with properties in Qobject, such as qwidget size, coordinates, and so on. Look at the code

Qpropertyanimation *animation = new Qpropertyanimation (mywidget, "geometry");
Animation->setduration (10000);
Animation->setstartvalue (qrect (0, 0, 100, 30));
Animation->setendvalue (Qrect (250, 250, 100, 30));
Animation->start ();

The first line creates a Qpropertyanimation object that associates the geometry properties of the Mywidget form. The following sentences set the duration, starting and ending coordinates of the animation. The rest of the matter will be changed qproperanimation to do it. Then call Start () to start it. Yes, the five-line code completes a form that automatically moves from one coordinate point to another. Below I give a code that can run, is a small bird moved from the bottom corner to the middle of a little animation, of course you have to prepare the image of the same name :)

Copy Code

2. #include <QApplication>
4. #include <QLabel>
6. #include <QPixmap>
8. #include <QPropertyAnimation>
12. int main (int argc,char *argv[]) {
14. Qapplication app (ARGC,ARGV);
16. Qwidget *w=new qwidget ();
18. W->resize (300,400);
20. Qpixmap Birdimg=qpixmap ("Twitter-bird.png"). Scaled (40,40);
22. Qlabel *bird_1=new Qlabel (w);
24. Bird_1->setpixmap (BIRDIMG);
26. Qpropertyanimation *anim1=new qpropertyanimation (bird_1, "pos");
28. Anim1->setduration (2000);
30. Anim1->setstartvalue (Qpoint (0, 360));
32. Anim1->setendvalue (Qpoint (110, 180));
34. Anim1->start ();
36. Bird_1->move ( -40,-40);
38. W->show ();
40. return App.exec ();
42. }

The above example uses the label's position attribute pos. Of course you can add other property in your own class, such as changing the color.

Second decision: Seteasingcurve

The bird's movement is linear in the above example, which is a bit too monotonous. The void Seteasingcurve (const qeasingcurve & Easing) function in Qpropertyanimation is precisely the list of available parameters for implementing different curvature variations ( including the function graph) can be found in the document. Change the code portion of the animation related above to

qpropertyanimation *anim1=new qpropertyanimation (bird_1, "pos");
Anim1->setduration (2000);
Anim1->setstartvalue (Qpoint (0, 360));
Anim1->setendvalue (Qpoint (110, 180));
Anim1->seteasingcurve (qeasingcurve::outbounce);
Anim1->start ();

Notice that the fourth sentence is added. And try the other curve parameters, then run, see the dynamic effect is not the same. If you are not satisfied with the curves already in the list, you can also inherit qeasingcurve to achieve the desired effect.

Third decision: Qanimationgroup

The previous example is that only one animation is running, and if you want to run it with multiple animations, the animation group will be qanimationgroup. The animation group is divided into two categories, serial and parallel, corresponding to the qanimationgroup of the two subclasses Qsequentialanimationgroup and Qparallelanimationgroup. The usage is simple.

Qsequentialanimationgroup Group;
Qparallelanimationgroup Group;
Group.addanimation (ANIM1);
Group.addanimation (ANIM2);
Group.start ();

The above code, if it is serial, then the animation anim1 run, will not run ANIM2. If it's parallel, two animations are running at the same time. If an animation group is added, then a single anim1->start () is not required to be called separately, and is managed by the animation group. The following is a code that can be run, with two birds moving from the upper-left and lower-right corners of the form to the middle.

Copy Code

2. #include <QApplication>
4. #include <QWidget>
6. #include <QLabel>
8. #include <QPixmap>
10. #include <QPropertyAnimation>
12. #include <QSequentialAnimationGroup>
14. #include <QParallelAnimationGroup>
18. int main (int argc,char *argv[]) {
20. Qapplication app (ARGC,ARGV);
22. Qwidget *w=new qwidget ();
24. W->resize (300,400);
26. Qpixmap Birdimg=qpixmap ("Twitter-bird.png"). Scaled (40,40);
28. Qlabel *bird_1=new Qlabel (w);
30. Bird_1->setpixmap (BIRDIMG);
32. Qpropertyanimation *anim1=new qpropertyanimation (bird_1, "pos");
34. Anim1->setduration (2000);
36. Anim1->setstartvalue (Qpoint (0, 360));
38. Anim1->setendvalue (Qpoint (110, 180));
40. Anim1->seteasingcurve (qeasingcurve::outbounce);
42. Anim1->start ();
44. Qlabel *bird_2=new Qlabel (w);
46. Bird_2->setpixmap (BIRDIMG);
48. Qpropertyanimation *anim2=new qpropertyanimation (bird_2, "pos");
50. Anim2->setduration (2000);
52. Anim2->setstartvalue (qpoint (0, 0));
54. Anim2->setendvalue (Qpoint (150, 180));
56. Anim2->seteasingcurve (qeasingcurve::outbounce);
58. Qsequentialanimationgroup Group;
60. Qparallelanimationgroup Group;
62. Group.addanimation (ANIM1);
64. Group.addanimation (ANIM2);
66. Group.start ();
68. Bird_1->move ( -40,-40);
70. Bird_2->move ( -40,-40);
72. W->show ();
74. return App.exec ();
76. }

The source of the article in: HTTP://DOCS.GOOGLE.COM/VIEW?ID=DHHVRCMH_100M5XS7WF3, if there is an update may be reflected over there

Http://www.qtcn.org/bbs/read-htm-tid-34061.html

Qt Animation Quick Start (i)