Como usar o estilo de mapas baseados na nuvem (Beta)

As instruções a seguir mostram como usar o Console do Google Cloud para criar, personalizar, publicar e gerenciar seus mapas a qualquer momento usando IDs e estilos de mapa.

Para criar ou gerenciar qualquer ID ou estilo de mapa no seu projeto do Google Cloud, você precisa ser editor ou proprietário do projeto no IAM.

Criar IDs de mapa

Um ID de mapa é um identificador exclusivo que representa uma única instância de um mapa do Google. É possível criar IDs de mapa e atualizar um estilo associado a um deles a qualquer momento no Console do Google Cloud sem alterar o estilo JSON incorporado no código do seu aplicativo.

Basta seguir estas etapas:

  1. No Console do Cloud, acesse a página Gerenciamento de mapas.

    Acessar a página "Gerenciamento de mapas"

  2. Clique em Criar novo ID de mapa para exibir o formulário Criar novo ID de mapa.

    Criar novo ID de mapa

    No formulário, siga estas etapas:

    • Especifique um nome para o mapa.
    • Escolha um tipo de mapa ou plataforma.
    • Insira uma descrição do mapa.
    • Clique em Próxima para exibir o novo ID do mapa.

Instalar o SDK do Maps para Android (Beta)

Os recursos de estilo de mapas baseados na nuvem ainda não estão disponíveis na biblioteca do Maps do Google Play Services. Para testá-los, use o SDK independente do Maps para Android (Beta).

Para saber como fazer o download do SDK Beta, consulte Instalar o SDK do Maps para Android v.3.1.0 (Beta).

Adicionar IDs de mapa ao MapFragment

É possível adicionar o ID do mapa com um elemento <fragment> no arquivo de layout da atividade usando a classe GoogleMapOptions de forma programática ou a classe MapView.

Por exemplo, suponha que você tenha criado um ID armazenado como um valor de string chamado map_id em res/values/strings.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <string name="map_id">YOUR_MAP_ID</string>
</resources>

No caso de mapas adicionados usando um elemento <fragment> no arquivo de layout da atividade, todos os fragmentos de mapa que devem ter o estilo personalizado precisam especificar o ID do mapa no atributo map:mapId:

<fragment xmlns:map="http://schemas.android.com/apk/res-auto"
    class="com.google.android.libraries.maps.SupportMapFragment"
    …
    map:mapId="@string/map_id" />

Você também pode usar o atributo map:mapId da classe MapView para especificar um ID de mapa:

<com.google.android.gms.maps.MapView
    xmlns:android="http://schemas.android.com/apk/res/android"
    ....
    map:mapId="@string/map_id" />

Se quiser especificar um ID de maneira programática, transmita-o para uma instância MapFragment usando a classe GoogleMapOptions:

Java

MapFragment mapFragment = MapFragment.newInstance(
    new GoogleMapOptions()
        .mapId(getResources().getString(R.string.map_id)));
      

Kotlin

val mapFragment = MapFragment.newInstance(
    GoogleMapOptions()
        .mapId(resources.getString(R.string.map_id))
)
      

No Android Studio, crie e execute seu app normalmente. Os estilos personalizados, conforme configurado na primeira etapa, serão aplicados a todos os mapas com um ID.

Criar estilos de mapa

Um estilo é um identificador exclusivo de um conjunto de personalizações que podem ser associadas a qualquer ID de mapa.

Para criar um novo estilo, faça o seguinte:

  1. No Console do Google Cloud, acesse a página Estilos de mapa.

    Acessar "Estilos de mapa"

  2. Clique em Criar um estilo de mapa para abrir a página Novo estilo de mapa.

  3. Na página Novo estilo de mapa, escolha uma das seguintes opções:

    1. Selecione uma das variações de estilo de mapa disponíveis.
    2. Importe o código de estilo JSON colando-o na caixa de texto na guia Importar o JSON.
    3. Selecione um estilo de mapa personalizado para destacar as metas de um setor específico, como viagem, logística, imóveis e varejo.

    Você pode especificar outras personalizações nos recursos de mapa clicando em Personalizar no editor de estilo.

    As personalizações adicionadas ao estilo do mapa sempre terão prioridade sobre as atualizações que o Google fizer nesse estilo.

  4. Para nomear o estilo do seu mapa e salvar as alterações, clique em Salvar.

Atualizar detalhes do estilo

Na página Estilos de mapa, é possível selecionar um estilo para realizar as seguintes ações:

  • Continuar a personalização ou ver detalhes do estilo no editor clicando em Personalizar o estilo

    No editor de estilo, se você associar um ID de mapa ao seu estilo, as alterações salvas e publicadas se tornarão públicas para os mapas associados. Isso não acontecerá se você salvar as personalizações sem publicá-las no editor de estilo.

  • Clicar em Editar e renomear ou alterar a descrição do estilo

  • Clicar em Duplicar para criar uma cópia do estilo

  • Clicar em Excluir para remover o estilo

  • Ver os IDs de mapa associados ao estilo

Os estilos criados antes de 15 de setembro de 2020 não exibirão os elementos naturais avançados do Google Maps. Para usar esses elementos, você precisa criar um estilo de mapa.

Personalizar em diferentes níveis de zoom

É possível personalizar o estilo dos elementos existentes em diferentes níveis de zoom ao criar estilos de mapa com o editor no Console do Google Cloud.

Por exemplo, você pode personalizar a cor da água de rosa no nível de zoom 0 para roxo no nível de zoom 10 e associar outras personalizações ao grau de detalhes que você vê no zoom especificado. Para testar esse recurso em um app de exemplo, execute o ApiDemos (amostra do GitHub para Java | Kotlin) e veja a demonstração de CloudBasedMapStylingActivity (amostra do GitHub para Java | Kotlin).

Se quiser fazer personalizações de estilo em diferentes níveis de zoom, siga estas etapas:

  1. Abra o editor de estilo no Console do Cloud. Para isso, acesse a página Estilos de mapa e crie ou atualize um estilo.
  2. Selecione um recurso no submenu Tipo de recurso para abrir o submenu Tipo de elemento e escolha o elemento que você quer personalizar.
  3. Marque a caixa de seleção Personalizar em vários níveis de zoom para que as personalizações no nível de zoom atual sejam exibidas no editor de estilo.

    Depois de marcar a caixa de seleção Personalizar em vários níveis de zoom, você verá:

    • uma caixa de seleção Adicionar parada: z que indica seu nível de zoom atual e anexa personalizações ao nível indicado;
    • uma barra deslizante para modificar e selecionar seu nível de zoom. Você pode ajustar os níveis de zoom usando controles booleanos no mapa, a roda do mouse ou as teclas de seta do teclado.
  4. Quando você faz personalizações no submenu Estilizadores, o editor de estilo marca automaticamente a caixa de seleção Adicionar parada: z, exibe um ponto azul acima do controle deslizante e substitui todos os estilos herdados.

    Esse ponto indica que as alterações foram feitas no nível de zoom selecionado. Para evitar que as alterações sejam salvas em um determinado nível de zoom, desmarque a caixa de seleção Adicionar parada: z. O ponto azul ficará cinza para indicar que as alterações não serão salvas naquele nível. Depois que a caixa de seleção é limpa, o elemento retorna ao estilo herdado.

    Qualquer personalização feita em um nível de zoom é aplicada aos níveis indicados e superiores. Por exemplo, as personalizações no nível de zoom 10 são implementadas nos níveis de zoom 10, 11, 12 e assim por diante. As personalizações substituem os estilos herdados.

  5. Para salvar as alterações, clique em Salvar. Para tornar as alterações públicas nos IDs de mapa associados ao estilo, clique em Publicar.

App de exemplo

Veja aplicativos de amostra Java e Kotlin que mostram como estilizar seu mapa Android na nuvem.

Problemas conhecidos

Depois que seu app é entregue aos clientes, os estilos personalizados de mapas com IDs podem ser atualizados no Console do Google Cloud. Os novos estilos| são aplicados no app em algumas horas.

Para garantir a exibição imediata dos novos estilos personalizados para fins de teste, limpe os dados do app do dispositivo de teste. Para mais informações sobre como limpar dados do seu dispositivo, consulte Ajuda do Android > Liberar espaço.

As configurações variam de acordo com o smartphone. Para mais informações, entre em contato com o fabricante do dispositivo.