Qt5: GUIs with Qt Quick and QML
In the previous article on Qt5 (Part 2), we built a small server program that served a random fortune cookie to anyone who connected to it using TCP, and we tested it out by telneting into it. In the third and final part of this series, we’re going to bui
W e’ve been dabbling with Qt5 for some time now, without doing the one thing that Qt is famous for – the GUIs. Now, we’re finally going to build that GUI in the easy and fun new way using QtQuick and QML. We’ll be building a fairly complex GUI with a bit of configuration headroom, without touching a single line of C++ code for the GUI logic.
That’s not to say we won’t be using C++ at all –- we’ll use it to write a QML component that does the networking bits for us. In the bargain, you’ll also learn how to extend QML and QtQuick programs with C++ code. But first, here’s a primer on QtQuick and QML.
QtQuick and QML
QtQuick made its debut in Qt4.7 but only became the recommended way of building GUIs in Qt5. Originally, QUICK stood for Qt User Interface Construction Kit, but now it’s just called QtQuick.
So what is it? Well, the answer comes in two parts. The first is QML (again, originally Qt Markup Language, but now just called QML), a declarative language very much like JavaScript which can be used to declaratively describe the GUI and its logic. That’s right; you build the GUI and script it using nothing but JavaScript. The second part is QtQuick itself, which is a set of components (or controls) that you can make use of in your QML based GUIs.
QtQuick and QML were first conceived as a new way of writing UIs for Qt applications. These were meant for people without much of a programming background as, back then, Qt was used to write applications for Nokia’s Maemo and then MeeGo (and even today, it’s used to write applications for Sailfish OS). QtQuick 1.0 was quickly hacked together and did its job well, but wasn’t much of a performer. However, that didn’t stop it from being used outside the mobile development space; it was used widely in KDE’s Plasma Active and eventually in parts of Plasma 4 itself.
QtQuick 2.0, which came with Qt5, was a major overhaul. Because QtQuick became so popular with developers on both desktops and mobile devices, its creators had to make it a first-class way to build GUIs. So with Qt5, they redid the entire GUI rendering pipeline, making the whole thing 3D based, and using OpenGL as a backend. The downside to this is that QtQuick 2.0 requires OpenGL support to run, even if the GUI consists only of 2D widgets, as these widgets are internally implemented as OpenGL surfaces. The upside is that QtQuick 2.0 GUIs are extremely fast.