How it works...

There are two push buttons and a label on the main window layout. The button at the top-left corner will trigger the state change when pressed, while the label at the top-right corner will change its text to show which state we are currently in, and the button below will animate according to the current state. The QEventTransition classes define what will trigger the transition between one state and another.

In our case, we want the state to change from state 1 to state 2 when the changeState button (the one at the upper-left) is clicked. After that, we also want to change from state 2 back to state 1 when the same button is pressed again. This can be achieved by creating another event transition class and setting the target state back to state 1. Then, add these transitions to their respective states. Instead of just assigning the properties directly to the widgets, we tell Qt to use the property animation class to smoothly interpolate the properties toward the target values. It is that simple! There is no need to set the start value and end value, because we have already called the assignProperty() function, which has automatically assigned the end value.