Important: Please read the Qt Code of Conduct -

[SOLVED] Workaround for the static nature of QML? Dynamically structured UI - by the end user, during runtime?

  • There has been a lot of talk about the "dynamic" QML user interfaces. However, the word dynamic comes with a lot of contexts:

    • it is true that with QML it is easier to make animated UI, which is one context of dynamic

    • it is true that QML relies on JS, which is a dynamic language instead of a static compiled one


    QML is declarative markup, which means it describes the UI, which means the UI will always follow the description, and in that context it is not dynamic but STATIC.

    I need a dynamic UI in the context the UI is not pre-determined, I need the user changing the UI during the runtime.

    • not a designer as in a person

    • not with a designer, A.K.A a visual editor

    The application is a car dashboard which the USER can customize, during runtime, having a number of per-built components such as dials, indicators, which the user can drag from the component list into the application, place as he requires and connects to whatever data sources he wants.

    I know how to do this with QGS/V/I, I know how to do this with QWidget, however, having QtQuick rely on static markup to describe the UI, and without a public native interface to build the UI imperatively with, this problem represents a challenge, at least for me.

    So far all the QML examples I've been through include a fixed, static, predetermined structure and logic to build the interface, list views, grids, repeaters and what not. But what about DYNAMICALLY STRUCTURED UI?

    I would like to make use of the out-of-the-box QtQuick2 features and performance, plus building the components themselves will be much easier in QML, so I am curious of what workflow will you, QML experts and proponents offer.

    Is there a more elegant way than concatenating different fragments of QML code and executing that, which is the only way I can think of?

  • Listviews, grids, repeaters etc. are one way to handle dynamic QML UI but you can dynamically create any QML Component in runtime.
    Check out "Dynamic Object Management in QML": It has good examples on how to create and destroy components.

  • As Tomma said, you can use dynamic object management to create and destroy visual objects at runtime.

    You can dynamically add or remove visual objects from the scene at runtime, simply by creating a visual object (with Component.createObject()) and giving it a visual parent. Note that QObject parent and visual parent are different concepts, see the docs for more in-depth discussion on that.

    But basically, by giving a newly created visual object, a visual parent, it then gets added to the visual scene and will be rendered. Thus, you can dynamically change your UI at runtime.


Log in to reply