Назначение свойства z с реальным значением в QML ListView

Question

В приведенном ниже примере кода я установил свойство z ​​для выделенного элемента, и в зависимости от значения оно отображается для пользователя. Свойство z ​​также может быть сконфигурировано с реальным значением.

Это означает, что значение z может иметь дробные значения, такие как 0,1 или 1,2, например.

Может кто-нибудь объяснить, для чего следует использовать значение z дробное или реальное значение в QML ListView?

import QtQuick 2.8
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Sample List View")

    property var delHeight: 50

    ListView {
        id: listView
        anchors.fill: parent
        cacheBuffer: 100
        footer: Rectangle {
            width: (listView.orientation === ListView.Horizontal) ? 200 : parent.width
            height: delHeight
            color: "lightyellow"
            Text {
                anchors.centerIn: parent
                font.pointSize: 20
                text: "Footer"
            }
        }
        header: Rectangle {
            width: (listView.orientation === ListView.Horizontal) ? 200 : parent.width
            height: delHeight
            color: "lightblue"
            Text {
                anchors.centerIn: parent
                font.pointSize: 20
                text: "Header"
            }
            z: 2
        }
        headerPositioning: ListView.OverlayHeader
        highlight: Rectangle {
            color: "white"
            opacity: 0.5
            border.color: "blue"
            border.width: 5
            z: 1.2
            Component.onCompleted: {
                console.log ("Created hightlight component with z factor: " + z)
            }
        }
//        highlightMoveDuration: 10000
//        highlightRangeMode: ListView.ApplyRange
        keyNavigationEnabled: true
        model: 20
        delegate: componentId
        layoutDirection: Qt.RightToLeft
        orientation: ListView.Vertical
        snapMode: ListView.SnapOneItem

        Component.onCompleted: {
            currentIndex = 5
        }
        focus: true
        onFocusChanged: {
            console.log ("Focus: " + focus)
        }
    }

    Component {
        id: componentId
        Rectangle {
            width: (listView.orientation === ListView.Horizontal) ? 200 : parent.width
            height: delHeight
            color: "lightgreen"
            border.color: "black"
            border.width: (listView.currentIndex === index) ? 5 : 1
            Text {
                anchors.centerIn: parent
                font.pointSize: 20
                text: "Element: " + index
            }

            MouseArea {
                anchors.fill: parent
                onClicked: {
                    listView.currentIndex = index
                }
            }

            Component.onCompleted: {
                console.log ("Created component: " + index)
            }
            Component.onDestruction: {
                console.log ("Destroyed component: " + index)
            }
        }
    }
}

Answer 1

Свойство z для item задает порядок наложения этого элемента.

Значение, если вы строите два прямоугольника один за другим, а недавно построенный прямоугольник будет сложен поверх предыдущего построен один.

Код Ex:

Item {
    Rectangle {
        color: "red"
        width: 100; height: 100
    }
    Rectangle {
        color: "blue"
        x: 50; y: 50; width: 100; height: 100
    }
}

Здесь red прямоугольник, сложенный ниже blue прямоугольник.

Теперь QML дает вам возможность изменить укладку упорядочить через z свойство элемента.

в приведенном выше примере, если я присваиваю z свойству прямоугольника red значение больше 0, я бы увидел его поверх blue прямоугольник. Таким образом, свойство z изменило порядок наложения для элемента-брата.

Назначение свойства z остается тем же в случае выделения ListView. Если вы хотите увидеть выделенный элемент, вы должны дать ему значение, которое больше, чем элементы, которые будут построены. Вы можете проверить это, просто установив для свойства z для прямоугольника componentId s более высокое значение, чем для значения z.

ПРИМЕЧАНИЕ: оно работает только для элементов одного уровня.

Более подробное объяснение можно найти здесь
Подробнее о реальном типе здесь