مكتبة "الكتابة في الخرائط"

Jetpack Compose عبارة عن مجموعة أدوات تعريفية وأصلية لواجهة المستخدم تعمل على تبسيط عملية تطوير واجهة المستخدم وتسريعها. باستخدام Jetpack Compose، يمكنك وصف الشكل الذي تريد أن يظهر به تطبيقك، ثم السماح لـ Jetpack Compose بالتعامل مع باقي العناصر.

إنّ مكتبة Compose لحزمة تطوير البرامج (SDK) لـ "خرائط Google" لنظام التشغيل Android هي مجموعة من أنواع البيانات والدوال القابلة للإنشاء المفتوحة المصدر التي يمكنك استخدامها مع Jetpack Compose لإنشاء تطبيقك.

تحتوي مكتبة Maps Compose على دوال قابلة للإنشاء وأنواع بيانات تتيح لك تنفيذ العديد من المهام الشائعة. تتضمن بعض الدوال وأنواع البيانات شائعة الاستخدام ما يلي:

قابلة للتعديل الوصف
دائرة دالة قابلة للتعديل لإضافة دائرة إلى خريطة
GoogleMap دالة قابلة للتعديل لإضافة خريطة.
GroundOverlay دالة قابلة للتعديل لإضافة تراكب أرضي إلى خريطة.
MapProperties نوع بيانات الخصائص التي يمكن تعديلها على خريطة.
MapUISettings نوع البيانات للإعدادات المتعلّقة بواجهة المستخدم على خريطة
محدِّد الموقع دالة قابلة للتعديل لإضافة علامة إلى خريطة
مضلّع دالة قابلة للتعديل لإضافة مضلع إلى خريطة.
خطوط متعددة دالة قابلة للإنشاء لإضافة خط متعدد إلى خريطة.
TileOverlay دالة قابلة للإعداد لإضافة تراكب مربّعات إلى خريطة

للحصول على قائمة كاملة بجميع الدوال وأنواع البيانات القابلة للإنشاء، يُرجى الاطّلاع على مرجع مكتبة Compose في "خرائط Google".

الشروط

لاستخدام مكتبة Maps Compose مع حزمة تطوير البرامج (SDK) لـ "خرائط Google" لنظام التشغيل Android، عليك إجراء ما يلي:

  • نزِّل وثبِّت Android Studio Arctic Fox.

  • يمكنك إنشاء مشروع على "خرائط Google" في "استوديو Android" باستخدام:

    • نوع نموذج من نشاط الإنشاء الفارغ. يضيف هذا النموذج التبعيات اللازمة التي يتطلبها Jetpack Compose.
    • تم ضبط الحدّ الأدنى لحزمة تطوير البرامج (SDK) على API 21: Android 5.0 (Lollipop) أو إصدار أحدث.
    • اضبط اللغة على Kotlin.

  • احصل على مفتاح واجهة برمجة التطبيقات وأضِفه إلى مشروعك

  • ثبِّت مكتبة Maps Compose في المشروع كما هو موضَّح في القسم التالي.

تثبيت

لتثبيت مكتبة Compose لحزمة تطوير برامج "خرائط Google" في مشروع "خرائط Google":

  1. أضِف التبعيات التالية إلى ملف build.gradle على مستوى الوحدة:

      dependencies {


    // Android Maps Compose composables for the Maps SDK for Android
    implementation 'com.google.maps.android:maps-compose:5.0.4'
}

  2. أعِد إنشاء مشروعك في "استوديو Android" لمزامنة هذه التغييرات.

إضافة خريطة إلى تطبيقك

يوضح المثال التالي كيفية استخدام GoogleMap القابلة للإنشاء لإضافة خريطة. 

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

في هذا المثال، تشغل الخريطة أكبر مساحة مسموح بها وتتمركز الكاميرا حول سنغافورة. يتم أيضًا إنشاء CameraPositionState وتقديمه في cameraPositionState لضبط موضع الكاميرا.

في هذه الحالة، يستدعي المثال العلامة القابلة للإنشاء في محتوى الخريطة لإضافة علامة إلى الخريطة.

لمقارنة هذا المثال بمثال يضيف خريطة باستخدام طرق العرض، يمكنك الاطّلاع على QuickStart. لاحِظ كيف أنّ الدوال القابلة للإنشاء تتطلّب رمزًا أقل، ولا داعي للقلق بشأن مراحل النشاط على الخريطة.

تحديد الفنادق على الخريطة

يمكنك ضبط الخصائص على الخريطة من خلال توفير كائن MapProperties أو كائن MapUiSettings للخصائص المتعلقة بواجهة المستخدم. يمكنك تعديل هذه العناصر لبدء إعادة تركيب الخريطة.

في المثال أدناه، استخدِم Switch، وهو مكوِّن تصميم متعدد الأبعاد، لتبديل عناصر التحكم في التكبير أو التصغير على الخريطة.

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

الخطوات التالية