ספרייה ליצירה של מפות Google

Jetpack Compose הוא ערכת כלים מוצהרנית וילידית לממשק משתמש, שמפשטת ומאיצה את פיתוח ממשק המשתמש. ב-Jetpack Compose, אתם מתארים איך אתם רוצים שהאפליקציה תיראה, ואז נותנים ל-Jetpack Compose לטפל בשאר.

ספריית Maps Compose של Maps SDK ל-Android היא קבוצה של פונקציות וסוגים של נתונים שניתנים ליצירה בקוד פתוח, שאפשר להשתמש בהם עם Jetpack Compose כדי לפתח את האפליקציה.

הספרייה של Maps Compose מכילה פונקציות וסוגי נתונים שאפשר לשלב ביניהם, ומאפשרת לבצע משימות נפוצות רבות. דוגמאות לסוגי נתונים ולפונקציות נפוצות שאפשר לשלב:

קומפוזיציה תיאור
Circle פונקציה שאפשר לשלב כדי להוסיף עיגול למפה.
GoogleMap פונקציה שאפשר לשלב כדי להוסיף מפה.
GroundOverlay פונקציה שאפשר לשלב כדי להוסיף למפה שכבת-על של פני השטח.
MapProperties סוג הנתונים של נכסים שאפשר לשנות במפה.
MapUISettings סוג הנתונים של הגדרות שקשורות לממשק המשתמש במפה.
סמן פונקציה שאפשר לשלב כדי להוסיף סימן למפה.
Polygon פונקציה שאפשר לשלב כדי להוסיף פוליגון למפה.
Polyline פונקציה שאפשר לשלב כדי להוסיף קו מרובע למפה.
TileOverlay פונקציה שאפשר לשלב כדי להוסיף שכבת-על של משבצות למפה.

רשימה מלאה של כל סוגי הנתונים והפונקציות שאפשר לשלב מופיעה במאמר חומר עזר בנושא ספריית Maps Compose.

דרישות

כדי להשתמש בספריית Maps Compose עם Maps SDK ל-Android, צריך:

  • מורידים ומתקינים את Android Studio Arctic Fox.
  • יוצרים פרויקט של מפות Google ב-Android Studio באמצעות:

    • סוג התבנית הוא Empty Compose Activity. התבנית הזו מוסיפה את יחסי התלות הנדרשים ל-Jetpack Compose.
    • SDK מינימלי מוגדר ל-API 21: Android 5.0 (Lollipop) ואילך.
    • Language (שפה) מוגדר כ-Kotlin.
  • מקבלים מפתח API ומוסיפים אותו לפרויקט.

  • מתקינים את הספרייה של Maps Compose בפרויקט, כפי שמתואר בקטע הבא.

התקנה

כדי להתקין את ספריית Maps Compose בפרויקט שלכם במפות Google:

  1. מוסיפים את יחסי התלות הבאים לקובץ build.gradle.kts ברמת המודול:

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

  2. כדי לסנכרן את השינויים האלה, צריך ליצור מחדש את הפרויקט ב-Android Studio.

הוספת מפה לאפליקציה

בדוגמה הבאה מוסבר איך להשתמש ברכיב GoogleMap כדי להוסיף מפה.

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

בדוגמה הזו, המפה תופסת את כל המרחב המותר והמצלמה שלה ממוקמת במרכז סינגפור. CameraPositionState נוצר גם ומסופק ב-cameraPositionState כדי להגדיר את המיקום של המצלמה.

לאחר מכן, הדוגמה מפעילה את הרכיב הניתן לקישור Marker בתוכן המפה כדי להוסיף סמן למפה.

כדי להשוות את הדוגמה הזו לדוגמה שבה מוסיפים מפה באמצעות תצוגות, אפשר לעיין במאמר QuickStart. שימו לב כמה פחות קוד נדרש בפונקציות הניתנות ליצירה, ואיך לא צריך לדאוג לגבי מחזור החיים של המפה.

הגדרת מאפיינים במפה

אפשר להגדיר מאפיינים במפה על ידי הצגת אובייקט MapProperties או אובייקט MapUiSettings למאפיינים שקשורים לממשק המשתמש. אפשר לשנות את העצמים האלה כדי להפעיל יצירת מחדש של המפה.

בדוגמה הבאה נעשה שימוש במתג, רכיב של Material Design, כדי להפעיל או להשבית את אמצעי הבקרה על הזום במפה.

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

המאמרים הבאים