Mit dem Google Maps Platform Navigation SDK in Swift eine einfache iOS-Navigations-App erstellen

1. Hinweis

In diesem Codelab erfahren Sie, wie Sie eine einfache iOS-App erstellen, die das Navigation SDK der Google Maps Platform verwendet, um zu einem vorkonfigurierten Ziel zu navigieren.

So sieht Ihre App aus, wenn Sie fertig sind.

Voraussetzungen

• Grundkenntnisse der iOS-App-Entwicklung in Swift.
• Grundlegende Kenntnisse der Google Maps SDK-Konzepte, z. B. Erstellen einer Karte, die auf einen bestimmten Ort zentriert ist.

Lerninhalte

• So erstellen Sie eine einfache iOS-Swift-App, die das Navigation SDK verwendet, um zu einem Ziel zu navigieren.
• So binden Sie das Navigation SDK aus dem Remote-Cocoapods-Repository ein.
• Standortberechtigungen und Nutzervereinbarung mit den Endnutzerbedingungen des Navigation SDK verwalten
• So initialisieren Sie das SDK.
• So legen Sie ein Ziel fest und starten die Navigation.

Voraussetzungen

• Die aktuelle stabile Version von Xcode.
• Ein Google-Konto und ein Projekt mit aktivierter Abrechnung.
• Ein iOS-Gerät oder ein emuliertes Gerät, das im Xcode-Simulator ausgeführt wird. Unabhängig davon, welche Option Sie auswählen, muss sie die Mindestanforderungen für das Navigation SDK erfüllen.

2. Einrichten

Wenn Sie noch kein Google Cloud-Konto und kein Projekt mit aktivierter Abrechnung haben, richten Sie Ihr Google Cloud-Projekt gemäß der Anleitung für die ersten Schritte mit der Google Maps Platform ein.

Google Cloud-Projekt in der Console auswählen

Klicken Sie in der Cloud Console auf das Drop-down-Menü für das Projekt und wählen Sie das Projekt aus, das Sie für dieses Codelab verwenden möchten.

Hinweis: Die Nutzung des Navigation SDK ist nicht durch das monatliche Guthaben von 200 $für die Google Maps Platform abgedeckt. Für die ersten 1.000 Ziele pro Monat fallen jedoch keine Kosten an.

Navigation SDK in Ihrem Projekt aktivieren

Aktivieren Sie die für dieses Codelab erforderlichen APIs und SDKs der Google Maps Platform im Google Cloud Marketplace.

Rufen Sie in der Google Cloud Console APIs & Dienste > Bibliothek auf und suchen Sie nach „Navigation SDK“.

Sie sollten ein Suchergebnis sehen.

Klicken Sie auf Navigation SDK, um die Seite „Produktdetails“ zu öffnen. Klicken Sie auf Aktivieren, um das SDK für Ihr Projekt zu aktivieren.

Wiederholen Sie diesen Vorgang für das Google Maps SDK for iOS.

API-Schlüssel erstellen

Generieren Sie einen API-Schlüssel in der Cloud Console auf der Seite Anmeldedaten. Für alle Anfragen an die Google Maps Platform ist ein API-Schlüssel erforderlich. Auf der Seite „Anmeldedaten“ in der Console. Klicken Sie oben auf der Seite auf „+ Anmeldedaten erstellen“ und wählen Sie „API-Schlüssel“ aus den Optionen aus.

Für die Verwendung in der Produktion empfiehlt es sich, eine Anwendungseinschränkung für Ihren API-Schlüssel festzulegen. Das ist für dieses Codelab jedoch optional.

3. Beispielprojektdateien abrufen

In diesem Abschnitt wird beschrieben, wie Sie ein einfaches leeres Xcode-App-Projekt einrichten, indem Sie Dateien aus dem GitHub-Repository für dieses Codelab klonen. Das GitHub-Repository enthält Vorher- und Nachher-Versionen des Codelab-Codes. Das Codelab beginnt mit einer leeren Projektvorlage und wird bis zum fertigen Zustand aufgebaut. Sie können das fertige Projekt im Repository als Referenz verwenden, wenn Sie nicht weiterkommen.

Repository klonen oder Code herunterladen

Wechseln Sie in das Verzeichnis, in dem Sie das Codelab speichern möchten.

Klonen Sie dann das Repository oder laden Sie den Code herunter:

git clone https://github.com/googlemaps-samples/codelab-navigation-101-ios-swift

Wenn Sie Git nicht installiert haben, klicken Sie auf diese Schaltfläche, um den Code zu erhalten:

Code abrufen

Damit Sie so schnell wie möglich loslegen können, enthält das Repository im Ordner Starter Startcode, der Ihnen hilft, diesem Codelab zu folgen. Es gibt auch ein fertiges Solution-Projekt, falls Sie voranspringen oder Ihren Fortschritt jederzeit überprüfen möchten. Wenn Sie das Lösungsprojekt verwenden möchten, müssen Sie der Anleitung „Mit Cocoapods installieren“ unten folgen und dann den Befehl „pod update“ im Ordner solution/Navigation SDK Codelab ausführen.

Nachdem Sie das Repository lokal geklont haben, öffnen Sie den Ordner Starter in Xcode als vorhandenes Projekt. Prüfen Sie, ob das Projekt erstellt und ausgeführt wird.

Hinweis: Das Projekt für dieses Codelab ist in Swift mit UIKit geschrieben.

Gerät verbinden oder Xcode-Simulator einrichten

4. Das Navigation SDK in Ihre App einbinden

Es gibt drei Möglichkeiten, das Navigation SDK in ein Xcode-Projekt einzubinden. In diesem Codelab wird CocoaPods verwendet. Weitere Informationen zur Integration mit Swift Package Manager oder zur manuellen Installation durch Herunterladen des SDK finden Sie in der Navigation SDK-Dokumentation unter Xcode-Projekt erstellen und Navigation SDK installieren.

Mit CocoaPods installieren

Falls du das Tool „CocoaPods“ noch nicht nutzt, installiere es unter macOS, indem du den folgenden Befehl über das Terminal ausführst. Weitere Informationen finden Sie im Startleitfaden zu CocoaPods (in englischer Sprache).

sudo gem install cocoapods

Erstellen Sie in Ihrem Projektordner im Ordner „starter/Navigation SDK Codelab“ eine neue Datei mit dem Namen „Podfile“ (in Xcode: „File“ > „New“ > „File“ > „Other“ > „Empty“, speichern Sie die Datei als „Podfile“).

Fügen Sie Ihrem Podfile den folgenden Inhalt hinzu:

source 'https://github.com/CocoaPods/Specs.git'

platform :ios, '15.0'

target 'Navigation SDK Codelab' do
  pod 'GoogleNavigation', '9.1.1'
end

Podfile sparen.

Öffnen Sie ein Terminal und wechseln Sie in das Verzeichnis, in dem Sie Ihr Podfile gespeichert haben. Das sollte der Ordner „starter/Navigation SDK Codelab“ im Codelab-Repository sein.

cd "<path-to-starter-project-folder>/Navigation SDK Codelab"

Führen Sie den Befehl pod install aus: Dadurch werden die in der Podfile angegebenen APIs und ggf. zugehörige Abhängigkeiten installiert.

pod install

Schließen Sie Xcode und öffnen Sie dann die .xcworkspace-Datei Ihres Projekts, um Xcode zu starten. Ab jetzt müssen Sie das Projekt über die Datei „.xcworkspace“ aufrufen.

Prüfen Sie, ob der Projektstruktur ein Pods-Verzeichnis hinzugefügt wurde, das die Pods „GoogleMaps“ und „GoogleNavigation“ enthält.

API-Schlüssel hinzufügen

Füge deinen API-Schlüssel folgendermaßen in AppDelegate.swift ein:

1. Fügen Sie die folgenden Importanweisungen hinzu:

import GoogleMaps
import GoogleNavigation

2. Fügen Sie der Methode application(_:didFinishLaunchingWithOptions:) Folgendes hinzu:

GMSServices.provideAPIKey("YOUR_API_KEY")

Ersetzen Sie „YOUR_API_KEY“ durch den API-Schlüssel, den Sie im vorherigen Schritt erstellt haben.

Erstellen Sie Ihr Projekt und beheben Sie alle Fehler.

5. App-Berechtigungen konfigurieren

Das Navigation SDK ist auf GPS-Signale angewiesen, um den Standort auf der Straße zu bestimmen und detaillierte Navigationsanweisungen zu geben. Ihre App muss den Nutzer daher um die Erlaubnis bitten, auf genaue Standortdaten zuzugreifen.

Dazu müssen Sie in Xcode einige Eigenschaften zur Info.plist Ihrer App hinzufügen, Ihrer App etwas Code hinzufügen, um die Berechtigung vom Nutzer zur Laufzeit anzufordern, und alle Fehler behandeln, z. B. wenn die Berechtigung nicht erteilt wird oder der Standort nicht verfügbar ist.

Öffnen Sie „Info.plist“ in Xcode. Die Anzeige sollte ungefähr so aussehen.

Berechtigung zur Ermittlung des genauen Standorts anfordern

Sie können neue Werte hinzufügen, indem Sie den Mauszeiger auf die Zeile „Information Property List“ bewegen, bis ein „+“-Symbol angezeigt wird. Klicken Sie auf das „+“, um ein Dialogfeld mit vorgeschlagenen Property-Namen aufzurufen. Sie können aber auch Properties manuell hinzufügen.

Fügen Sie der Datei „Info.plist“ die folgenden Attribute und Werte hinzu:

Attribut	Wert
Datenschutz – Beschreibung der Verwendung von „Immer“ und „Bei Verwendung“ für den Standortzugriff	„Diese App benötigt den Standort Ihres Geräts, um eine detaillierte Routenführung zu ermöglichen.“
Datenschutz – Beschreibung der Verwendung des Standorts bei Nutzung	„Diese App benötigt den Standort Ihres Geräts, um eine detaillierte Routenführung zu ermöglichen.“
allowsBackgroundLocationUpdates	JA

Berechtigung zur Standortermittlung im Hintergrund anfordern

Fügen Sie der Datei „Info.plist“ die folgenden Attribute und Werte hinzu:

UIBackgroundModes > „Zeile hinzufügen“ > Item 0: App registers for location updates (diesen Wert aus der Drop-down-Liste mit Vorschlägen auswählen)

Die Datei „Info.plist“ sollte nach Abschluss in etwa so aussehen.

Standortzugriff zur Laufzeit anfordern

Fügen Sie ViewController.swift die folgenden Importanweisungen hinzu:

import GoogleNavigation

Fügen Sie Ihrer ViewController-Klasse die folgende Deklaration hinzu:

var locationManager: CLLocationManager!

Fügen Sie eine Methodenüberschreibung für loadView() hinzu und rufen Sie locationManager.requestAlwaysAuthorization() auf:

override func loadView() {
        locationManager = CLLocationManager()
        locationManager.requestAlwaysAuthorization()

Ihre App fordert nun den Standort des Nutzers an und stellt ihn Ihrer App zur Verfügung, wenn der Nutzer die Berechtigung erteilt .

Berechtigung zum Anzeigen von Benachrichtigungen anfordern

Fügen Sie den folgenden Code zu loadView() hinzu, um den Nutzer um die Berechtigung zum Anzeigen von Benachrichtigungen zu bitten. Diese ist erforderlich, um Anweisungen für Navigationsmanöver anzuzeigen.

UNUserNotificationCenter.current().requestAuthorization(options: [.alert]) {
        granted, error in
        // Handle denied authorization to display notifications.
          if !granted || error != nil {
              print("User rejected request to display notifications.")
          }
        }

Erstellen und führen Sie die App aus und prüfen Sie, ob Sie aufgefordert werden, den Standort freizugeben und Benachrichtigungen zu aktivieren.

6. Navigationsbenutzeroberfläche hinzufügen

In diesem Schritt fügen Sie eine Karte hinzu und konfigurieren sie so, dass ein Standort angezeigt wird. Anschließend zeigen Sie dem Nutzer ein Dialogfeld mit den Nutzungsbedingungen des Navigation SDK.

Kartenansicht in Ihre App einfügen

Fügen Sie diese Zeile hinzu, um eine GMSMapView-Variable in Ihrem ViewController zu deklarieren.

var mapView: GMSMapView!

Fügen Sie den folgenden Code in loadView() in Ihrer Viewcontroller.swift ein, um die Karte zu initialisieren.

let camera = GMSCameraPosition.camera(withLatitude: 51.483174, longitude: -0.177369, zoom: 14)
let options = GMSMapViewOptions()
options.camera = camera
options.frame = .zero
        
mapView = GMSMapView(options: options)
view = mapView

Erstelle deine App und führe sie aus. Es sollte eine Karte mit dem Südwesten Londons im Mittelpunkt angezeigt werden.

Tipp: Wenn Sie einen anderen Breiten- und Längengrad als Startpunkt verwenden möchten, klicken Sie in einem Browser mit der rechten Maustaste auf einen beliebigen Ort in Google Maps oder halten Sie in der Google Maps App für Mobilgeräte die Karte gedrückt und kopieren oder notieren Sie die Koordinaten.

Dialogfeld mit den Nutzungsbedingungen für das Navigation SDK anzeigen

Fügen Sie den folgenden Code in ViewController.swift in derselben loadView()-Methode wie den vorherigen Code ein. Hier werden die Nutzungsbedingungen für Endnutzer des Navigation SDK angezeigt. Wenn sie nicht akzeptiert wird, wird die Navigation nicht aktiviert.

// Show the terms and conditions.
let companyName = "Navigation SDK Codelab"
GMSNavigationServices.showTermsAndConditionsDialogIfNeeded(withCompanyName: companyName) { termsAccepted in
  if termsAccepted {
    // Enable navigation if the user accepts the terms.
    self.mapView.isNavigationEnabled = true
    // Request authorization for alert notifications which deliver guidance instructions
    // in the background.
  } else {
    // Handle the case when the user rejects the terms and conditions.
  }
}

Erstellen Sie die App und führen Sie sie aus, um das Dialogfeld zu sehen.

7. Listener für wichtige Navigationsereignisse hinzufügen

In diesem Schritt erfahren Sie, wie Sie Listener für wichtige Ereignisse wie die Ankunft am Zielort oder die Umleitung des Fahrers einrichten.

Damit auf diese Ereignisse gewartet werden kann, muss Ihr Ansichtscontroller das Protokoll GMSNavigatorListener übernehmen.

Fügen Sie dieses Protokoll der Klassendefinition in ViewController.swift hinzu.

class ViewController: UIViewController,
                      GMSNavigatorListener {

Fügen Sie nun eine Codezeile hinzu, um den Listener in loadView(): einzurichten.

// Add a listener for GMSNavigator.
mapView.navigator?.add(self)

Fügen Sie Ihrer Klasse schließlich zwei Methoden hinzu, um die ausgelösten Ereignisse zu verarbeiten.

// Listener to handle arrival events.
func navigator(_ navigator: GMSNavigator, didArriveAt waypoint: GMSNavigationWaypoint) {
  print("You have arrived at: \(waypoint.title)")
}

// Listener for route change events.
func navigatorDidChangeRoute(_ navigator: GMSNavigator) {
  print("The route has changed.")
}

8. Ziel festlegen und Navigation starten

In diesem Abschnitt erfahren Sie, wie Sie ein Ziel festlegen und die Navigation starten.

Neue Funktion für die Navigationslogik erstellen

Fügen Sie zuerst Ihrer ViewController eine neue Funktion namens startNav() hinzu. Sie enthält die Logik zum Festlegen eines Ziels und zum Starten der Navigation.

Hinweis: Das Attribut @objc ist erforderlich, damit die Methode für Objective-C-Code verfügbar ist und kein Build-Fehler ausgelöst wird, nachdem Sie Code hinzugefügt haben, der das Navigation SDK aufruft.

// Create a route and start guidance.
@objc func startNav() {
}

Erstellen Sie eine Waypoint für das Ziel.

Erstellen Sie als Nächstes ein Array von Zielen mit einem einzelnen Wegpunkt.

Tipp: Verwenden Sie eine Orts-ID für den Wegpunkt. Anhand von Orts-IDs kann das Navigation SDK den besten Standort für die Routenführung zum Zielort ermitteln. Sie können Orts-IDs mit der Place ID Finder App oder der Google Maps Platform Places API suchen.

// Create a route and start guidance.
@objc func startNav() {
  var destinations = [GMSNavigationWaypoint]()
  destinations.append(
    GMSNavigationWaypoint.init(
      placeID: "ChIJH-tBOc4EdkgRJ8aJ8P1CUxo",
      title: "Trafalgar Square")!)
}

Rufen Sie setDestinations()auf und verarbeiten Sie die Antwort.

Rufen Sie als Nächstes setDestinations auf und verarbeiten Sie die zurückgegebene GMSRouteStatus.

Wenn GMSRouteStatus „OK“ ist, starten Sie die Anleitung, indem Sie isGuidanceActive=true für das navigator-Objekt des mapView festlegen. Andernfalls wird eine Anweisung ausgegeben, die angibt, dass ein Fehler aufgetreten ist.

Wenn der zurückgegebene GMSRouteStatus-Wert „OK“ ist, beginnen Sie mit der Simulation der Fahrt entlang der Route, indem Sie mapView.locationSimulator.simulateLocationsAlongExistingRoute() aufrufen.

// Create a route and start guidance.
@objc func startNav() {
  var destinations = [GMSNavigationWaypoint]()
    destinations.append(
      GMSNavigationWaypoint.init(
        placeID: "ChIJH-tBOc4EdkgRJ8aJ8P1CUxo",
          title: "Trafalgar Square")!)
      
  mapView.navigator?.setDestinations(
    destinations
  ) { routeStatus in
    guard routeStatus == .OK else {
      print("Handle route statuses that are not OK.")
      return
    }
    //If routeStatus is OK, start guidance.
    self.mapView.navigator?.isGuidanceActive = true
    //start simulating driving along the route. self.mapView.locationSimulator?.simulateLocationsAlongExistingRoute()
    self.mapView.cameraMode = .following
  }
}

Häufige Fehlerstatus behandeln

Es ist sinnvoll, die GMSRouteStatus-Fehler expliziter zu behandeln, insbesondere wenn Sie anfangs Probleme mit Ihrer neuen App beheben. Möglicherweise erhalten Sie aufgrund Ihrer Debugging-Einrichtung anfangs häufiger Fehler bezüglich der Berechtigung für den Standortzugriff, des API-Schlüssels oder „Keine Route gefunden“. Daher kann es sinnvoll sein, diese Fehlerzustände zu behandeln.

Fügen Sie Code hinzu, der diese Sonderfälle verarbeitet und eine Anweisung in der Konsole ausgibt.

mapView.navigator?.setDestinations(
  destinations
) { routeStatus in
    guard routeStatus == .OK else {
      print("Handle route statuses that are not OK.")
      switch routeStatus {
       case .locationUnavailable:
        print("Location unavailable.") //check permissions
      case .noRouteFound:
        print("No route found.") //check start location and destination
      case .waypointError:
        print("Waypoint error") //check Place ID
      default:
        print("Not sure what happened")
      }
    return
  }

Schaltfläche zum Starten der Navigationsanleitung hinzufügen

Fügen Sie der Benutzeroberfläche eine Schaltfläche hinzu und verbinden Sie sie mit der Methode „startNav“. Erstellen Sie eine Methode mit dem Namen makeButton() und dem folgenden Code. Rufen Sie die Funktion makeButton() über loadView() auf.

// Add a button to the view.
func makeButton() {
  // A button to start navigation.
  let navButton = UIButton(frame: CGRect(x: 5, y: 150, width: 200, height: 35))
  navButton.backgroundColor = .blue
  navButton.alpha = 0.5
  navButton.setTitle("Start navigation", for: .normal)
  navButton.addTarget(self, action: #selector(startNav), for: .touchUpInside)
  self.mapView.addSubview(navButton)
}

Erstellen Sie Ihre App und führen Sie sie aus.

Hinweis: Wenn Sie den Code in

startNav()

ruft die

setDestinations()

Methode, für die nach den ersten 1.000 verwendeten Zielen eine Gebühr anfällt. Weitere Informationen finden Sie unter Nutzung und Abrechnung.

Tipp: Sie können einen neuen Standardstartort für den Xcode-Simulator festlegen, indem Sie im Simulator-Menü „Features“ > „Location“ > „Custom Location“ auswählen. Alternativ können Sie Code hinzufügen, um den Standort mit dem Navigation SDK zu simulieren, indem Sie die Methode mapview.locationSimulator?.simulateLocationAt() in Ihrer Funktion startNav() aufrufen.

9. Glückwunsch!

Gut gemacht – Sie haben Ihr Ziel erreicht!

Sie haben eine einfache App erstellt, die mithilfe des Navigation SDKs der Google Maps Platform detaillierte Navigationsanweisungen zu einem Ziel liefert.

Sie haben App-Berechtigungen und das Dialogfeld mit den Endnutzerbedingungen des Navigation SDK konfiguriert und ein Ziel mit einer Orts-ID angegeben. Sie haben verschiedene Erfolgs- und Fehlerstatus in Ihrer App behandelt.

10. Weitere Schritte

Wenn Sie Ihre App-Entwicklung weiter vorantreiben möchten, finden Sie in den folgenden Themen Inspiration.

• Auf weitere Navigationsereignisse warten Fügen Sie Code hinzu, um eine Meldung anzuzeigen, wenn die verbleibende Zeit oder Entfernung einen Schwellenwert überschreitet.
• Navigationsoberfläche anpassen
• Wenn Sie eine größere Herausforderung suchen, können Sie einen Places API-Ortsauswahl hinzufügen, damit der Nutzer das Ziel festlegen kann. Hinweis: Die Demo-Apps für das Navigation SDK enthalten eine Beispielimplementierung. Führen Sie pod try GoogleNavigation in Ihrem Projektordner aus, um den Code aufzurufen.