Ortskarte (QML)

Das Beispiel zeigt eine Karte des aktuellen Standorts an oder, falls keine Position verfügbar ist, wird Oslo/Norwegen verwendet. Anschließend wird eine Suche nach Orten durchgeführt, die dem Begriff „Essen“ entsprechen, und jedes Ergebnis wird auf der Karte angezeigt.

Ausführen des Beispiels

Sie können das Beispiel wie folgt ausführen:

• Qt Creator

  Öffnen Sie den Modus „ Welcome “ und wählen Sie das Beispiel unter „ Examples “ aus. Weitere Informationen finden Sie unter Qt Creator: Tutorial: Erstellen und Ausführen.

• Qt Extension for Visual Studio Code

  Führen Sie den Befehl „ Qt: Open Qt examples “ aus dem Verzeichnis „ Command Palette “ aus und wählen Sie das Beispiel aus der Liste aus. Weitere Informationen finden Sie unter Qt Extension for Visual Studio Code: Tutorial: Erstellen und Ausführen.

Lokale Suche

Um die QML-Anwendung zu erstellen, die Orte auf einer Karte anzeigt, beginnen wir mit den folgenden Import-Deklarationen.

import QtQuick
import QtPositioning
import QtLocation

Erstellen Sie eine Instanz von ` Plugin `. Der ` Plugin ` ist im Grunde das Backend, aus dem die Orte bezogen werden. Je nach ausgewähltem Plugin sind möglicherweise einige obligatorische Parameter erforderlich. In diesem Fall wird das OSM-Plugin ausgewählt, das keine obligatorischen Parameter hat.

Plugin {
    id: myPlugin
    name: "osm"
    //specify plugin parameters if necessary
    //PluginParameter {...}
    //PluginParameter {...}
    //...
}

Als Nächstes instanziieren wir ein ` PlaceSearchModel `, mit dem wir Suchparameter festlegen und eine Ortssuche durchführen können. Zur Veranschaulichung wird ` update()` aufgerufen, sobald die Erstellung des Modells abgeschlossen ist. In der Regel würde ` update()` als Reaktion auf eine Benutzeraktion, wie beispielsweise einen Klick auf eine Schaltfläche, aufgerufen werden.

PlaceSearchModel {
    id: searchModel

    plugin: myPlugin

    searchTerm: "food"
    searchArea:  QtPositioning.circle(positionSource.lastSearchPosition, 1000 /* 1 km radius */)
    Component.onCompleted: update()
}

Die Karte wird mithilfe des Typs ` MapView ` angezeigt; darin deklarieren wir ` MapItemView ` und übergeben das Suchmodell sowie einen Delegaten. Es wurde ein Inline-Delegat verwendet, und wir sind davon ausgegangen, dass jedes Suchergebnis vom Typ ` type ` PlaceSerachesult ist. Folglich wird angenommen, dass wir immer Zugriff auf den Ort role haben; andere Suchergebnistypen verfügen möglicherweise nicht über einen Ort role.

MapView {
    id: view
    anchors.fill: parent
    map.plugin: myPlugin;
    map.center: positionSource.lastSearchPosition
    map.zoomLevel: 13

    MapItemView {
        model: searchModel
        parent: view.map
        delegate: MapQuickItem {
            coordinate: place.location.coordinate

            anchorPoint.x: image.width * 0.5
            anchorPoint.y: image.height

            sourceItem: Column {
                Image { id: image; source: "marker.png" }
                Text { text: title; font.bold: true }
            }
        }
    }
}

Schließlich wird ein PositionSource verwendet, um die Karte auf den aktuellen Standort zurückzusetzen und „Essen“-Orte in der neuen Umgebung zu finden. Die Positionsdaten werden alle 2 Minuten aktualisiert, und wenn die neue Position mehr als 500 Meter vom letzten Suchgebiet für Essen entfernt ist, wird die Ortssuche erneut ausgelöst.

PositionSource {
    id: positionSource
    property variant lastSearchPosition: QtPositioning.coordinate(59.93, 10.76) //Initialized/Fallback to Oslo
    active: true
    updateInterval: 120000 // 2 mins
    onPositionChanged:  {
        var distance = lastSearchPosition.distanceTo(position.coordinate)
        if (distance > 500) {
            // 500m from last performed food search
            lastSearchPosition = positionSource.position.coordinate
        }
    }
}

Beispielprojekt @ code.qt.io