Question

如何在QML应用中得到一个Item的所有属性，信号及方法

Answer 1

Item是QML语言中最基本的元素。有时为了方便，我们可以列出它里面的所有的属性，信号及方法。我们可以通过这个方法来修改我们的属性等。在QML语言中，所有的可视的控件都是继承于Item的。
下面我们来通过一个例子来展示如何这么做。我们可以设计一个简单的QML应用如下：
[html] view plain copy
在CODE上查看代码片派生到我的代码片
import QtQuick 2.0
import 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;
}
}
}
}
}
}
这里rect最初的坐标为(0，0)。在Component.onCompleted中，我们遍历所有的属性，信号及方法。我们把x的值修改为100。最后运行的结果如下：
在Qt Creator的“Application Output”窗口中，我们可以看到：
[html] view plain copy
在CODE上查看代码片派生到我的代码片
qml: objectName :
qml: parent : Page11_QMLTYPE_42(0x1a55340)
qml: data : [object Object]
qml: resources : [object Object]
qml: children : [object Object]
qml: x : 0
qml: y : 0
qml: z : 0
qml: width : 100
qml: height : 100
qml: opacity : 1
qml: enabled : true
qml: visible : true
qml: 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 : 0
qml: clip : false
qml: focus : false
qml: activeFocus : false
qml: activeFocusOnTab : false
qml: rotation : 0
qml: scale : 1
qml: transformOrigin : 4
qml: transformOriginPoint : QPointF(50, 50)
qml: transform : [object Object]
qml: smooth : true
qml: antialiasing : false
qml: implicitWidth : 0
qml: implicitHeight : 0
qml: layer : QQuickItemLayer(0x1b90010)
qml: color : #0000ff
qml: gradient : null
qml: border : QQuickPen(0x1b8bd50)
qml: radius : 0
qml: 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] }
这些都是我们可以用到的。通过这个方法，我们可以全面地了解rect的所有属性。特别适用于一些动态生产的控件。我们可以用来修改它们的一些属性等。