How to obtain all attributes, signals and methods of an Item in QML applications, and qmlitem

How to obtain all attributes, signals and methods of an Item in QML applications, and qmlitem

Item is the most basic element in QML. Sometimes for convenience, we can list all the attributes, signals, and methods in it. We can use this method to modify our attributes. In QML, all visual controls are inherited from items.

The following example shows how to do this. We can design a simple QML application as follows:

import QtQuick 2.0import Ubuntu.Components 1.1/*!    \brief MainView with a Label and Button elements.*/MainView {    // objectName for functional testing purposes (autopilot-qt5)    objectName: "mainView"    // Note! applicationName needs to match the "name" field of the click manifest    applicationName: "properties.liu-xiao-guo"    /*     This property enables the application to change orientation     when the device is rotated. The default is false.    */    //automaticOrientation: true    // Removes the old toolbar and enables new features of the new header.    useDeprecatedToolbar: false    width: units.gu(100)    height: units.gu(75)    Page {        title: i18n.tr("properties")        Rectangle {            id: rect            x: 0; y: 0            width: 100; height: 100            color: "blue"            Component.onCompleted: {                var keys = Object.keys(rect);                for(var i = 0; i < keys.length; i++) {                    var key = keys[i];                    // prints all properties, signals, functions from object                    console.log(key + ' : ' + rect[key]);                    if (key === "x") {                        rect[key] = 100;                    }                }            }        }    }}

The initial coordinates of the rect are (0, 0 ). In Component. onCompleted, we traverse all attributes, signals, and methods. Modify the value of x to 100. The final running result is as follows:

In the "Application Output" Window of Qt Creator, we can see:

qml: objectName : qml: parent : Page11_QMLTYPE_42(0x1a55340)qml: data : [object Object]qml: resources : [object Object]qml: children : [object Object]qml: x : 0qml: y : 0qml: z : 0qml: width : 100qml: height : 100qml: opacity : 1qml: enabled : trueqml: visible : trueqml: visibleChildren : [object Object]qml: states : [object Object]qml: transitions : [object Object]qml: state : qml: childrenRect : QRectF(0, 0, 0, 0)qml: anchors : QQuickAnchors(0x1a49840)qml: left : QVariant(QQuickAnchorLine)qml: right : QVariant(QQuickAnchorLine)qml: horizontalCenter : QVariant(QQuickAnchorLine)qml: top : QVariant(QQuickAnchorLine)qml: bottom : QVariant(QQuickAnchorLine)qml: verticalCenter : QVariant(QQuickAnchorLine)qml: baseline : QVariant(QQuickAnchorLine)qml: baselineOffset : 0qml: clip : falseqml: focus : falseqml: activeFocus : falseqml: activeFocusOnTab : falseqml: rotation : 0qml: scale : 1qml: transformOrigin : 4qml: transformOriginPoint : QPointF(50, 50)qml: transform : [object Object]qml: smooth : trueqml: antialiasing : falseqml: implicitWidth : 0qml: implicitHeight : 0qml: layer : QQuickItemLayer(0x1b90010)qml: color : #0000ffqml: gradient : nullqml: border : QQuickPen(0x1b8bd50)qml: radius : 0qml: objectNameChanged : function() { [code] }qml: childrenRectChanged : function() { [code] }qml: baselineOffsetChanged : function() { [code] }qml: stateChanged : function() { [code] }qml: focusChanged : function() { [code] }qml: activeFocusChanged : function() { [code] }qml: activeFocusOnTabChanged : function() { [code] }qml: parentChanged : function() { [code] }qml: transformOriginChanged : function() { [code] }qml: smoothChanged : function() { [code] }qml: antialiasingChanged : function() { [code] }qml: clipChanged : function() { [code] }qml: windowChanged : function() { [code] }qml: childrenChanged : function() { [code] }qml: opacityChanged : function() { [code] }qml: enabledChanged : function() { [code] }qml: visibleChanged : function() { [code] }qml: visibleChildrenChanged : function() { [code] }qml: rotationChanged : function() { [code] }qml: scaleChanged : function() { [code] }qml: xChanged : function() { [code] }qml: yChanged : function() { [code] }qml: widthChanged : function() { [code] }qml: heightChanged : function() { [code] }qml: zChanged : function() { [code] }qml: implicitWidthChanged : function() { [code] }qml: implicitHeightChanged : function() { [code] }qml: update : function() { [code] }qml: grabToImage : function() { [code] }qml: grabToImage : function() { [code] }qml: contains : function() { [code] }qml: mapFromItem : function() { [code] }qml: mapToItem : function() { [code] }qml: forceActiveFocus : function() { [code] }qml: forceActiveFocus : function() { [code] }qml: nextItemInFocusChain : function() { [code] }qml: nextItemInFocusChain : function() { [code] }qml: childAt : function() { [code] }qml: colorChanged : function() { [code] }qml: radiusChanged : function() { [code] }

These are all usable. Through this method, we can fully understand all the attributes of rect. It is especially suitable for some dynamic production controls. We can modify some of their attributes.

Project source code in: git clone https://gitcafe.com/ubuntu/properties.git