More of Qt Quick Designer and Qt Quick Controls 2
June 06, 2016 by Thomas Hartmann | Comments
Qt Creator 4.0 is now released and since so many of you asked for it, we now publish the full uncut video that shows how to create the UI of a simple home automation application using the new Qt Quick 2 Controls.
The resulting demo application is available here: Smart Home Demo Application
To use the material style, you have to set this environment variable:
To customize the Material style, we manually import Qt.labs.controls.material 1.0 and set some of the attached properties:
One reason why we create PageBackground.qml in this demo is to define those properties once in PageBackground and then to use PageBackground as the root element for each form. The values of those properties are propagated to children in a way similar to using style sheets.
For each part of the UI, such as the side bar or the single tabs, we create a form as a .ui.qml file and a .qml file. While the .ui.qml file contains the layout, the .qml file contains the signal handlers and data models. This way the imperative parts of the implementation are separated from the pure declarative parts that are used for the UI.
Qt Creator supports this workflow by providing the "Goto Implementation" context menu. This makes it easy to implement new signal handlers and to navigate between the different files.
In the navigator, items in the .ui.qml file can be exported as alias properties. This is necessary to access them in the .qml file. This is done automatically when a signal handler is implemented, but for example the combo box is exported manually to define the model in the .qml file.
This approach allows any kind of complex logic in the .qml file while .ui.qml stays simple and declarative and can be opened in the Design mode even in later stages of the development.
Subscribe to our newsletter
Try Qt 6.5 Now!
Download the latest release here: www.qt.io/download.
Qt 6.5 is the latest Long-Term-Support release with all you need for C++ cross-platform app development.
Explore Qt World
Check our Qt demos and case studies in the virtual Qt World
Check out all our open positions here and follow us on Instagram to see what it's like to be #QtPeople.
Näytä tämä julkaisu Instagramissa.
Want to build something for tomorrow, join #QtPeople today! We have loads of cool jobs you don't want to miss! http://qt.io/careers #builtwithQt #software #developers #coding #framework #tool #tooling #C++ #QML #engineers #sales #tech #technology #UI #UX #CX #Qt #Qtdev #global #openpositions #careers #job
Henkilön Qt (@theqtcompany) jakama julkaisu