Haritalar Yazma Kitaplığı

Jetpack Compose, kullanıcı arayüzü geliştirmeyi basitleştiren ve hızlandıran, bildirime dayalı bir yerel kullanıcı arayüzü araç setidir. Jetpack Compose ile uygulamanızın nasıl görünmesini istediğinizi belirtirsiniz ve geri kalanı Jetpack Compose'a bırakırsınız.

Android için Haritalar SDK'sı'nın Haritalar Compose kitaplığı, uygulamanızı oluşturmak için Jetpack Compose ile kullanabileceğiniz açık kaynak, birleştirilebilir işlevler ve veri türlerinden oluşan bir pakettir.

Maps Compose kitaplığı, birçok yaygın görevi gerçekleştirmenize olanak tanıyan birleştirilebilir işlevler ve veri türleri içerir. Yaygın olarak kullanılan birleştirilebilir işlevler ve veri türlerinden bazıları şunlardır:

Oluşturulabilir Açıklama
Çember Haritaya daire eklemek için kullanılan birleştirilebilir işlev.
GoogleMap Harita eklemek için birleştirilebilir işlev.
GroundOverlay Bir haritaya zemin yer paylaşımı eklemek için birleştirilebilir işlev.
MapProperties Bir haritada değiştirilebilen mülkler için veri türü.
MapUISettings Bir haritada kullanıcı arayüzüyle ilgili ayarlar için veri türü.
İşaretçi Bir haritaya işaretçi eklemek için kullanılan birleştirilebilir işlev.
Poligon Bir haritaya poligon eklemek için kullanılan birleştirilebilir işlev.
Çoklu çizgi Bir haritaya çoklu çizgi eklemek için birleştirilebilir işlev.
TileOverlay Bir haritaya karo yer paylaşımı eklemek için birleştirilebilir işlev.

Tüm derlenebilir işlevlerin ve veri türlerinin tam listesi için Maps Compose kitaplığı referansı başlıklı makaleyi inceleyin.

Şartlar

Haritalar Compose kitaplığını Android için Haritalar SDK'sıyla kullanmak istiyorsanız:

  • Android Studio Arctic Fox'u indirin ve yükleyin.

  • Android Studio'da aşağıdakileri kullanarak Google Haritalar projesi oluşturun:

    • Boş Oluşturma Etkinliği şablon türü. Bu şablon, Jetpack Compose'un gerektirdiği gerekli bağımlılıkları ekler.
    • Minimum SDK, API 21: Android 5.0 (Lollipop) veya sonraki bir sürüme ayarlanmış.
    • Dil, Kotlin olarak ayarlanmış.

  • Bir API anahtarı edinin ve projenize ekleyin.

  • Haritalar Compose kitaplığını, bir sonraki bölümde açıklandığı şekilde projeye yükleyin.

Kurulum

Google Haritalar projenize Maps Compose kitaplığını yüklemek için:

  1. Modül düzeyindeki build.gradle.kts dosyanıza aşağıdaki bağımlılıkları ekleyin:

      dependencies {

    // Android Maps Compose composables for the Maps SDK for Android
    implementation("com.google.maps.android:maps-compose:6.2.1")
}

  2. Bu değişiklikleri senkronize etmek için Android Studio'da projenizi yeniden oluşturun.

Uygulamanıza harita ekleme

Aşağıdaki örnekte, harita eklemek için GoogleMap bileşeninin nasıl kullanılacağı gösterilmektedir. 

val singapore = LatLng(1.35, 103.87)
val singaporeMarkerState = rememberMarkerState(position = singapore)
val cameraPositionState = rememberCameraPositionState {
  position = CameraPosition.fromLatLngZoom(singapore, 10f)
}
GoogleMap(
  modifier = Modifier.fillMaxSize(),
  cameraPositionState = cameraPositionState
) {
  Marker(
    state = singaporeMarkerState,
    title = "Singapore",
    snippet = "Marker in Singapore"
  )
}

Bu örnekte, harita izin verilen maksimum alanı kaplıyor ve kamerası Singapur'un etrafında merkezleniyor. Kameranın konumunu ayarlamak için cameraPositionState içinde bir CameraPositionState da oluşturulur ve sağlanır.

Ardından örnek, haritaya işaretçi eklemek için haritanın içeriğinde İşaretçi bileşenini çağırır.

Bu örneği, Görüntüleme Sayısı'nı kullanarak harita ekleyen bir örnekle karşılaştırmak için QuickStart bölümüne bakın. Birleştirilebilir işlevlerin daha az kod gerektirdiğini ve haritanın yaşam döngüsü hakkında endişelenmenize gerek olmadığını fark edin.

Haritada mülkleri ayarlama

Harita üzerinde MapProperties nesnesi veya kullanıcı arayüzüyle ilgili özellikler için MapUiSettings nesnesi sağlayarak özellikler ayarlayabilirsiniz. Haritanın yeniden oluşturulmasını tetiklemek için bu nesneleri değiştirebilirsiniz.

Aşağıdaki örnekte, haritada yakınlaştırma kontrollerini değiştirmek için bir Materyal Tasarım bileşeni olan anahtar kullanın.

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)
    }
  )
}

Sırada ne var?