Carte des lieux (QML)

L'exemple affiche une carte de la position actuelle ou, si aucune position n'est disponible, utilise Oslo (Norvège). Une recherche est ensuite effectuée pour trouver les lieux correspondant au terme « food » et chaque résultat est affiché sur la carte.

Exécution de l'exemple

Vous pouvez exécuter l’exemple à partir de :

• Qt Creator

  Ouvrez le mode « Welcome » et sélectionnez l’exemple à l’adresse Examples. Pour plus d’informations, consultez Qt Creator: Tutoriel : Compiler et exécuter.

• Qt Extension for Visual Studio Code

  Exécutez la commande « Qt: Open Qt examples » à partir de Command Palette, puis sélectionnez l’exemple dans la liste. Pour plus d’informations, consultez Qt Extension for Visual Studio Code: Tutoriel : Compiler et exécuter.

Recherche locale

Pour écrire l'application QML qui affichera des lieux sur une carte, nous commençons par définir les déclarations d'import suivantes.

import QtQuick
import QtPositioning
import QtLocation

Instanciez une instance de ` Plugin `. Le ` Plugin ` est en fait le backend d’où proviennent les lieux. Selon le plugin choisi, certains paramètres obligatoires peuvent être nécessaires. Dans ce cas, le plugin OSM est sélectionné, qui ne comporte aucun paramètre obligatoire.

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

Ensuite, nous instancions un ` PlaceSearchModel `, que nous pouvons utiliser pour spécifier des paramètres de recherche et effectuer une opération de recherche de lieux. À titre d’illustration, la méthode ` update()` est appelée une fois la construction du modèle terminée. En général, la méthode ` update()` serait appelée en réponse à une action de l’utilisateur, telle qu’un clic sur un bouton.

PlaceSearchModel {
    id: searchModel

    plugin: myPlugin

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

La carte est affichée à l’aide du type ` MapView ` ; à l’intérieur, nous déclarons la méthode ` MapItemView ` et lui fournissons le modèle de recherche ainsi qu’un délégué. Un délégué inline a été utilisé et nous avons supposé que chaque résultat de recherche est de type ` type ` PlaceSerachesult. Par conséquent, nous partons du principe que nous avons toujours accès à l’objet `place` role; d’autres types de résultats de recherche peuvent ne pas disposer d’un objet `place` 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 }
            }
        }
    }
}

Enfin, une méthode ` PositionSource ` est utilisée pour réinitialiser la carte à la position actuelle et rechercher des lieux de « restauration » dans la nouvelle zone. Les informations de position sont mises à jour toutes les 2 minutes et si la nouvelle position se trouve à plus de 500 mètres de la dernière zone de recherche de restauration, la recherche de lieux est relancée.

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
        }
    }
}

Exemple de projet sur code.qt.io