The NoteApp’s* UI can be considered complete in terms of functionality and user interaction. However, there is plenty of room for improvement by making the UI more appealing to the user. QML was designed as a declarative language, keeping in mind the animations and fluid transitions of UI elements.
In this chapter, we will guide you step-by-step on how to add animations and make NoteApp* feel more fluid. QML provides a set of QML types that enable you to implement animations in a more convenient approach. This chapter introduces new types and guides how to use them in our QML Components to make the UI more fluid.
Note
You will find the implementation related to this chapter in the zip file provided in the get-source-code section.
In summary, the chapter will cover the following main topics:
- Introducing concepts about animations and transitions in QML
- New QML types will be covered, such as Behavior, Transition and various Animation elements
- Enhancing NoteApp QML Components using various animations
This chapter has the following steps: