Концепции - Визуальный родитель в Qt Quick

Визуальный родитель

При создании визуальных сцен с Qt Quick важно понимать концепцию визуального родителя.

Концепция визуального родителя в Qt Quick отделена от, но связана с концепцией родительского объекта в иерархии родительских объектов QObject. У всех объектов QML есть родительский объект, который определяется иерархией объектов в объявленной иерархии. При работе с модулем QtQuick тип Item является базовым типом для всех визуальных элементов, предоставляемых этим модулем, и он предоставляет концепцию дополнительного визуального родителя, как определено свойством parent элемента. Каждый элемент имеет визуального родителя; если значение свойства parent элемента равно null, элемент не будет отображаться в сцене.

Любой объект, назначенный свойству data элемента, становится дочерним элементом элемента в иерархии QObject для целей управления памятью. Кроме того, если объект, добавленный в свойство data, имеет тип Item, он также назначается свойству Item::children и становится дочерним элементом элемента в визуальной иерархии сцены. (Большинство алгоритмов перемещения по иерархии Qt Quick, особенно алгоритмы рендеринга, учитывают только визуальную иерархию родителей).

Для удобства свойство 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 могут иметь встроенное поведение, влияющее на позиционирование дочерних элементов — например, объект Row автоматически перепозиционирует свои дочерние элементы в горизонтальную организацию — но это поведение навязывается конкретной реализацией типов. Кроме того, родительский элемент не будет автоматически обрезать своих дочерних элементов, чтобы визуально содержать их в пределах визуальных границ родителя, если свойство 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. Значения z ниже 0 будут накладываться под родителем, а если значения 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 зеленой прямоугольника ниже значения z синей прямоугольника, поэтому зеленая прямоугольник и все дочерние элементы будут расположены под синей прямоугольник.

Владение холстом

Определение того, что рендерится в сцене Qt Quick, — это дерево визуальных элементов, укоренённое в QQuickWindow::contentItem. Следовательно, для добавления элемента Item в определённую сцену Qt Quick для его отображения необходимо, чтобы он стал визуальным дочерним элементом элемента, уже находящегося в визуальной иерархии, например, QQuickWindow::contentItem.