O Jetpack Compose é um kit de ferramentas de IU nativo e declarativo que simplifica e acelera o desenvolvimento da interface. Você descreve como deve ser a aparência do app, e o Jetpack Compose cuida de tudo.
A biblioteca do Maps Compose do SDK do Maps para Android é um conjunto de funções combináveis de código aberto e tipos de dados que pode ser usado com o Jetpack Compose para criar seu app.
Essa biblioteca contém funções combináveis e tipos de dados que permitem executar várias tarefas comuns. Estes são alguns dos mais usados:
Combinável | Descrição |
---|---|
Circle | Função combinável para adicionar um círculo a um mapa. |
GoogleMap | Função combinável para adicionar um mapa. |
GroundOverlay | Função combinável para adicionar uma sobreposição de solo a um mapa. |
MapProperties | Tipo de dados de propriedades que podem ser modificadas em um mapa. |
MapUISettings | Tipo de dados para configurações relacionadas à IU em um mapa. |
Marker | Função combinável para adicionar um marcador a um mapa. |
Polygon | Função combinável para adicionar um polígono a um mapa. |
Polyline | Função combinável para adicionar uma polilinha a um mapa. |
TileOverlay | Função combinável para adicionar uma sobreposição de blocos a um mapa. |
Para conferir uma lista completa de funções combináveis e tipos de dados, consulte a referência da biblioteca Maps Compose.
Requisitos
Para usar a biblioteca do Maps Compose com o SDK do Maps para Android:
- Faça o download e instale o Android Studio Arctic Fox.
Crie um projeto do Google Maps no Android Studio com este itens:
- Um tipo de modelo de Atividade do Compose vazia. Esse modelo adiciona as dependências exigidas pelo Jetpack Compose.
- SDK mínimo definido como API 21: Android 5.0 (Lollipop) ou uma versão mais recente.
- A linguagem definida como Kotlin.
Obtenha e adicione uma chave de API ao projeto.
Instale a biblioteca do Maps Compose no projeto, conforme descrito na próxima seção.
Instalação
Para instalar a biblioteca do Maps Compose no seu projeto do Google Maps, faça o seguinte:
Adicione as seguintes dependências ao arquivo
build.gradle.kts
do módulo:dependencies { // Android Maps Compose composables for the Maps SDK for Android implementation("com.google.maps.android:maps-compose:6.1.0") }
Recrie seu projeto no Android Studio para sincronizar essas mudanças.
Adicionar um mapa ao seu app
O exemplo a seguir mostra como usar a função combinável GoogleMap para adicionar um mapa.
val singapore = LatLng(1.35, 103.87) val cameraPositionState = rememberCameraPositionState { position = CameraPosition.fromLatLngZoom(singapore, 10f) } GoogleMap( modifier = Modifier.fillMaxSize(), cameraPositionState = cameraPositionState ) { Marker( state = MarkerState(position = singapore), title = "Singapore", snippet = "Marker in Singapore" ) }
Neste exemplo, o mapa ocupa o espaço máximo permitido, e a câmera dele está centralizada em Singapura. Um objeto CameraPositionState também é criado e fornecido em cameraPositionState
para definir a posição da câmera.
O exemplo então chama a função combinável Marker no conteúdo do mapa para adicionar um marcador.
Para comparar este exemplo a outro que adiciona um mapa usando visualizações, consulte o guia de início rápido. Observe como as funções combináveis exigem menos código, e você não precisa se preocupar com o ciclo de vida do mapa.
Definir propriedades em um mapa
É possível definir propriedades no mapa fornecendo um objeto MapProperties ou MapUiSettings para propriedades relacionadas à interface. Você pode modificar esses objetos para acionar a recomposição do mapa.
No exemplo abaixo, use uma chave, um componente do Material Design para alternar os controles de zoom no mapa.
var uiSettings by remember { mutableStateOf(MapUiSettings()) } var properties by remember { mutableStateOf(MapProperties(mapType = MapType.SATELLITE)) } Box(Modifier.fillMaxSize()) { GoogleMap( modifier = Modifier.matchParentSize(), properties = properties, uiSettings = uiSettings ) Switch( checked = uiSettings.zoomControlsEnabled, onCheckedChange = { uiSettings = uiSettings.copy(zoomControlsEnabled = it) } ) }
Próxima etapa
- Confira a página do projeto da Biblioteca do Maps Compose no GitHub (em inglês).
- Consulte a documentação do Jetpack Compose.