QT Mobile Application Development (II): Using animated Frames

QT Mobile Application Development (II): Using animated Frames

The previous blog describes how to use QT qml to adapt to the screen resolution size, in fact, the different resolution of the adaptation is a very difficult problem, in addition to different resolutions, aspect ratio (aspect ratio) is not the same.

Some tablets do the same with the ipad as the Retina screen (2048x1536), and some low-end phone resolutions are just 320x480. So the width and height ratio is different. So in the process of designing the app, we must plan the content layout. The use of Anchor layout method can help us solve certain problems, at the same time also make good use of members of the screen class to obtain a lot of other information system resolution.

This article mainly introduces the animation frame of Qtquick.

The Qt Quick Animation framework has been available since the QT4 era, and there have been a lot of demos that have given us a bright front.

An animated frame derived from C + +. Qt Quick's animated frame is beautiful and easy to use. Well worth learning.

original article. Opposed to undeclared references. Original blog address:http://blog.csdn.net/gamesdev/article/details/32730079

Let's start by introducing several classes related to the animation framework:

Animation are the base classes for these classes. It has these several properties:

AlwaysRunToEnd:boolloops:intpaused:boolrunning:bool

The latter three properties are well understood. The first explanation is that if set to true, the animation will be finished in the last round, regardless of whether or not it ends. Set to False, then once the animation is finished. Then the animation ends immediately.

Animation have very many subclasses. Contains Anchoranimation, Parallelanimation, Parentanimation, Pathanimation, PauseAnimation, Propertyaction, Propertyanimation, Scriptaction, and Sequentialanimation. We are in the practical application. Typically a single animation uses propertyanimation subclasses ColorAnimation, Numberanimation, Rotationanimation, and Vector3DAnimation, and here's a simple example:

Numberanimation on x {from:0;to:100; duration:1000}

As seen in the example above, the sub-categories below propertyanimation are flexible and diverse. There are many forms of grammatical existence, often with prepositions on and the phrase behavior on. The above example indicates that the type of animation on the left side of the preposition must correspond to the property type on the right. Suppose you want to apply a preposition on to a Vector3D variable. So it should be written like this:

Vector3DAnimation on position {from:Qt.vector3d (0, 0, 0); to Qt.vector3d (1, 1, 1); duration:1000}

The difference between Behavior on and on is that Behavioron provides the default animation operation. That is, behavior can describe the default animation:

Behavior on width{        numberanimation {duration:1000}}

But it may be that the QT quick animation this piece is not intact, sometimes on different platforms performance will be different, at times behavior not work. Sometimes it's good (a description of the problem).

When behavior encounters a state Transition (transition), behavior is overwritten. Please refer to QT documentation for details.

You see the game I made three bacteria and capsules have been moved from left to right, and are circular, here is the code:

image{         id:animatecapsule         height:parent.width/10         width:height/2         propertyint xFrom:parent.width + Height * 8         propertyint xTo:-height * 2         x:xfrom         y:parent.height * 0.45         Source: ". /.. /images/capsule.png "          rotationanimation on rotation         {                   from:0                   to:360                   loops: Animation.infinite                   duration:2000         }          //@ Desktop: Note Using this section of code         Behavioron x         {                   Numberanimation                   {                            from:animateCapsule.xFrom                            to:animateCapsule.xTo                            loops:Animation.Infinite                            duration:2000                   }}}         

This article participates in the CSDN Bowen contest. Please support me, vote for me!

QT Mobile Application Development (II): Using animated Frames