Dodawanie mapy ze znacznikiem

Ten samouczek pokazuje, jak dodać prostą mapę Google ze znacznikiem do aplikacji na iOS. Ta opcja jest odpowiednia dla osób, które znają język Swift na poziomie podstawowym lub średnio zaawansowanym, a także ogólną wiedzę o Xcode. Zaawansowany przewodnik o tworzeniu map znajdziesz w przewodniku dla programistów.

W tym samouczku utworzysz następującą mapę. Znacznik znajduje się w Sydney w Australii.

Zrzut ekranu przedstawiający mapę ze znacznikiem nad Sydney

Pobierz kod

Skopiuj lub pobierz repozytorium przykładowych Map Google na iOS z GitHuba.

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

Podaj kod

Swift

/*
 * Copyright 2020 Google Inc. All rights reserved.
 *
 *
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
 * file except in compliance with the License. You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
 * ANY KIND, either express or implied. See the License for the specific language governing
 * permissions and limitations under the License.
 */

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

/*
* Copyright 2020 Google Inc. All rights reserved.
*
*
* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
* file except in compliance with the License. You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software distributed under
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
* ANY KIND, either express or implied. See the License for the specific language governing
* permissions and limitations under the License.
*/

#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 Google na iOS można zainstalować za pomocą menedżera pakietów Swift.

  1. Sprawdź, czy zostały usunięte wszystkie zależności pakietu Maps SDK na iOS.
  2. Otwórz okno terminala i przejdź do katalogu tutorials/mapwithmarker.
  3. Zamknij obszar roboczy Xcode 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ń podfile.
  5. Wybierz Plik > Dodaj zależności pakietów.
  6. Wpisz URL https://github.com/googlemaps/ios-maps-sdk, naciśnij Enter, by pobrać pakiet, a następnie kliknij Dodaj pakiet.
  7. Może być konieczne zresetowanie pamięci podręcznej pakietów, klikając Plik > Pakiety > Zresetuj pamięć podręczną pakietów.

Używaj CocoaPods

  1. Pobierz i zainstaluj Xcode w wersji 14.0 lub nowszej.
  2. Jeśli nie masz jeszcze CocoaPods, zainstaluj go w macOS, uruchamiając z terminala to polecenie:
    sudo gem install cocoapods
  3. Przejdź do katalogu tutorials/map-with-marker.
  4. Uruchom polecenie pod install. Spowoduje to zainstalowanie pakietu SDK Map Google określonego w Podfile wraz ze wszystkimi zależnościami.
  5. Uruchom pod outdated, aby porównać zainstalowaną wersję poda z nowymi aktualizacjami. Jeśli zostanie wykryta nowa wersja, uruchom polecenie pod update, aby zaktualizować pakiet SDK Podfile i zainstalować najnowszy pakiet SDK. Więcej informacji znajdziesz w przewodniku po CocoaPods.
  6. Otwórz (dwukrotnie) plik map-with-marker.xcworkspace projektu, 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 ukończyć ten samouczek, potrzebujesz klucza interfejsu API Google, który jest autoryzowany do korzystania z pakietu SDK Map Google na iOS. Kliknij przycisk poniżej, aby uzyskać klucz i aktywować interfejs API.

Rozpocznij

Więcej informacji znajdziesz w artykule o uzyskiwaniu klucza interfejsu API.

Dodawanie klucza interfejsu API do aplikacji

Dodaj klucz interfejsu API do urządzenia AppDelegate.swift, wykonując te czynności:

  1. Zwróć uwagę, że do pliku została dodana ta instrukcja importu:
    import GoogleMaps
  2. Edytuj ten wiersz w metodzie application(_:didFinishLaunchingWithOptions:), zastępując YOUR_API_KEY kluczem interfejsu API:
    GMSServices.provideAPIKey("YOUR_API_KEY")

Tworzenie i uruchamianie aplikacji

  1. Podłącz urządzenie z iOS do komputera lub wybierz symulator z menu schematu Xcode.
  2. Jeśli korzystasz z urządzenia, upewnij się, że są włączone usługi lokalizacyjne. Jeśli korzystasz z symulatora, wybierz lokalizację z 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 w symulatorze.
    • Powinna wyświetlić się mapa ze znacznikiem wyśrodkowanym na Sydney na wschodnim wybrzeżu Australii, podobna do przedstawionej na tej stronie.

Rozwiązywanie problemów:

  • Jeśli nie widzisz mapy, sprawdź, czy udało Ci się uzyskać klucz interfejsu API i dodać go do aplikacji w sposób opisany powyżej. Poszukaj komunikatów o błędach związanych z kluczem interfejsu API w konsoli debugowania Xcode.
  • Jeśli klucz interfejsu API jest ograniczony przez identyfikator pakietu na iOS, edytuj klucz, aby dodać identyfikator pakietu dla aplikacji: com.google.examples.map-with-marker.
  • Upewnij się, że masz dobre połączenie z siecią Wi-Fi lub GPS.
  • Aby wyświetlić logi i debugować aplikację, użyj narzędzi do debugowania Xcode.

Zrozumienie kodu

  1. Utwórz mapę i ustaw ją jako widok w aplikacji 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 pakiet SDK Map Google na iOS wyświetla zawartość okna informacyjnego, gdy użytkownik kliknie znacznik. Jeśli odpowiada Ci działanie domyślne, nie musisz dodawać detektora kliknięć.

Gratulacje! Masz aplikację na iOS, która wyświetla mapę Google ze znacznikiem wskazującym konkretną lokalizację. Wiesz też, jak korzystać z pakietu SDK Map Google na iOS.

Dalsze kroki

Dowiedz się więcej o obiekcie mapy i o tym, co można zrobić za pomocą znaczników.