Tutorial for creating UIs with Qt Creator in Design mode

[Mkdkr]

Hello,

New to Qt. I'm using Qt for MCUs. I've followed this video webinar:
https://resources.qt.io/videos/programming-for-smart-devices-microcontrollers-with-stm32-series-and-qt
It shows how to develop a UI with QML.

I'm wondering if there's a tutorial which shows how to use Qt Creator only in design mode to create screens and add interactions etc.
Or am I missing something - is Creator not the tool for this?

If it helps, I'm working with an STM32F469I-DISCOVERY.

[ylopes]

You have two options: use Qt Creator's design mode or use Qt Design Studio. Except for a few notable exceptions, they are essentially the same thing. What you don't get for example in Qt Creator are the bridges to design tools such as Photoshop and Sketch (https://doc.qt.io/qtdesignstudio/psqtbridge.html).

You can watch a series of tutorial video in this playlist: https://www.youtube.com/playlist?list=PLizsthdRd0Ywkf3hf8cLfpaiuZR_-SMFs
Note however that several concepts in these videos do not apply to Qt for MCUs, as the QML subset is limited compared to "full" Qt. When creating a project in Qt Design Studio, you have the option to create a MCU project, the design environment that you will be able to use will be limited to what you can actually do on MCUs. You can then switch to Qt Creator (or another IDE) to develop the logic/backend in C/C++. The project created by Design Studio contains a generated CMake project for your convenience.

[Mkdkr]

Great :) thank for the info!

[ylopes]

Here is another video tutorial specifically about using Qt Design Studio with Qt for MCUs: https://resources.qt.io/qt-on-demand-webinars/get-started-creating-dynamic-uis-with-qt-design-studio-and-photoshop-on-mcus-on-demand-webinar-2