Adicionar mapas com marcadores

Este tutorial mostra como adicionar um mapa simples do Google com um marcador ao seu iOS app. Ele foi desenvolvido para pessoas com conhecimento básico ou intermediário de Swift ou Objective-C e conhecimento geral de Xcode. Para acessar um guia avançado criar mapas, ler as histórias guia.

Você criará o mapa a seguir usando este tutorial. O marcador está posicionado em Sydney, Austrália.

Captura de tela mostrando um mapa com um marcador sobre Sydney

Acessar o código

Clone ou faça o download do Repositório de amostras do Google Maps para iOS (em inglês) no GitHub.

Como alternativa, clique no botão a seguir para fazer o download do código-fonte:

Informar o código

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
      

Primeiros passos

Gerenciador de pacotes do Swift

O SDK do Maps para iOS pode ser instalado usando o Gerenciador de pacotes do Swift.

  1. Verifique se você removeu todas as dependências atuais do SDK do Maps para iOS.
  2. Abra uma janela de terminal e navegue até o diretório tutorials/map-with-marker.
  3. Verifique se o espaço de trabalho do Xcode está fechado e execute os seguintes comandos:
    sudo gem install cocoapods-deintegrate cocoapods-clean
    pod deintegrate
    pod cache clean --all
    rm Podfile
    rm map-with-marker.xcworkspace
  4. Abra seu projeto Xcode e exclua o podfile.
  5. Vá para Arquivo > Adicionar dependências de pacote.
  6. Digite https://github.com/googlemaps/ios-maps-sdk como o URL, pressione Enter para extrair o pacote e clique em Adicionar pacote.
  7. Talvez seja necessário redefinir o cache do pacote usando File > Pacotes > Redefinir o cache de pacotes

Usar o CocoaPods

  1. Faça o download e instale o Xcode versão 15.0 ou mais recente.
  2. Se você ainda não tiver o CocoaPods, instale-o no macOS executando o seguinte comando no terminal:
    sudo gem install cocoapods
  3. Navegue até o diretório tutorials/map-with-marker.
  4. Execute o comando pod install. O SDK do Maps especificado no Podfile será instalado com todas as dependências.
  5. Execute pod outdated para comparar a versão do pod instalado com as novas atualizações. Se uma nova versão for detectada, execute pod update para atualizar o Podfile e instalar o SDK mais recente. Para mais detalhes, consulte o guia do CocoaPods (em inglês).
  6. Abra (clique duas vezes) no arquivo map-with-marker.xcworkspace do projeto para abri-lo no Xcode. Use o arquivo .xcworkspace para abrir o projeto.

Gerar uma chave de API e ativar as APIs necessárias

Para concluir este tutorial, você precisa de uma chave de API do Google que esteja autorizada a use o SDK do Maps para iOS. Clique no botão a seguir para uma chave e ativar a API.

Vamos começar

Para mais detalhes, consulte Gere uma chave de API.

Adicionar a chave de API a seu aplicativo

Inclua sua chave de API ao AppDelegate.swift da seguinte maneira:

  1. Observe que a seguinte instrução de importação foi adicionada ao arquivo:
    import GoogleMaps
  2. Edite a linha a seguir no application(_:didFinishLaunchingWithOptions:) substituindo YOUR_API_KEY pela chave de API:
    GMSServices.provideAPIKey("YOUR_API_KEY")
.

Criar e executar o app

  1. Conecte um dispositivo iOS ao computador ou selecione um simulador no menu de esquema do Xcode.
  2. Se você estiver usando um dispositivo, verifique se os serviços de localização estão ativados. Se você estiver usando um simulador, selecione um local em Recursos. .
  3. No Xcode, clique na opção de menu Product/Run (ou no botão ).
    • O Xcode cria e executa o app no dispositivo ou no simulador.
    • Será mostrado um mapa com um marcador centralizado em Sydney, na costa leste da Austrália, semelhante à imagem desta página.

Solução de problemas:

  • Se o mapa não aparecer, verifique se você recebeu uma chave de API e para o app, como descrito anteriormente. Marca de seleção Console de depuração do Xcode para mensagens de erro sobre a chave de API.
  • Se você restringiu a chave de API pelo identificador do pacote iOS, edite o para adicionar o identificador de pacote para o app: com.google.examples.map-with-marker:
  • Verifique se você tem uma boa conexão Wi-Fi ou GPS.
  • usar as ferramentas de depuração do Xcode; para acessar registros e depurar o app.

Entender o código

  1. Crie um mapa e defina-o como a visualização no 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. Adicione um marcador ao mapa em 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;
          

Por padrão, o SDK do Maps para iOS exibe o conteúdo das informações quando o usuário toca em um marcador. Não é preciso adicionar um listener de clique para o marcador se o comportamento padrão atende às suas expectativas.

Parabéns! Você criou um app iOS que mostra um mapa do Google com uma marcador para indicar um local específico. Você também aprendeu a usar o SDK do Maps para iOS.

Próximas etapas

Saiba mais sobre o map object e o que você pode fazer com marcadores.