概念 - Qt Quick 中的可视父元素#

Qt Quick 中可视父元素概念描述

可视父元素#

使用 Qt Quick 创建视觉场景时，理解可视父元素的概念非常重要。

Qt Quick 中的可视父元素概念与 QObject 组织结构中的对象父元素概念是分开的，但它们是相关的。所有 QML 对象都有一个对象父元素，这由对象声明的对象层次结构确定。在处理 QtQuick 模块时，Item 类型是这个模块提供的所有视觉元素的基础类型，并提供了一个额外的可视父元素的概念，这由项目（item）的 parent 属性定义。每个元素都有一个可视父元素；如果一个元素的 parent 属性值为 null，则该元素将不会在场景中渲染。

分配给元素 data 属性的任何对象都成为它在 QObject 层次结构中的子元素，用于内存管理目的。此外，如果添加到数据属性的对象是 Item 类型，它也将被分配给 Item::children 属性，成为可视化场景层次结构中的子元素。（大多数 Qt Quick 层次结构遍历算法，特别是渲染算法，仅考虑可视父元素层次结构。）

为了方便，Item 的 data 属性是其默认属性。这意味着，在任何 Item 对象中声明的任何子元素（如果没有分配到特定的属性），都将自动分配给 data 属性，并成为如上所述的子元素。因此，下面的两个代码块将产生相同的结果，你几乎总是能看到下面的左侧形式，而不是下面的右侧显式分配 data 的形式。

import QtQuick 2.0

Item {
    width: 100; height: 100

    Rectangle { width: 50;
                height: 50;
                color: "red" }
}

import QtQuick 2.0

Item {
    width: 100; height: 100

    data: [
        Rectangle { width: 50;
                    height: 50;
                    color: "red" }
    ]
}

可以随时通过设置其 parent 属性来更改元素的视觉父元素。因此，元素的视觉父元素可能与它的对象父元素不同。

当元素成为其他元素的子元素时

子元素的 parent 指的是它的父元素

父元素的 children 和 childrenRect 属性会考虑到该子元素

将项目声明为另一个项目的子项并不自动意味着子项目将适当定位或调整大小以适应其父项。一些QML类型可能具有内置的行为，会影响子项目的定位——例如，一个行对象会自动重新定位其子项以形成一个水平排列——但这些都是由类型的特定实现强制执行的行为。此外，父项目也不会自动将其子项目裁剪以视觉上包含在父项目的视觉边界内，除非它的clip属性设置为true。

在特定情况下，项目的外观父项可能会被考虑，如以下各节所述。

项目坐标#

由于项目坐标相对于外观父项，它们可能会受到视觉层次结构变化的影响。有关更多详细信息，请参阅视觉坐标概念页面。

堆叠顺序#

Qt Quick项目使用递归绘图算法确定在发生碰撞时哪些项目绘制在上面。一般而言，项目会根据它们创建的顺序（或在QML文件中指定）绘制在其父项目之上。因此，在以下示例中，蓝色矩形将绘制在绿色矩形之上。

Rectangle {
    color: "#272822"
    width: 320
    height: 480

    Rectangle {
        y: 64
        width: 256
        height: 256
        color: "green"
    }

    Rectangle {
        x: 64
        y: 172
        width: 256
        height: 256
        color: "blue"
    }
}

由于算法遍历视觉项目层次结构，绿色矩形的任何子项也将绘制在蓝色矩形之下，以及蓝色矩形的任何子项之下。

可以通过Item::z属性影响堆叠顺序。小于0的z值将堆叠在父项下方，如果分配了z值，则兄弟项将按z顺序堆叠（使用创建顺序来解决冲突）。z值仅影响与兄弟项和父项的堆叠。如果您有一个被其父项之上的子树遮挡的项目，该项目的z值不会增加其堆叠顺序以使其堆叠在该子树之上。要使该项目堆叠在另一个子树之上，您必须更改层次结构中的z值更高处的值，或者重新排列视觉项目层次结构。

Rectangle {
    color: "#272822"
    width: 320
    height: 480

    Rectangle {
        y: 64
        z: 1
        width: 256
        height: 256
        color: "green"

        Rectangle {
            x: 192
            y: 64
            z: 2000
            width: 128
            height: 128
            color: "red"
        }
    }

    Rectangle {
        x: 64
        y: 192
        z: 2
        width: 256
        height: 256
        color: "blue"
    }
}

在上面的示例中，红色矩形具有高z值，但仍然堆叠在蓝色矩形之下。这是因为它是绿色矩形的子项，而绿色矩形是蓝色矩形的一个兄弟。绿色矩形的z值低于蓝色矩形，因此绿色矩形及其所有子项将堆叠在蓝色矩形之下。

画布归属#

在Qt Quick场景中渲染的内容定义是由contentItem（ PySide6.QtQuick.QQuickWindow.contentItem ）根部的视觉项目树定义的。因此，要将项目添加到特定Qt Quick场景进行渲染，该项目需要成为视觉项目层次结构中已存在的项目的子项，例如contentItem。