تخصيص واجهة مستخدم Android

تتضمّن الفئة ConsumerMapStyle طريقتَي setter وgetter تتيحان لك تخصيص ديناميكي للعلامات والخطوط المتعددة. يتم عرض هذه الفئة بشكل غير متزامن باستخدام طريقة ConsumerController.getConsumerMapStyle().

يستمر تخصيص واجهة المستخدم في جميع عمليات تدوير الأجهزة ويظل ساريًا حتى يتم فصل ConsumerController.

العلامات المخصصة

طريقة إعداد نوع العلامة وخصائصها هي ConsumerMapStyle.setMarkerStyleOptions(). تلغي خيارات العلامة المخصّصة القيم التلقائية التي تقدّمها حزمة تطوير البرامج للمستهلك. لاستعادة القيم التلقائية، يجب استدعاء setMarkerStyleOptions() باستخدام قيمة فارغة للمعلَمة MarkerOptions. يمكنك استرداد عنصر MarkerOptions النشط باستخدام getMarkerStyleOptions().

أنواع العلامات

تتوفر العلامات التالية للتخصيص:

  • TRIP_PICKUP_POINT
  • TRIP_DROPOFF_POINT
  • TRIP_INTERMEDIATE_DESTINATION
  • TRIP_VEHICLE

يتم عرض TRIP_PICKUP_POINT وTRIP_DROPOFF_POINT أثناء مراقبة الرحلة.

يتم عرض TRIP_VEHICLE أثناء مراقبة الرحلة. لا يتغير رمز العلامة وفقًا لنوع المركبة الفعلي للرحلة. تُعدِّل حزمة تطوير البرامج (SDK) للمستهلكين دوران رمز TRIP_VEHICLE أثناء مراقبة الرحلة لمحاكاة سلوك المركبة الفعلية أثناء سيرها.

خيارات العلامات

الخصائص القابلة للتخصيص المتاحة لكل علامة هي مجموعة الخصائص التي تقدمها "خرائط Google" MarkerOptions.

تم تصميم MarkerOptions باستخدام الدالة الإنشائية الخاصة بها، ويتم تحديد الخصائص المخصصة باستخدام طرق نمط 'Setter'. ويتم توفير قيم تلقائية لكل موقع، لذا ستحتاج فقط إلى تحديد قيم مخصّصة.

يمكنك إيقاف محدّد الموقع عن طريق ضبط visible على false. يجب توفير بيانات كافية للسماح لك باستخدام عنصر واجهة المستخدم الخاص بك بدلاً منه.

مثال

Java

// Initializing marker options.
consumerController
    .getConsumerMapStyle()
    .addOnSuccessListener(
        consumerMapStyle -> {
          consumerMapStyle.setMarkerStyleOptions(
              MarkerType.TRIP_VEHICLE,
              new MarkerOptions()
                  .visible(false));
        });

// Reset marker options to default values.
consumerMapStyle.setMarkerStyleOptions(MarkerType.TRIP_VEHICLE, null);

Kotlin

// Initializing marker options.
consumerController
  .getConsumerMapStyle()
  .addOnSuccessListener({ consumerMapStyle ->
    consumerMapStyle.setMarkerStyleOptions(MarkerType.TRIP_VEHICLE, MarkerOptions().visible(false))
  })

// Reset marker options to default values.
consumerMapStyle.setMarkerStyleOptions(MarkerType.TRIP_VEHICLE, null)

خطوط متعدّدة مخصّصة

يتم ضبط تخصيص الخطوط المتعددة باستخدام الطريقة ConsumerMapStyle.setPolylineStyleOptions. يؤدي ضبط خيارات خطوط متعدّدة مخصّصة إلى إلغاء القيم التلقائية التي توفّرها حزمة تطوير البرامج (SDK) للمستهلك. يمكن استعادة القيم التلقائية عن طريق استدعاء setPolylineStyleOptions بقيمة فارغة للمعلَمة PolylineOptions. يمكن استرداد PolylineOptions النشطة باستخدام طريقة getPolylineStyleOptions.

أنواع الخطوط المتعددة

تتوفّر أنواع الخطوط المتعددة التالية للتخصيص:

  • ACTIVE_ROUTE
  • REMAINING_ROUTE

يتم عرض ACTIVE_ROUTE وREMAINING_ROUTE أثناء مراقبة الرحلة ويمثلان مسار المركبة.

خصائص الخطوط المتعددة

توفّر "خرائط Google" PolylineOptions السمات القابلة للتخصيص المتاحة لكل خطوط متعدّدة. تم تصميم PolylineOptions باستخدام الدالة الإنشائية الخاصة بها، ويتم تحديد الخصائص المخصصة باستخدام طرق نمط 'Setter'. ويتم توفير قيم افتراضية لكل خاصية، لذا ما عليك سوى تحديد قيم مخصصة. يمكنك إيقاف الخطوط المتعددة عن طريق ضبط visible على false.

مثال

Java

// Initializing polyline style options.
consumerController
    .getConsumerMapStyle()
    .addOnSuccessListener(
        consumerMapStyle -> {
          consumerMapStyle.setPolylineStyleOptions(
              PolylineType.ACTIVE_ROUTE,
              new PolylineOptions()
                  .visible(false));
        });

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null);

Kotlin

// Initializing polyline options.
consumerController
  .getConsumerMapStyle()
  .addOnSuccessListener({ consumerMapStyle ->
    consumerMapStyle.setPolylineStyleOptions(
      PolylineType.ACTIVE_ROUTE,
      PolylineOptions().visible(false)
    )
  })

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null)

المسار النشط والمتبقي

عند تفعيل "مستوى تقدّم الرحلة والطلبات"، يمكن لتطبيقك تخصيص تجربة المستخدم باستخدام الخطوط المتعددة التي تعرض مسار مركباتك ونشطًا وباقي الطلب.

المسار النشط هو المسار الذي تتحرك فيه المركبة حاليًا للوصول إلى نقطة الطريق التالية في رحلة المستهلك النشطة. المسار المتبقي هو المسار الذي ستسلكه المركبة بعد المسار النشط. عندما تكون نقطة الطريق النشطة هي آخر نقطة طريق للرحلة، فإن المسار المتبقي غير موجود.

يمكن تخصيص الخطوط المتعددة النشطة والخطوط المتعددة المتبقية والتحكّم في مستوى عرضها من خلال تطبيقك. ويكون المسار النشط مرئيًا بشكل تلقائي ولا يكون المسار المتبقي مرئيًا.

مثال

Java

// Initializing polyline options.
consumerController
    .getConsumerMapStyle()
    .addOnSuccessListener(
        consumerMapStyle -> {
          consumerMapStyle.setPolylineStyleOptions(
              PolylineType.ACTIVE_ROUTE,
              new PolylineOptions()
                  .color(Color.BLUE));
          consumerMapStyle.setPolylineStyleOptions(
              PolylineType.REMAINING_ROUTE,
              new PolylineOptions()
                  .color(Color.BLACK)
                  .width(5)
                  .visible(true));
        });

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null);
consumerMapStyle.setPolylineStyleOptions(PolylineType.REMAINING_ROUTE, null);

Kotlin

// Initializing polyline options.
consumerController
  .getConsumerMapStyle()
  .addOnSuccessListener({ consumerMapStyle ->
    {
      consumerMapStyle.setPolylineStyleOptions(
        PolylineType.ACTIVE_ROUTE,
        PolylineOptions().color(Color.BLUE)
      )

      consumerMapStyle.setPolylineStyleOptions(
        PolylineType.REMAINING_ROUTE,
        PolylineOptions().color(Color.BLACK).width(5).visible(true)
      )
    }
  })

// Reset polyline options to default values.
consumerMapStyle.setPolylineStyleOptions(PolylineType.ACTIVE_ROUTE, null)

consumerMapStyle.setPolylineStyleOptions(PolylineType.REMAINING_ROUTE, null)

الخطوط المتعددة الواعية بالزيارات

تكون طبقة حركة المرور في الخط المتعدد غير مفعّلة بشكلٍ تلقائي. عند تفعيل هذه الميزة، يتم رسم الأجزاء التي تمثّل الامتدادات غير العادية للزيارات فوق الخطوط المتعددة للمسار في مؤشر z-index PolylineOptions.getZIndex()، بالإضافة إلى إزاحة اعتمادًا على حالة حركة المرور.

يتم تمثيل أحوال حركة المرور على أنّها أحد أنواع السرعة الأربعة. يمكنك تخصيص اللون لكل نوع سرعة.

لتفعيل "الخطوط المتعددة المرتبطة برصد الزيارات"، يجب إنشاء عنصر TrafficStyle والذي سيتم تمريره بعد ذلك إلى ConsumerMapStyle من خلال استدعاء setPolylineTrafficStyle().

مثال

Java

// TrafficStyle is part of the Consumer SDK.
TrafficStyle trafficStyle = TrafficStyle.builder()
  .setTrafficVisibility(true)
  .setTrafficColor(SpeedType.NO_DATA, Color.GREY)
  .setTrafficColor(SpeedType.NORMAL_VALUE, Color.BLUE)
  .setTrafficColor(SpeedType.SLOW_VALUE, Color.ORANGE)
  .setTrafficColor(SpeedType.TRAFFIC_JAM, Color.RED)
  .build();

consumerMapStyle.setPolylineTrafficStyle(PolylineType.ACTIVE_ROUTE, trafficStyle);

Kotlin

// TrafficStyle is part of the Consumer SDK.
val trafficStyle =
  TrafficStyle.builder()
    .setTrafficVisibility(true)
    .setTrafficColor(SpeedType.NO_DATA, Color.GREY)
    .setTrafficColor(SpeedType.NORMAL_VALUE, Color.BLUE)
    .setTrafficColor(SpeedType.SLOW_VALUE, Color.ORANGE)
    .setTrafficColor(SpeedType.TRAFFIC_JAM, Color.RED)
    .build()

consumerMapStyle.setPolylineTrafficStyle(PolylineType.ACTIVE_ROUTE, trafficStyle)

ضبط تكبير/تصغير الكاميرا للتركيز على رحلة

يعمل زر "موقعي الجغرافي" التلقائي المُضمَّن في حزمة تطوير البرامج (SDK) للخرائط على توسيط الكاميرا على الموقع الجغرافي للجهاز. إذا كانت هناك جلسة نشطة حول مسار "رحلة الطلب" و"مستوى تقدّم الطلب"، قد يكون من الأفضل توسيط الكاميرا للتركيز على الرحلة بدلاً من الموقع الجغرافي للجهاز.

حزمة تطوير البرامج (SDK) للمستهلكين لنظام Android المضمَّن: Autocam

ولتتمكّن من التركيز على الرحلة بدلاً من الموقع الجغرافي للجهاز، توفّر حزمة تطوير البرامج (SDK) للمستهلكين ميزة Auto Camera تكون مفعَّلة تلقائيًا. يتم تكبير الكاميرا للتركيز على مسار تقدم الرحلة والطلبات ونقطة الطريق التالية.

تخصيص سلوك الكاميرا

إذا كنت بحاجة إلى المزيد من التحكّم في سلوك الكاميرا، يمكنك إيقاف الكاميرا التلقائية أو تفعيلها باستخدام ConsumerController.setAutoCameraEnabled().

تعرض أداة ConsumerController.getCameraUpdate() حدود الكاميرا المقترَحة في الوقت الحالي. يمكنك بعد ذلك تقديم CameraUpdate هذا كوسيطة إلى GoogleMap.moveCamera() أو GoogleMap.animateCamera().