How Do I Make That in QML?

If you've found yourself asking this recently, this webinar is for you!

Developing a user interface in QML consists of three parts:

  • Writing "controls" (reusable UI components) that match artist mockups
  • Laying out the controls onto screens
  • Connecting the screens to a backend (usually C++)

In this webinar, we'll focus on writing controls and walk through a set of 17 QML controls made "from scratch" i.e. from QML primitives e.g. Item, Rectangle, Text, etc. 

In early versions of Qt 5 (and Qt 4) writing QML in this way was pretty much the only option. More recently, Qt Quick Controls, Qt Charts, and Qt Virtual Keyboard provide more options; however, you might not be on the correct Qt version or license to take advantage of them. The 17 controls we'll go through, below, work on any version of Qt 5 (most also work on Qt 4), are easy to understand and modify, and are also a great way to learn how to write excellent QML!

1.  Button
2.  CheckBox and RadioButton
3.  Switch
4.  Slider
5.  ScrollBar
6.  ProgressBar
7.  Spinner
8.  Dialog
9.  PageDots
10. Tabs
11. Table
12. TimePicker
13. DatePicker
14. BarChart
15. LineChart
16. PieChart
17. Keyboard

These controls are taken from our blog series: