One of the most popular is the usage of Q_PROPERTY macro. Every class that derives from QObject (and contains Q_OBJECT macro) can use it. The other option is to use Q_GADGET macro. The simplest syntax requires type of the variable, its name and the getter (marked as READ or direct access \u2013 MEMBER). The type could be defined by the user or one of the types supported by Qt could be used.<\/p>\n\n\n\n
There are a lot of features that Q_PROPERTY offers but aside of the required ones, often used are WRITE and NOTIFY. The first works as a setter (it requires a param of the same type as the property itself) and the second one is a signal that notifies any changes of the property (at least it should, after receiving the signal, the getter is called to check the value).<\/p>\n\n\n\n
Most common accessors<\/strong><\/h2>\n\n\n\nThe most common accessors are:<\/p>\n\n\n\n
\n- READ \u2013 getter, must return either the property’s type or a const reference to that type.<\/li>\n\n\n\n
- WRITE \u2013 setter, it must return void and must take exactly one argument, either of the property’s type or a pointer or reference to that type.<\/li>\n\n\n\n
- MEMBER \u2013 could work instead of READ and WRITE, giving direct access to a variable. However, it\u2019s possible to use READ or<\/strong> WRITE in addition to MEMBER.<\/li>\n\n\n\n
- RESET \u2013 reset the property to the default value, The RESET function must return void and take no parameters.<\/li>\n\n\n\n
- NOTIFY \u2013 should specify the signal which is emitted when the value (of the property) changes. Qt emits automatically that signal when needed for MEMBER properties that do not have an explicit setter.<\/li>\n\n\n\n
- USER (bool) \u2013 attribute indicates whether the property is designated as the user-facing or user-editable property for the class. Normally, there is only one USER property per class (default false).<\/li>\n\n\n\n
- CONSTANT \u2013 means that the property value is constant (exclude WRITE and NOTIFY).<\/li>\n\n\n\n
- FINAL – property will not be overridden by a derived class.<\/li>\n\n\n\n
- REQUIRED \u2013 the property should be set by a user of the class. In QML, classes with REQUIRED properties cannot be instantiated unless all REQUIRED properties have been set.<\/li>\n\n\n\n
- BINDABLE (from Qt 6.0) \u2013 indicates that the property supports bindings.<\/li>\n<\/ul>\n\n\n\n
Creating a class with Q_Property macro<\/strong><\/h2>\n\n\n\nBelow there are two basic examples tow to create a class with Q_PROPERTY macro. The first is based on Qt5 and uses READ WRITE and NOTIFY, the second uses brand new BINDABLE and \u2026 does the same thing on QML side but has more to offer for C++.<\/p>\n\n\n\n![\"Qt5](\"https:\/\/sii.ua\/blog\/wp-content\/uploads\/2024\/01\/Fig.-1.png\")
<\/a>Fig. 1 Qt5 example of Q_PROPERTY usage \u2013 header<\/em><\/figcaption><\/figure>\n\n\n\n![\"Qt5](\"https:\/\/sii.ua\/blog\/wp-content\/uploads\/2024\/01\/Fig.-2.png\")
<\/a>Fig. 2 Qt5 example of Q_PROPERTY usage \u2013 cpp<\/em><\/figcaption><\/figure>\n\n\n\n![\"Qt6](\"https:\/\/sii.ua\/blog\/wp-content\/uploads\/2024\/01\/Fig.-3.png\")
<\/a>Fig. 3 Qt6 example of Q_PROPERTY usage \u2013 header<\/em><\/figcaption><\/figure>\n\n\n\n![\"Qt6](\"https:\/\/sii.ua\/blog\/wp-content\/uploads\/2024\/01\/Fig.-4.png\")
<\/a>Fig. 4 Qt6 example of Q_PROPERTY usage \u2013 cpp<\/em><\/figcaption><\/figure>\n\n\n\nAnd to the point, one way to access the variable<\/em> property from QML is setContextProperty<\/strong> \u2013 exposing instance (one) to every component loaded by the engine. Object underneath testObj<\/em> could be now used in QML by the name myTest<\/em>. Usage is limited to Q_PROPERTY, signals and public slots (or Q_INVOKABLE functions). But it grants easy access.<\/p>\n\n\n\n![\"Usage](\"https:\/\/sii.ua\/blog\/wp-content\/uploads\/2024\/01\/Fig.-6.png\")
<\/a>Fig. 6 Usage of context property and Q_PROPERTY<\/em><\/figcaption><\/figure>\n\n\n\nClicking on a button will result in incrementing the variable (calling setter) and through notification signal, the getter is called (READ) and all bindings on QML side are updated.<\/p>\n\n\n\n
Maybe a few more words on BINDABLE as it enhances performance and introduces property binding also on C++ side. This help to simplify the program, by eliminating a lot of boilerplate code for tracking and reacting to dependency updates of different objects. Instead of using a setter, it is possible to simply assign a new value as shown below.<\/p>\n\n\n\n![\"BINDABLE](\"https:\/\/sii.ua\/blog\/wp-content\/uploads\/2024\/01\/Fig.-7.png\")
<\/a>Fig. 7 BINDABLE usage<\/em><\/figcaption><\/figure>\n\n\n\nQ_INVOKABLE & Public slots<\/strong><\/h2>\n\n\n\nOne of these allows calling the function directly from QML. One important disclaimer here. This will transfer ownership to QML side so e.g. if a pointer to an object is returned from the function beware of the garbage collector when C++ also uses this object. This could be tricky to investigate since a garbage collector could not be called right away. To manually change the object ownership QQmlEngine::setObjectOwnership<\/em> can be used.<\/p>\n\n\n\n![\"Syntax](\"https:\/\/sii.ua\/blog\/wp-content\/uploads\/2024\/01\/Fig.-8.png\")
<\/a>Fig. 8 Syntax difference between public slot and function with Q_INVOKABLE macro<\/em><\/figcaption><\/figure>\n\n\n\nQML Connections<\/strong><\/h2>\n\n\n\nQML component that can be used when:<\/p>\n\n\n\n
\n- Multiple connections to the same signal are required.<\/li>\n\n\n\n
- Creating connections outside the scope of the signal sender.<\/li>\n\n\n\n
- Connecting to targets not defined in QML.<\/li>\n<\/ul>\n\n\n\n
![\"Example](\"https:\/\/sii.ua\/blog\/wp-content\/uploads\/2024\/01\/Fig.-9.png\")
<\/a>Fig. 9 Example of Connections usage<\/em><\/figcaption><\/figure>\n\n\n\nThis could be used to intercept any signal that is accessible from defined target. Syntax shown above was introduced in Qt 5.15.<\/p>\n\n\n\n
Accessing QML object from C++<\/h2>\n\n\n\n
It may be needed to change QML property from C++ e.g for testing purposes. To do this there are: QObject::setProperty()<\/em> or QQmlProperty::write()<\/em>. Firstly, it will be required to extract a particular QObject pointer like below:<\/p>\n\n\n\n![\"Two](\"https:\/\/sii.ua\/blog\/wp-content\/uploads\/2024\/01\/Fig.-10.png\")
<\/a>Fig. 10 Two ways of getting the QObject* of <\/em>QML object<\/em><\/figcaption><\/figure>\n\n\n\n![\"Two](\"https:\/\/sii.ua\/blog\/wp-content\/uploads\/2024\/01\/Fig.-11.png\")
<\/a>Fig. 11 Two ways of changing property value from C++<\/em><\/figcaption><\/figure>\n\n\n\nIf changing property is not enough it is even possible to call method (using QMetaObject::invokeMethod()<\/em>) as all QML methods are exposed to the meta-object system.<\/p>\n\n\n\nSummary<\/strong><\/h2>\n\n\n\nThe article presented the ways of communication between the frontend and the backend, depending on particular needs. The different methods, starting from variable access, through function calls, acting on emitted signal and ending on QML object access from C++, are shown in the paper.<\/p>\n\n\n\n
Sources<\/h2>\n\n\n\n\n- Qt Documentations \u2013\u00ad Exposing Attributes of C++ Types to QML<\/a><\/li>\n\n\n\n
- Qt Documentations \u2013 QQmlContext Class<\/a><\/li>\n\n\n\n
- Qt Documentation \u2013 Connections QML Type<\/a><\/li>\n\n\n\n
- Qt Documentation \u2013 QQmlContext Class, Set ContextProperty<\/a><\/li>\n\n\n\n
- Qt Documentation \u2013 The Property System<\/a><\/li>\n\n\n\n
- Qt Documentation \u2013 Qt Bindable Properties<\/a><\/li>\n\n\n\n
- Qt Documentation \u2013 Interacting with QML Objects from C++<\/a><\/li>\n\n\n\n
- Qt Doc Snapshots \u2013 QObjectBindableProperty Class<\/a><\/li>\n\n\n\n
- ICS \u2013 Qt 6 Bindings<\/a><\/li>\n<\/ol>\n\n\n
Creating a class with Q_Property macro<\/strong><\/h2>\n\n\n\nBelow there are two basic examples tow to create a class with Q_PROPERTY macro. The first is based on Qt5 and uses READ WRITE and NOTIFY, the second uses brand new BINDABLE and \u2026 does the same thing on QML side but has more to offer for C++.<\/p>\n\n\n\n<\/a>Fig. 1 Qt5 example of Q_PROPERTY usage \u2013 header<\/em><\/figcaption><\/figure>\n\n\n\n<\/a>Fig. 2 Qt5 example of Q_PROPERTY usage \u2013 cpp<\/em><\/figcaption><\/figure>\n\n\n\n<\/a>Fig. 3 Qt6 example of Q_PROPERTY usage \u2013 header<\/em><\/figcaption><\/figure>\n\n\n\n<\/a>Fig. 4 Qt6 example of Q_PROPERTY usage \u2013 cpp<\/em><\/figcaption><\/figure>\n\n\n\nAnd to the point, one way to access the variable<\/em> property from QML is setContextProperty<\/strong> \u2013 exposing instance (one) to every component loaded by the engine. Object underneath testObj<\/em> could be now used in QML by the name myTest<\/em>. Usage is limited to Q_PROPERTY, signals and public slots (or Q_INVOKABLE functions). But it grants easy access.<\/p>\n\n\n\n<\/a>Fig. 6 Usage of context property and Q_PROPERTY<\/em><\/figcaption><\/figure>\n\n\n\nClicking on a button will result in incrementing the variable (calling setter) and through notification signal, the getter is called (READ) and all bindings on QML side are updated.<\/p>\n\n\n\n
Maybe a few more words on BINDABLE as it enhances performance and introduces property binding also on C++ side. This help to simplify the program, by eliminating a lot of boilerplate code for tracking and reacting to dependency updates of different objects. Instead of using a setter, it is possible to simply assign a new value as shown below.<\/p>\n\n\n\n<\/a>Fig. 7 BINDABLE usage<\/em><\/figcaption><\/figure>\n\n\n\nQ_INVOKABLE & Public slots<\/strong><\/h2>\n\n\n\nOne of these allows calling the function directly from QML. One important disclaimer here. This will transfer ownership to QML side so e.g. if a pointer to an object is returned from the function beware of the garbage collector when C++ also uses this object. This could be tricky to investigate since a garbage collector could not be called right away. To manually change the object ownership QQmlEngine::setObjectOwnership<\/em> can be used.<\/p>\n\n\n\n<\/a>Fig. 8 Syntax difference between public slot and function with Q_INVOKABLE macro<\/em><\/figcaption><\/figure>\n\n\n\nQML Connections<\/strong><\/h2>\n\n\n\nQML component that can be used when:<\/p>\n\n\n\n
\n- Multiple connections to the same signal are required.<\/li>\n\n\n\n
- Creating connections outside the scope of the signal sender.<\/li>\n\n\n\n
- Connecting to targets not defined in QML.<\/li>\n<\/ul>\n\n\n\n
<\/a>Fig. 9 Example of Connections usage<\/em><\/figcaption><\/figure>\n\n\n\nThis could be used to intercept any signal that is accessible from defined target. Syntax shown above was introduced in Qt 5.15.<\/p>\n\n\n\n
Accessing QML object from C++<\/h2>\n\n\n\n
It may be needed to change QML property from C++ e.g for testing purposes. To do this there are: QObject::setProperty()<\/em> or QQmlProperty::write()<\/em>. Firstly, it will be required to extract a particular QObject pointer like below:<\/p>\n\n\n\n<\/a>Fig. 10 Two ways of getting the QObject* of <\/em>QML object<\/em><\/figcaption><\/figure>\n\n\n\n<\/a>Fig. 11 Two ways of changing property value from C++<\/em><\/figcaption><\/figure>\n\n\n\nIf changing property is not enough it is even possible to call method (using QMetaObject::invokeMethod()<\/em>) as all QML methods are exposed to the meta-object system.<\/p>\n\n\n\nSummary<\/strong><\/h2>\n\n\n\nThe article presented the ways of communication between the frontend and the backend, depending on particular needs. The different methods, starting from variable access, through function calls, acting on emitted signal and ending on QML object access from C++, are shown in the paper.<\/p>\n\n\n\n
Sources<\/h2>\n\n\n\n\n- Qt Documentations \u2013\u00ad Exposing Attributes of C++ Types to QML<\/a><\/li>\n\n\n\n
- Qt Documentations \u2013 QQmlContext Class<\/a><\/li>\n\n\n\n
- Qt Documentation \u2013 Connections QML Type<\/a><\/li>\n\n\n\n
- Qt Documentation \u2013 QQmlContext Class, Set ContextProperty<\/a><\/li>\n\n\n\n
- Qt Documentation \u2013 The Property System<\/a><\/li>\n\n\n\n
- Qt Documentation \u2013 Qt Bindable Properties<\/a><\/li>\n\n\n\n
- Qt Documentation \u2013 Interacting with QML Objects from C++<\/a><\/li>\n\n\n\n
- Qt Doc Snapshots \u2013 QObjectBindableProperty Class<\/a><\/li>\n\n\n\n
- ICS \u2013 Qt 6 Bindings<\/a><\/li>\n<\/ol>\n\n\n
<\/a><\/a><\/a><\/a>And to the point, one way to access the variable<\/em> property from QML is setContextProperty<\/strong> \u2013 exposing instance (one) to every component loaded by the engine. Object underneath testObj<\/em> could be now used in QML by the name myTest<\/em>. Usage is limited to Q_PROPERTY, signals and public slots (or Q_INVOKABLE functions). But it grants easy access.<\/p>\n\n\n\n Clicking on a button will result in incrementing the variable (calling setter) and through notification signal, the getter is called (READ) and all bindings on QML side are updated.<\/p>\n\n\n\n Maybe a few more words on BINDABLE as it enhances performance and introduces property binding also on C++ side. This help to simplify the program, by eliminating a lot of boilerplate code for tracking and reacting to dependency updates of different objects. Instead of using a setter, it is possible to simply assign a new value as shown below.<\/p>\n\n\n\n One of these allows calling the function directly from QML. One important disclaimer here. This will transfer ownership to QML side so e.g. if a pointer to an object is returned from the function beware of the garbage collector when C++ also uses this object. This could be tricky to investigate since a garbage collector could not be called right away. To manually change the object ownership QQmlEngine::setObjectOwnership<\/em> can be used.<\/p>\n\n\n\n QML component that can be used when:<\/p>\n\n\n\n This could be used to intercept any signal that is accessible from defined target. Syntax shown above was introduced in Qt 5.15.<\/p>\n\n\n\n It may be needed to change QML property from C++ e.g for testing purposes. To do this there are: QObject::setProperty()<\/em> or QQmlProperty::write()<\/em>. Firstly, it will be required to extract a particular QObject pointer like below:<\/p>\n\n\n\n If changing property is not enough it is even possible to call method (using QMetaObject::invokeMethod()<\/em>) as all QML methods are exposed to the meta-object system.<\/p>\n\n\n\n The article presented the ways of communication between the frontend and the backend, depending on particular needs. The different methods, starting from variable access, through function calls, acting on emitted signal and ending on QML object access from C++, are shown in the paper.<\/p>\n\n\n\n<\/a><\/a>Q_INVOKABLE & Public slots<\/strong><\/h2>\n\n\n\n
<\/a>QML Connections<\/strong><\/h2>\n\n\n\n
\n
<\/a>Accessing QML object from C++<\/h2>\n\n\n\n
<\/a><\/a>Summary<\/strong><\/h2>\n\n\n\n
Sources<\/h2>\n\n\n\n
\n