可拖动项目隐藏在其他UI元素后面 - Qt Qml

Question

在我的应用程序窗口中，我有两个ItemPanel，它们在RawLayout内组织。

Item {
    RowLayout {
        anchors.fill: parent
        spacing: 1

        ItemPanel {
            Layout.preferredWidth: 250
            Layout.fillHeight: true

            panelHeader: "Components"

            DraggableItem {
                width: 100; height: 100;
            }
        }


        ItemPanel {
            Layout.preferredWidth: 250
            Layout.fillHeight: true

            panelHeader: "Actions"
        } 
    }
}

Components面板包含DraggableItem个。可放置区域是Actions面板。但是，如果我尝试将DraggableItem拖到Actions面板，则会在我拖动它时隐藏它。

DraggableItem

Item {
    id: root
    property string colorKey: "red"

    width: 64; height: 64

    MouseArea {
        id: mouseArea

        width: 64; height: 64
        anchors.centerIn: parent

        drag.target: tile

        onReleased: parent = tile.Drag.target !== null ? tile.Drag.target : root

        Rectangle {
            id: tile

            width: 64; height: 64
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter

            color: colorKey

            Drag.keys: [ colorKey ]
            Drag.active: mouseArea.drag.active
            Drag.hotSpot.x: 32
            Drag.hotSpot.y: 32
            states: State {
                when: mouseArea.drag.active
                ParentChange { target: tile; parent: root }
                AnchorChanges { target: tile; anchors.verticalCenter: undefined; anchors.horizontalCenter: undefined }
            }
        }
    }
}

我正在考虑添加一个透明图层并在拖动时更改它的父级，但我不知道如何在所有内容之上添加新图层。还有其他解决方法吗？

Answer 1

最简单的方法是将z - ItemPanel的值更改为panelHeader: "Components"，使其大于兄弟姐妹。然后自动地，所有孩子也将在他们上面分层。

重新定位也是一个很好的解决方案。如果在项目中使用ApplicationWindow作为根对象，则甚至不需要创建添加新图层 - 它已经存在。

您可以使用附加属性 ApplicationWindow将您的可拖动重新显示为ApplicationWindow.overlay。剩下的唯一挑战是，你需要指定正确的位置。您可以使用mapToItem()和mapFromItem()。

如果您没有ApplicationWindow作为root用户，则可以将regualr Item作为子项添加到您的根目录，并将z - 值设置为其兄弟姐妹之间的重要内容。然后你给它一个id。如果您没有隐藏此id（其他标识符的名称相同，则优先级更高的解决方案），您可以从任何地方添加Item。有关此here的更多信息，请参阅。