QML 中的图层顺序

QML 中的图层顺序

在 QML 中，我们可以使用 z 属性控制元素的图层顺序。z 值越大，就越靠近顶部，越小则越靠近底部。我们可以通过修改 z 值来调整元素的堆叠次序。

下面我们来演示一下如何使用 z 属性来控制图层顺序：

import QtQuick 2.12
import QtQuick.Window 2.12

Window {
    visible: true
    width: 400
    height: 400

    Rectangle {
        width: 300
        height: 300
        color: "red"
        z: 1    // 设置 z 值为 1，位于最上层
    }

    Rectangle {
        x: 50
        y: 50
        width: 200
        height: 200
        color: "green"
        z: -1   // 设置 z 值为 -1，位于最下层
    }

    Rectangle {
        x: 100
        y: 100
        width: 150
        height: 150
        color: "blue"
        z: 0    // 默认为 0，位于中间层
    }
}

在上面的例子中，