QtLocation:如何在Map上进行拖放?

时间:2017-06-13 12:23:32

标签: qt drag-and-drop qml qtlocation

我有一个QML nutrition小部件。我想在它上面放一些物体来获得掉落点的纬度和经度。我该怎么办?

1 个答案:

答案 0 :(得分:1)

您可以像所有其他拖放应用程序一样完成此操作。 Qt文档中有大量的例子和互联网上的例子。 其中之一:

import QtQuick 2.9
import QtQuick.Window 2.0
import QtLocation 5.3

Window {
    id: window
    width: 600
    height: 400
    visible: true

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        drag.target: item
        propagateComposedEvents: true
        onReleased: item.Drag.drop()
    }

    Plugin {
        id: mapPlugin
        preferred: ["osm", "esri"]
    }

    Map {
        id: map
        anchors.fill: parent
        anchors.topMargin: 40
        anchors.bottomMargin: 30
        plugin: mapPlugin
        center {
            latitude: 40.785091
            longitude: -73.968285
        }
        zoomLevel: 14
        DropArea {
            anchors.fill: parent
            onDropped: {
                var coord = map.toCoordinate(Qt.point(drop.x, drop.y));
                output.text = "latitude:" + coord.latitude + ", longitude:" + coord.longitude;
                anim.running = true;
            }
        }
    }

    Rectangle {
        id: item
        x: parent.width/2 - 20
        y: 0
        width: 40
        height: 40
        radius: 20
        color: "orange"
        opacity: 1
        Drag.active: mouseArea.drag.active
        Drag.hotSpot.x: 20
        Drag.hotSpot.y: 20

        Text {
            anchors.centerIn: parent
            text: "Drop me"
            font.pixelSize: 8
        }

        SequentialAnimation {
            id: anim
            running: false
            NumberAnimation { target: item; property: "opacity"; to: 0; duration: 500 }
            PropertyAction { target: item; property: "x"; value: window.width/2 - 20 }
            PropertyAction { target: item; property: "y"; value: 0 }
            NumberAnimation { target: item; property: "opacity"; to: 1; duration: 500 }
        }
    }

    Text {
        id: output
        anchors.bottom: parent.bottom
        height: 30
        width: window.width
        text:  ""
        verticalAlignment: Text.AlignVCenter
        horizontalAlignment: Text.AlignHCenter
    }
}