1.访问通过QML文件定义的组件
通过对qml文档实例化建立对象。
访问组件实例中的属性:组件实例的id.属性名
调用组件实例中的函数:组件实例的id.函数名()
2.访问通过Loader定义的组件
通过对Loader动态加载组件来创建对象。
访问Loader加载组件的属性:Loader的id.item.属性名
调用Loader加载组件的函数:Loader的id.item.函数名()
注意:
使用Loader的item属性可以访问到所加载的组件的顶层的对象。因此只能访问到顶层对象中定义的属性和方法。不能访问组件内部更深的结构层次中定义的属性。若想访问更深层次中的属性,需要将其定义为顶层的属性。
3.访问视图委托delegate中的组件
在视图的委托delegate中,并不像1,2中创建了组件实例对象,因此也无法在组件外部访问。以下代码中试图访问ListView视图的委托中的属性,是无法成功的。
import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.4
Window {
visible: true
width: 640
height: 480
title: qsTr("Hello World")
ListView {
id: myView
anchors.left: parent.left
anchors.leftMargin: 20
width: 100
height: 200
model: ListModel {
id: myModel
ListElement {type: "Dog"; age: 8}
ListElement {type: "Cat"; age: 5}
}
delegate: Component {
Text {
id: myText
text: type + ": " + age;
font.bold: true
color: "black"
}
}
}
Button {
id: myButton
anchors.bottom: parent.bottom
text: "change"
onPressed: {
//下面代码访问视图委托的组件中的属性,无法成功。
myText.color = "red";
}
onReleased: {
myText.color = "black";
}
}
}
可改为如下方式。直接看代码。
Window {
visible: true
width: 640
height: 480
title: qsTr("Hello World")
ListView {
id: myView
anchors.left: parent.left
anchors.leftMargin: 20
width: 100
height: 200
model: ListModel {
id: myModel
ListElement {type: "Dog"; age: 8}
ListElement {type: "Cat"; age: 5}
}
delegate: Component {
Text {
id: myText
text: type + ": " + age;
font.bold: true
//方法1:将组件内部的属性绑定函数
// color: {
// if (myButton.pressed) {
// return "red"
// } else {
// return "black"
// }
// }
//方法2:使用binding给属性绑定函数
// Component.onCompleted: {
// color = Qt.binding(function() {
// return myButton.pressed ? "red" : "black"
// })
// }
//方法3:使用Connections信号处理器
Connections {
target: myButton
onPressed: {
color = "red"
}
onReleased: {
color = "black"
}
}
}
}
}
Button {
id: myButton
anchors.bottom: parent.bottom
text: "change"
}
}