Adicionar mapas com marcadores

Neste tutorial, mostramos como adicionar um mapa do Google ao seu app para iOS. O mapa inclui um marcador, também chamado de alfinete, para indicar um local específico.

Como conseguir o código

Clone ou faça o download do repositório de exemplos do Google Maps para iOS no GitHub.

Como configurar o projeto de desenvolvimento

Siga estas etapas para instalar o SDK do Maps para iOS:

  1. Faça o download e instale o Xcode versão 14.0 (link em inglês) 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. Clone ou faça o download do repositório de exemplos do Google Maps para iOS.
  4. Navegue até o diretório tutorials/map-with-marker.
  5. Execute o comando pod install. Isso instalará as APIs especificadas no Podfile e todas as dependências que elas possam ter.
  6. Execute pod outdated para comparar a versão do pod instalada 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).
  7. 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.

Como conseguir 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 usar o SDK do Maps para iOS. Clique no botão abaixo para receber uma chave e ativar a API.

Primeiros passos

Para mais detalhes, consulte Gerar 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 seguinte linha no método application(_:didFinishLaunchingWithOptions:), substituindo YOUR_API_KEY pela chave de API:
    GMSServices.provideAPIKey("YOUR_API_KEY")

Como criar e executar o app

  1. Conecte um dispositivo iOS ao computador ou selecione um simulador no menu pop-up do 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 no menu Recursos.
  3. No Xcode, clique na opção de menu Product/Run (ou no ícone do botão de reprodução).
    • O Xcode cria o app e o executa no dispositivo ou no simulador.
    • Você verá 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 a incluiu no app, conforme descrito acima. Verifique se há mensagens de erro no console de depuração do Xcode.
  • Se você restringiu a chave de API pelo identificador do pacote do iOS, edite a chave para adicionar o identificador do pacote ao app: com.google.examples.map-with-marker.
  • Verifique se você tem uma boa conexão Wi-Fi ou GPS.
  • Use as ferramentas de depuração de Xcode para visualizar registros e depurar o app.

Entender o código

  1. Crie um mapa e defina-o como a visualização em loadView().

    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 loadView().

    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 da janela de informações quando o usuário toca em um marcador. Não é necessário adicionar um listener de clique ao marcador se o comportamento padrão atende às suas expectativas.

Parabéns! Você criou um app iOS que exibe um mapa do Google com um 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 objeto "map" e o que você pode fazer com marcadores.