1

我使用 MapQuickItem 作为地图上的委托组件。我有三个组件。单击组件时,我想更改委托组件的颜色。其余颜色相同。如何更改仅选定组件颜色的颜色

 Plugin
{
    id: hereMaps
    name: "here"
    PluginParameter { name: "here.app_id"; value: "oBB4FivcP23m2UZQCj8K" }
    PluginParameter { name: "here.token"; value: "P-D8XRRGeVt0YphUuOImeA" }
}

Map {
    id: map
    anchors.fill: parent
    activeMapType: supportedMapTypes[1];
    zoomLevel: 18
    plugin: hereMaps
    center: QtPositioning.coordinate(19.997454, 73.789803)

    MapItemView {
        id: markerItem
        model: [
            { id: "marker1", color: "red" },
            { id: "marker2", color: "red" },
            { id: "marker3", color: "red" }
        ]
        delegate: mapMarkerComponent
    }

    Component {
        id : mapMarkerComponent

        MapQuickItem {
            id: mapMarker
            coordinate: QtPositioning.coordinate(19.997454, 73.789803)

            sourceItem: Rectangle {

                id: handle
                color: modelData.color
                width: 40
                height: 40

                MouseArea {
                    drag.target: parent
                    anchors.fill: parent
                    onClicked: {

                        handle.color = "green"

                    }
                }
            }

            onCoordinateChanged: {
                console.log(modelData.id + ":" + coordinate);
            }
        }
    }
   }
4

1 回答 1

1

最明显的方法是遍历所有标记并重置它们的颜色,然后更改单击标记的颜色。为此,请更改onClicked为:

// switch to red if its green
if (handle.color == "#008000") {
    handle.color = "#ff0000";
    return;
}
// switch all markers to red
for(var marker in markerItem.children) {
    markerItem.children[marker].sourceItem.color = "#ff0000";
}
// switch clicked marker to green
handle.color = "#008000";

但是,如果您想“选择”标记,这不是最好的解决方案(操纵颜色)。阅读 QML 中的状态(链接),并尝试为您的标记实现某种“正常”和“选定”状态。

于 2020-04-23T15:05:49.297 回答