1 | /****************************************************************************
|
---|
2 | **
|
---|
3 | ** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies).
|
---|
4 | ** All rights reserved.
|
---|
5 | ** Contact: Nokia Corporation (qt-info@nokia.com)
|
---|
6 | **
|
---|
7 | ** This file is part of the documentation of the Qt Toolkit.
|
---|
8 | **
|
---|
9 | ** $QT_BEGIN_LICENSE:FDL$
|
---|
10 | ** Commercial Usage
|
---|
11 | ** Licensees holding valid Qt Commercial licenses may use this file in
|
---|
12 | ** accordance with the Qt Commercial License Agreement provided with the
|
---|
13 | ** Software or, alternatively, in accordance with the terms contained in a
|
---|
14 | ** written agreement between you and Nokia.
|
---|
15 | **
|
---|
16 | ** GNU Free Documentation License
|
---|
17 | ** Alternatively, this file may be used under the terms of the GNU Free
|
---|
18 | ** Documentation License version 1.3 as published by the Free Software
|
---|
19 | ** Foundation and appearing in the file included in the packaging of this
|
---|
20 | ** file.
|
---|
21 | **
|
---|
22 | ** If you have questions regarding the use of this file, please contact
|
---|
23 | ** Nokia at qt-info@nokia.com.
|
---|
24 | ** $QT_END_LICENSE$
|
---|
25 | **
|
---|
26 | ****************************************************************************/
|
---|
27 |
|
---|
28 | /*!
|
---|
29 | \example animation/moveblocks
|
---|
30 | \title Move Blocks Example
|
---|
31 |
|
---|
32 | The Move Blocks example shows how to animate items in a
|
---|
33 | QGraphicsScene using a QStateMachine with a custom transition.
|
---|
34 |
|
---|
35 | \image moveblocks-example.png
|
---|
36 |
|
---|
37 | The example animates the blue blocks that you can see in the image
|
---|
38 | above. The animation moves the blocks between four preset positions.
|
---|
39 |
|
---|
40 | The example consists of the following classes:
|
---|
41 |
|
---|
42 | \list
|
---|
43 | \o \c StateSwitcher inherits QState and can add
|
---|
44 | \c {StateSwitchTransition}s to other states.
|
---|
45 | When entered, it will randomly transition to one of these
|
---|
46 | states.
|
---|
47 | \o \c StateSwitchTransition is a custom transition that
|
---|
48 | triggers on \c{StateSwitchEvent}s.
|
---|
49 | \o \c StateSwitchEvent is a QEvent that triggers \c{StateSwitchTransition}s.
|
---|
50 | \o \c QGraphicsRectWidget is a QGraphicsWidget that simply
|
---|
51 | paints its background in a solid \l{Qt::}{blue} color.
|
---|
52 | \endlist
|
---|
53 |
|
---|
54 | The blocks are instances of \c QGraphicsRectWidget and are
|
---|
55 | animated in a QGraphicsScene. We do this by building a state
|
---|
56 | graph, which we insert animations into. The graph is then executed
|
---|
57 | in a QStateMachine. All this is done in \c main().
|
---|
58 | Let's look at the \c main() function first.
|
---|
59 |
|
---|
60 | \section1 The \c main() Function
|
---|
61 |
|
---|
62 | After QApplication has been initialized, we set up the
|
---|
63 | QGraphicsScene with its \c{QGraphicsRectWidget}s.
|
---|
64 |
|
---|
65 | \snippet examples/animation/moveblocks/main.cpp 1
|
---|
66 |
|
---|
67 | After adding the scene to a QGraphicsView, it is time to build the
|
---|
68 | state graph. Let's first look at a statechart of what we are
|
---|
69 | trying to build.
|
---|
70 |
|
---|
71 | \image move-blocks-chart.png
|
---|
72 |
|
---|
73 | Note that the \c group has seven sub states, but we have only
|
---|
74 | included three of them in the diagram. The code that builds this
|
---|
75 | graph will be examined line-by-line, and will show how the graph
|
---|
76 | works. First off, we construct the \c group state:
|
---|
77 |
|
---|
78 | \snippet examples/animation/moveblocks/main.cpp 2
|
---|
79 |
|
---|
80 | The timer is used to add a delay between each time the blocks are
|
---|
81 | moved. The timer is started when \c group is entered. As we will
|
---|
82 | see later, \c group has a transition back to the \c StateSwitcher
|
---|
83 | when the timer times out. \c group is the initial state in the
|
---|
84 | machine, so an animation will be scheduled when the example is
|
---|
85 | started.
|
---|
86 |
|
---|
87 | \snippet examples/animation/moveblocks/main.cpp 3
|
---|
88 | \dots
|
---|
89 | \snippet examples/animation/moveblocks/main.cpp 4
|
---|
90 |
|
---|
91 | \c createGeometryState() returns a QState that will set the
|
---|
92 | geometry of our items upon entry. It also assigns \c group as the
|
---|
93 | parent of this state.
|
---|
94 |
|
---|
95 | A QPropertyAnimation inserted into a transition will use the
|
---|
96 | values assigned to a QState (with QState::assignProperty()), i.e.,
|
---|
97 | the animation will interpolate between the current values of the
|
---|
98 | properties and the values in the target state. We add animated
|
---|
99 | transitions to the state graph later.
|
---|
100 |
|
---|
101 | \snippet examples/animation/moveblocks/main.cpp 5
|
---|
102 |
|
---|
103 | We move the items in parallel. Each item is added to \c
|
---|
104 | animationGroup, which is the animation that is inserted into the
|
---|
105 | transitions.
|
---|
106 |
|
---|
107 | \snippet examples/animation/moveblocks/main.cpp 6
|
---|
108 |
|
---|
109 | The sequential animation group, \c subGroup, helps us insert a
|
---|
110 | delay between the animation of each item.
|
---|
111 |
|
---|
112 | \snippet examples/animation/moveblocks/main.cpp 7
|
---|
113 | \dots
|
---|
114 | \snippet examples/animation/moveblocks/main.cpp 8
|
---|
115 |
|
---|
116 | A StateSwitchTransition is added to the state switcher
|
---|
117 | in \c StateSwitcher::addState(). We also add the animation in this
|
---|
118 | function. Since QPropertyAnimation uses the values from the
|
---|
119 | states, we can insert the same QPropertyAnimation instance in all
|
---|
120 | \c {StateSwitchTransition}s.
|
---|
121 |
|
---|
122 | As mentioned previously, we add a transition to the state switcher
|
---|
123 | that triggers when the timer times out.
|
---|
124 |
|
---|
125 | \snippet examples/animation/moveblocks/main.cpp 9
|
---|
126 |
|
---|
127 | Finally, we can create the state machine, add our initial state,
|
---|
128 | and start execution of the state graph.
|
---|
129 |
|
---|
130 | \section2 The \c createGeometryState() Function
|
---|
131 |
|
---|
132 | In \c createGeometryState(), we set up the geometry for each
|
---|
133 | graphics item.
|
---|
134 |
|
---|
135 | \snippet examples/animation/moveblocks/main.cpp 13
|
---|
136 |
|
---|
137 | As mentioned before, QAbstractTransition will set up an animation
|
---|
138 | added with \l{QAbstractTransition::}{addAnimation()} using
|
---|
139 | property values set with \l{QState::}{assignProperty()}.
|
---|
140 |
|
---|
141 | \section1 The StateSwitcher Class
|
---|
142 |
|
---|
143 | \c StateSwitcher has state switch transitions to each \l{QState}s
|
---|
144 | we created with \c createGeometryState(). Its job is to transition
|
---|
145 | to one of these states at random when it is entered.
|
---|
146 |
|
---|
147 | All functions in \c StateSwitcher are inlined. We'll step through
|
---|
148 | its definition.
|
---|
149 |
|
---|
150 | \snippet examples/animation/moveblocks/main.cpp 10
|
---|
151 |
|
---|
152 | \c StateSwitcher is a state designed for a particular purpose and
|
---|
153 | will always be a top-level state. We use \c m_stateCount to keep
|
---|
154 | track of how many states we are managing, and \c m_lastIndex to
|
---|
155 | remember which state was the last state to which we transitioned.
|
---|
156 |
|
---|
157 | \snippet examples/animation/moveblocks/main.cpp 11
|
---|
158 |
|
---|
159 | We select the next state we are going to transition to, and post a
|
---|
160 | \c StateSwitchEvent, which we know will trigger the \c
|
---|
161 | StateSwitchTransition to the selected state.
|
---|
162 |
|
---|
163 | \snippet examples/animation/moveblocks/main.cpp 12
|
---|
164 |
|
---|
165 | This is where the magic happens. We assign a number to each state
|
---|
166 | added. This number is given to both a StateSwitchTransition and to
|
---|
167 | StateSwitchEvents. As we have seen, state switch events will
|
---|
168 | trigger a transition with the same number.
|
---|
169 |
|
---|
170 | \section1 The StateSwitchTransition Class
|
---|
171 |
|
---|
172 | \c StateSwitchTransition inherits QAbstractTransition and triggers
|
---|
173 | on \c{StateSwitchEvent}s. It contains only inline functions, so
|
---|
174 | let's take a look at its \l{QAbstractTransition::}{eventTest()}
|
---|
175 | function, which is the only function that we define..
|
---|
176 |
|
---|
177 | \snippet examples/animation/moveblocks/main.cpp 14
|
---|
178 |
|
---|
179 | \c eventTest is called by QStateMachine when it checks whether a
|
---|
180 | transition should be triggered--a return value of true means that
|
---|
181 | it will. We simply check if our assigned number is equal to the
|
---|
182 | event's number (in which case we fire away).
|
---|
183 |
|
---|
184 | \section1 The StateSwitchEvent Class
|
---|
185 |
|
---|
186 | \c StateSwitchEvent inherits QEvent, and holds a number that has
|
---|
187 | been assigned to a state and state switch transition by
|
---|
188 | \c StateSwitcher. We have already seen how it is used to trigger
|
---|
189 | \c{StateSwitchTransition}s in \c StateSwitcher.
|
---|
190 |
|
---|
191 | \snippet examples/animation/moveblocks/main.cpp 15
|
---|
192 |
|
---|
193 | We only have inlined functions in this class, so a look at its
|
---|
194 | definition will do.
|
---|
195 |
|
---|
196 | \section1 The QGraphicsRectWidget Class
|
---|
197 |
|
---|
198 | QGraphicsRectWidget inherits QGraphicsWidget and simply paints its
|
---|
199 | \l{QWidget::}{rect()} blue. We inline \l{QWidget::}{paintEvent()},
|
---|
200 | which is the only function we define. Here is the
|
---|
201 | QGraphicsRectWidget class definition:
|
---|
202 |
|
---|
203 | \snippet examples/animation/moveblocks/main.cpp 16
|
---|
204 |
|
---|
205 | \section1 Moving On
|
---|
206 |
|
---|
207 | The technique shown in this example works equally well for all
|
---|
208 | \l{QPropertyAnimation}s. As long as the value to be animated is a
|
---|
209 | Qt property, you can insert an animation of it into a state graph.
|
---|
210 |
|
---|
211 | QState::addAnimation() takes a QAbstractAnimation, so any type
|
---|
212 | of animation can be inserted into the graph.
|
---|
213 | */
|
---|
214 |
|
---|