How do I implement Drag&Drop between TreeView controls?

JuanBucz

Hi:

I've got 2 TreeView controls (QtQuick 1) and I'm trying to implement the following:

Drag and Drop within the same tree
Drag and Drop between the 2 different trees

I haven't found any examples specific to TreeView Drag/Drop, but I did find an example using
ListView. I can't quite the desired behaviours.

For purposes of this prototyping, I'm using a very simple data model.
I've started with just my 1st TreeView definition.
This is what I have so far for my TreeView control:

TreeView {
id: buildPoliciesTreeViewId
anchors.fill: parent
model: myModel

    rowDelegate: Rectangle {
        width: childrenRect.width
        height: 50
        SystemPalette {
            id: myPalette;
            colorGroup: SystemPalette.Active
        }
        color: {
            var baseColor = styleData.alternate?myPalette.alternateBase:myPalette.base
            return styleData.selected?myPalette.highlight:baseColor
        }
    }

    itemDelegate: Item {

    id: itemId
    
    //Rectangle {
    //  id: dragRect
    //  width: buildPoliciesTreeViewId.width
    //  height: 50
    //  anchors.horizontalCenter: parent.horizontalCenter
    //  anchors.verticalCenter: parent.verticalCenter
    //  color: "white"
    //  border.color: Qt.darker(color)

    Text {
        id: itemTextId
        anchors.verticalCenter: parent.verticalCenter
        color: "black"
        elide: styleData.elideMode
        text: styleData.value
        font.pixelSize: 16
        font.bold : true
    }

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        drag.target: itemId

        drag.onActiveChanged: {
            if (mouseArea.drag.active) {
                buildPoliciesTreeViewId.dragItemIndex = index;
            }
            itemId.Drag.drop();
        }
    }

    states: [
        State {
            when: itemTextId.Drag.active
            ParentChange {
                target: itemId
                parent: root
            }

            AnchorChanges {
                target: itemId
                anchors.horizontalCenter: undefined
                anchors.verticalCenter: undefined
            }
        }
    ]

    Drag.active: mouseArea.drag.active
    Drag.hotSpot.x: itemId.width / 2
    Drag.hotSpot.y: itemId.height / 2
    //}
    }

    C1.TableViewColumn {
    role: "display"
    title: "Elements"
    width: 100
    }
    }

I've tried to have various components be my drag "source," but I don't get expected behaviour.
Can someone make some suggests as to what I can use as a starting point?
TreeViews and the ability to manipulate them will be crucial to our UI.

Thanks,
JohnB