[Qt] QML内部组件实例化顺序
  tCdZJQtjUpyw 2023年11月02日 36 0


代码:

import QtQuick 2.12
import QtQuick.Window 2.12

Window {
visible: true
width: 640
height: 480
title: qsTr("Hello World")

Component.onCompleted: {
console.log("win")
}

Rectangle{
width: 30
height: 30
color: "green"
Component.onCompleted: {
console.log("rec 1")
}
}

Rectangle{
width: 20
height: 20
color: "red"
Component.onCompleted: {
console.log("rec 2")
}
}
}

输出:

qml: win
qml: rec 2
qml: rec 1

效果:

[Qt] QML内部组件实例化顺序_子节点

结论:

从外而内,从下而上

qml组件是树状结构,因此对于上述代码中,组件的结构为:

[Qt] QML内部组件实例化顺序_子节点_02

注意,子节点从左往右是按照代码的从上向下排列的,即处于代码下面的组件先被创建出来。另外,组件展示层级是由上而下的,即写在代码后面的组件被展示在顶部图层,即先创建的占据顶部图层。

而整个创建流程可以看做是  " 树的前序遍历 " 。

【版权声明】本文内容来自摩杜云社区用户原创、第三方投稿、转载,内容版权归原作者所有。本网站的目的在于传递更多信息,不拥有版权,亦不承担相应法律责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@moduyun.com

  1. 分享:
最后一次编辑于 2023年11月08日 0

暂无评论

推荐阅读
  gcyDPCYPU8Nr   2023年11月02日   53   0   0 qt控件2dJavaScript
tCdZJQtjUpyw
最新推荐 更多