Dodawanie mapy ze znacznikiem

W tym samouczku pokazujemy, jak dodać do aplikacji na iOS prostą mapę Google ze znacznikiem. Ten samouczek jest przeznaczony dla osób, które mają podstawową lub średniozaawansowaną znajomość Swift lub Objective-C oraz ogólną znajomość Xcode. Zaawansowany przewodnik po tworzeniu map znajdziesz w przewodniku dla programistów.

W tym samouczku utworzysz poniższą mapę. Znacznik znajduje się w Sydney w Australii.

Zrzut ekranu przedstawiający mapę z oznaczeniem Sydney

Pobierz kod

Sklonuj lub pobierz repozytorium przykładów Map Google na iOS z GitHuba.

Możesz też kliknąć ten przycisk, aby pobrać kod źródłowy:

Podaj kod

Swift

import UIKit
import GoogleMaps

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        // Create a GMSCameraPosition that tells the map to display the
        // coordinate -33.86,151.20 at zoom level 6.
        let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0)
        let mapView = GMSMapView.map(withFrame: self.view.frame, camera: camera)
        self.view.addSubview(mapView)

        // Creates a marker in the center of the map.
        let marker = GMSMarker()
        marker.position = CLLocationCoordinate2D(latitude: -33.86, longitude: 151.20)
        marker.title = "Sydney"
        marker.snippet = "Australia"
        marker.map = mapView
  }
}
      

Objective-C

#import "ViewController.h"
#import <GoogleMaps/GoogleMaps.h>

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
  // Do any additional setup after loading the view.
  // Create a GMSCameraPosition that tells the map to display the
  // coordinate -33.86,151.20 at zoom level 6.
  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                          longitude:151.20
                                                               zoom:6];
  GMSMapView *mapView = [GMSMapView mapWithFrame:self.view.frame camera:camera];
  mapView.myLocationEnabled = YES;
  [self.view addSubview:mapView];

  // Creates a marker in the center of the map.
  GMSMarker *marker = [[GMSMarker alloc] init];
  marker.position = CLLocationCoordinate2DMake(-33.86, 151.20);
  marker.title = @"Sydney";
  marker.snippet = @"Australia";
  marker.map = mapView;
}

@end
      

Rozpocznij

Menedżer pakietów Swift

Pakiet SDK Map na iOS można zainstalować za pomocą menedżera pakietów Swift.

  1. Upewnij się, że zostały usunięte wszystkie istniejące zależności Maps SDK na iOS.
  2. Otwórz okno terminala i przejdź do katalogu tutorials/map-with-marker.
  3. Upewnij się, że obszar roboczy Xcode jest zamknięty, i uruchom te polecenia:
    sudo gem install cocoapods-deintegrate cocoapods-clean
    pod deintegrate
    pod cache clean --all
    rm Podfile
    rm map-with-marker.xcworkspace
  4. Otwórz projekt Xcode i usuń plik podfile.
  5. Kliknij Plik > Dodaj zależności pakietu.
  6. Wpisz https://github.com/googlemaps/ios-maps-sdk jako adres URL, naciśnij Enter, aby zaimportować pakiet, i kliknij Dodaj pakiet.
  7. Może być konieczne zresetowanie pamięci podręcznej pakietu za pomocą opcji Plik > Pakiety > Zresetuj pamięć podręczną pakietu.

Korzystanie z CocoaPods

  1. Pobierz i zainstaluj Xcode w wersji 15.0 lub nowszej.
  2. Jeśli nie masz jeszcze CocoaPods, zainstaluj je w systemie macOS, wykonując w terminalu to polecenie:
    sudo gem install cocoapods
  3. Przejdź do katalogu tutorials/map-with-marker.
  4. Uruchom polecenie pod install. Spowoduje to zainstalowanie pakietu SDK Maps określonego w Podfile wraz ze wszystkimi zależnościami.
  5. Uruchom pod outdated, aby porównać zainstalowaną wersję pod względem nowych aktualizacji. Jeśli zostanie wykryta nowa wersja, uruchom pod update, aby zaktualizować Podfile i zainstalować najnowszy pakiet SDK. Więcej informacji znajdziesz w przewodniku CocoaPods.
  6. Otwórz (kliknij dwukrotnie) plik projektu map-with-marker.xcworkspace, aby otworzyć go w Xcode. Aby otworzyć projekt, musisz użyć pliku .xcworkspace.

Uzyskiwanie klucza interfejsu API i włączanie niezbędnych interfejsów API

Aby wykonać czynności opisane w tym samouczku, musisz mieć klucz interfejsu API Google, który umożliwia korzystanie z pakietu SDK Map Google na iOS. Kliknij przycisk poniżej, aby uzyskać klucz i aktywować interfejs API.

Pierwsze kroki

Więcej informacji znajdziesz w artykule Pobieranie klucza interfejsu API.

Dodawanie klucza interfejsu API do aplikacji

Aby dodać klucz interfejsu API do AppDelegate.swift, wykonaj te czynności:

  1. Pamiętaj, że do pliku został dodany ten element importu:
    import GoogleMaps
  2. W metodie application(_:didFinishLaunchingWithOptions:) zmodyfikuj ten wiersz, zastępując YOUR_API_KEY swoim kluczem API:
    GMSServices.provideAPIKey("YOUR_API_KEY")

Tworzenie i uruchamianie aplikacji

  1. Połącz urządzenie z iOS z komputera lub wybierz symulator z menu schematu Xcode.
  2. Jeśli używasz urządzenia, sprawdź, czy usługi lokalizacyjne są włączone. Jeśli używasz symulatora, wybierz lokalizację w menu Funkcje.
  3. W Xcode kliknij opcję menu Produkt/Uruchom (lub ikonę przycisku odtwarzania).
    • Xcode kompiluje aplikację, a potem uruchamia ją na urządzeniu lub na symulatorze.
    • Powinna Ci się wyświetlić mapa z oznacznikiem wyśrodkowanym na Sydney na wschodnim wybrzeżu Australii, podobna do tej na tej stronie.

Rozwiązywanie problemów:

  • Jeśli nie widzisz mapy, sprawdź, czy masz klucz API i czy został on dodany do aplikacji w sposób opisany wcześniej. Sprawdź konsolę debugowania Xcode pod kątem komunikatów o błędach dotyczących klucza interfejsu API.
  • Jeśli klucz interfejsu API jest ograniczony przez identyfikator pakietu na iOS, zmodyfikuj klucz, aby dodać identyfikator pakietu aplikacji:com.google.examples.map-with-marker.
  • Upewnij się, że masz dobre połączenie z Wi-Fi lub GPS.
  • Aby wyświetlać dzienniki i debugować aplikację, użyj narzędzi do debugowania Xcode.

Zrozumienie kodu

  1. Utwórz mapę i ustaw ją jako widok w funkcji viewDidLoad().

    Swift

    // Create a GMSCameraPosition that tells the map to display the
    // coordinate -33.86,151.20 at zoom level 6.
    let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0)
    let mapView = GMSMapView.map(withFrame: CGRect.zero, camera: camera)
    view = mapView
          

    Objective-C

    // Create a GMSCameraPosition that tells the map to display the
    // coordinate -33.86,151.20 at zoom level 6.
    GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                            longitude:151.20
                                                                 zoom:6.0];
    GMSMapView *mapView = [[GMSMapView alloc] initWithFrame: CGRectZero camera:camera];
    self.view = mapView;
          
  2. Dodaj znacznik do mapy w viewDidLoad().

    Swift

    // Creates a marker in the center of the map.
    let marker = GMSMarker()
    marker.position = CLLocationCoordinate2D(latitude: -33.86, longitude: 151.20)
    marker.title = "Sydney"
    marker.snippet = "Australia"
    marker.map = mapView
          

    Objective-C

    // Creates a marker in the center of the map.
    GMSMarker *marker = [[GMSMarker alloc] init];
    marker.position = CLLocationCoordinate2DMake(-33.86, 151.20);
    marker.title = @"Sydney";
    marker.snippet = @"Australia";
    marker.map = mapView;
          

Domyślnie Maps SDK na iOS wyświetla zawartość okna informacyjnego, gdy użytkownik kliknie znacznik. Jeśli wystarcza Ci działanie domyślne, nie musisz dodawać do markera żadnych metod reagujących na kliknięcie.

Gratulacje! Stworzysz aplikację na iOS, która wyświetla mapę Google ze znacznikiem wskazującym konkretną lokalizację. Dowiesz się też, jak używać Maps SDK na iOS.

Dalsze kroki

Dowiedz się więcej o obiekcie mapy i o tym, co możesz zrobić z oznacznikami.