We have added a lot of new functionality to Qt Quick in Qt 5.1 and this blog aims to give you a brief overview. Most of the features that were previously part of the Desktop Components Project are now officially part of Qt Quick. The most obvious one being the inclusion of a new QtQuick.Controls module, but we have also added a number of related features that I would like to summarise in this blog.
While anchors and basic positioners have previously provided great flexibility with Qt Quick, they can sometimes become tedious, verbose or complex when dealing with resizable user interfaces. By adding QtQuick.Layouts as a compliment to the existing anchor based methods, you can now build complex resizable layouts, respecting minimum, maximum size hints and declare items as expanding or fixed in a simple and declarative way. We previously blogged about layouts here.
Controls are essentially the Qt Quick equivalent of widgets. Unlike the simple but powerful primitives previously provided by Qt Quick, these controls are completely defined and ready to use. Most of the familiar controls you would expect are there, including buttons, combo box, spin box, group box, sliders, progress bars, text fields and menus. They are built from the ground up using Qt Quick, and can of course be combined with any existing Qt Quick code.
In addition to the basic controls, we also include a new set of views. As shown above, SplitView makes it possible to add a vertical or horizontal resize handle between items in a view.
ScrollView compliments the existing Flickable item but adds support for scroll bars and frame. It can be used both stand alone or in combination with an existing Flickable item, for instance in order to add scroll bars to a ListView.
Most of the controls and views can also be customised so you will be able to create completely unique look for your application.
While most of our focus for the initial release was on improving Qt Quick development on the desktop, the controls are all platform agnostic and will work on all of the supported platforms. That said you should not expect a desktop application to look or work nicely on a tablet without adapting it to a more suitable application layout. To simplify application development on tablets or phones we have also added a StackView control that provides typical stack based (or drill-down) navigation through a series of application pages.
Platform exposed to QML
Possible values are:
- "android" – Android
- "blackberry" – BlackBerry OS
- "ios" – Apple iOS
- "linux" – Linux
- "mac" – Mac OS X
- "unix" – Other Unix-based OS
- "windows" – Windows
- "wince" – Windows CE
Tab key navigation
Supporting tab key navigation has previously been rather difficult as you had to create an explicit key chain between every control in your application. In 5.1, we have simplified this process significantly by adding the property activeFocusOnTab to QQuickItem. Setting this will attach the control to the implicit tab key chain. Since all of the provided controls already have this enabled by default, you can now rely on the key navigation to work out of the box when using controls.
We are introducing a couple of new standard dialogs via the QtQuick.Dialogs import. Initially only ColorDialog and FileDialog will be supported, but we are planning to add more dialogs in later releases. These will generally map to the native platform dialogs on different systems.
Exposing the text document to C++
One issue with the existing TextEdit item was that you were stuck with simply showing rich text. Most complex Qt applications require access to the text document in order to provide more advanced features such as syntax highlighters, code completion or printing support. While using this functionality is going to require a C++ plugin, we have made this accessible from both the TextEdit and the new TextArea control so you can enable all of this functionality in your Qt Quick applications. As you can see from the screenshot above, we have ported the good old TextEdit example to Qt Quick using this functionality.
In Qt 5.0 we generally created Qt Quick applications by declaring a QQuickView in C++ and setting the base url on it. The drawback of that approach is that you have to use C++ to set properties like width, height etc. In Qt 5.1 we encourage using Window or ApplicationWindow as the root item of your application, giving complete control to Qt Quick, so we are now introducing the QQmlApplicationEngine to make this use case a little bit simpler. The QmlApplicationEngine is all you need to set up your qt quick window, pick up the right translation files and it implicitly connects the application quit() signal to your root window.
int main(int argc, char *argv)
QGuiApplication app(argc, argv);
Embedding Qt Quick in Widgets