Qt5 C++ GUI Programming Cookbook

States, transitions, and animations in QML

If you prefer to work with QML instead of C++, Qt also provides similar features in Qt Quick that allow you to easily animate a GUI element with the minimum lines of code. In this example, we will learn how to achieve this with QML.

How to do it…

1. First we will create a new Qt Quick Application project and set up our user interface like so:
   
2. Here is what my main.qml file looks like:

   import QtQuick 2.3 import QtQuick.Window 2.2 Window { visible: true width: 480; height: 320; Rectangle { id: background; anchors.fill: parent; color: "blue"; } Text { text: qsTr("Hello World"); anchors.centerIn: parent; color: "white"; ...