باستخدام حزمة SDK للتنقل لنظام Android، يمكنك تعديل تجربة المستخدم مع الخريطة من خلال تحديد عناصر التحكم والعناصر المدمجة في واجهة المستخدم التي تظهر على الخريطة. يمكنك أيضًا ضبط المظهر المرئي لواجهة مستخدم التنقل. راجِع صفحة "السياسات" للاطّلاع على إرشادات حول التعديلات المقبولة على واجهة مستخدم التنقّل.
يصف هذا المستند كيفية تعديل واجهة مستخدم الخريطة بطريقتين:
عناصر التحكّم في واجهة المستخدم للخريطة
تقع عناصر التحكم في واجهة المستخدم للخريطة أعلى عرض التنقل. تعمل حزمة تطوير البرامج (SDK) للتنقل لنظام التشغيل Android على تغيير موضع عناصر التحكّم المخصّصة تلقائيًا عند تغيُّر التنسيق المضمَّن. ويمكنك ضبط عنصر تحكّم مخصّص واحد لكل موضع من مواضع التخطيط. يمكن أن يكون عنصر التحكّم المخصّص عنصرًا واحدًا في واجهة المستخدم، أو إذا كان تصميمك يتطلّب المزيد، يمكنك استخدام ViewGroup
مع عدة عناصر واجهة مستخدم.
توفّر طريقة setCustomControl
مواضع على النحو المحدّد في تعداد CustomControlPosition
:
SECONDARY_HEADER
(يظهر في وضع "بورتريه" فقط)BOTTOM_START_BELOW
BOTTOM_END_BELOW
على سبيل المثال، تعرض الصور أدناه أمثلة على مواضع مختلفة لعنصر تحكم في واجهة المستخدم تخبر سائق مشاركة الرحلات بموقع الراكب أثناء عملية الركوب.
إضافة عنوان ثانوي مخصّص
بشكل افتراضي، توفر تخطيطات الشاشة في وضع التنقل موضعًا لعنوان ثانوي موجود أسفل العنوان الأساسي. ويظهر هذا العنوان الثانوي عند الضرورة، كما هو الحال مع إرشادات الممرات. يمكن لتطبيقك استخدام موضع العنوان الثانوي هذا للتخطيط للمحتوى المخصص. عند استخدام هذه الميزة، يغطي عنصر التحكم أي محتوى رأس ثانوي افتراضي. إذا كان عرض التنقل الخاص بك يحتوي على خلفية، تظل تلك الخلفية في مكانها، ويغطيها العنوان الثانوي. عندما يزيل تطبيقك عنصر التحكّم المخصّص، يمكن أن يظهر أيّ عنوان ثانوي تلقائي بدلاً منه.
يعمل موضع العنوان الثانوي المخصص على محاذاة الحافة العلوية مع الحافة السفلية للرأس الأساسي. لا يتوفّر هذا الموضع إلا في portrait mode
. في
landscape mode
، يكون الرأس الثانوي غير متاح، ولا
يتغير التنسيق.
- أنشئ طريقة عرض Android باستخدام عنصر واجهة المستخدم المخصّصة أو ViewGroup.
- يمكنك تضخيم XML أو إنشاء مثيل للعرض المخصّص للحصول على مثيل للعرض لإضافته باعتباره عنوانًا ثانويًا.
استخدِم
NavigationView.setCustomControl
أوSupportNavigationFragment.setCustomControl
مع CustomControlPosition كالثاني فيARY_Header.ينشئ المثال أدناه جزءًا ويضيف عنصر تحكُّم مخصّصًا في موضع العنوان الثانوي.
mNavFragment.setCustomControl(getLayoutInflater(). inflate(R.layout.your_custom_control, null), CustomControlPosition.SECONDARY_HEADER); ```
إزالة عنوان ثانوي
لإزالة العنوان الثانوي والرجوع إلى المحتوى التلقائي، استخدِم الطريقة setCustomControl
.
اضبط العرض على null
لإزالة طريقة العرض.
mNavFragment.setCustomControl(null, CustomControlPosition.SECONDARY_HEADER);
إضافة عنصر تحكّم مخصّص أسفل طريقة عرض التنقّل
يمكن لتطبيقك تحديد عنصر تحكّم مخصّص تتماشى مع الحافة السفلى لعرض التنقّل. عندما يضيف تطبيقك عنصر تحكم مخصصًا، يتحرك زر إعادة التوسيط وشعار Google إلى أعلى لاستيعابه.
- أنشئ طريقة عرض Android باستخدام عنصر واجهة المستخدم أو مجموعة العرض التي تريد إضافتها.
- أنشئ عرض التنقل أو الجزء.
- وعليك استدعاء الطريقة
setCustomControl
في طريقة عرض التنقّل أو الجزء فيه وتحديد عنصر التحكّم والموضع المطلوب استخدامه.
يعرض المثال التالي سمة View
مخصّصة تمت إضافتها إلى SupportNavigationFragment
:
private SupportNavigationFragment mNavFragment;
mNavFragment = (SupportNavigationFragment)
getFragmentManager().findFragmentById(R.id.navigation_fragment);
// Create the custom control view.
MyCustomView myCustomView = new MyCustomView();
// Add the custom control to the bottom end corner of the layout.
mNavFragment.setCustomControl(myCustomView, CustomControlPosition.
BOTTOM_END_BELOW);
إزالة عنصر تحكّم مخصّص
لإزالة عنصر التحكّم المخصّص، استخدِم الطريقة setCustomControl
وحدِّد
موضع عنصر التحكّم الذي تريد إزالته.
اضبط العرض على null
لهذا الموضع.
mNavFragment.setCustomControl(null, CustomControlPosition.BOTTOM_END_BELOW);
ملحقات واجهة المستخدم للخريطة
توفر حزمة SDK للتنقل لنظام التشغيل Android ملحقات واجهة المستخدم التي تظهر أثناء التنقل على نحو مشابه لتلك الموجودة في تطبيق خرائط Google لنظام التشغيل Android. ويمكنك ضبط مستوى الرؤية أو المظهر المرئي لعناصر التحكّم هذه كما هو موضّح في هذا القسم. تظهر التغييرات التي تجريها هنا خلال جلسة التنقل التالية.
راجِع صفحة "السياسات" للحصول على إرشادات حول التعديلات المقبولة على واجهة مستخدم التنقّل.
عرض الرمز
تعديل عنوان التنقل
استخدِم
SupportNavigationFragment.setStylingOptions()
أو
NavigationView.setStylingOptions()
لتغيير مظهر عنوان التنقّل ومؤشر الانعطاف التالي
الذي يظهر أسفل العنوان عند توفّره.
يمكنك ضبط السمات التالية:
نوع السمة | السمات |
---|---|
لون الخلفية |
|
العناصر النصية للتعليمات |
|
العناصر النصية للخطوات التالية |
|
رموز المناورة |
|
إرشادات الممرات |
|
يوضح المثال التالي كيفية ضبط خيارات التصميم:
private SupportNavigationFragment mNavFragment;
mNavFragment = (SupportNavigationFragment) getFragmentManager()
.findFragmentById(R.id.navigation_fragment);
// Set the styling options on the fragment.
mNavFragment.setStylingOptions(new StylingOptions()
.primaryDayModeThemeColor(0xff1A237E)
.secondaryDayModeThemeColor(0xff3F51B5)
.primaryNightModeThemeColor(0xff212121)
.secondaryNightModeThemeColor(0xff424242)
.headerLargeManeuverIconColor(0xffffff00)
.headerSmallManeuverIconColor(0xffffa500)
.headerNextStepTypefacePath("/system/fonts/NotoSerif-BoldItalic.ttf")
.headerNextStepTextColor(0xff00ff00)
.headerNextStepTextSize(20f)
.headerDistanceTypefacePath("/system/fonts/NotoSerif-Italic.ttf")
.headerDistanceValueTextColor(0xff00ff00)
.headerDistanceUnitsTextColor(0xff0000ff)
.headerDistanceValueTextSize(20f)
.headerDistanceUnitsTextSize(18f)
.headerInstructionsTypefacePath("/system/fonts/NotoSerif-BoldItalic.ttf")
.headerInstructionsTextColor(0xffffff00)
.headerInstructionsFirstRowTextSize(24f)
.headerInstructionsSecondRowTextSize(20f)
.headerGuidanceRecommendedLaneColor(0xffffa500));
إيقاف طبقة حركة المرور
يمكنك استخدام
GoogleMap.setTrafficEnabled()
لتفعيل طبقة حركة المرور على الخريطة أو إيقافها. يؤثر هذا الإعداد في مؤشرات كثافة حركة المرور
المعروضة على الخريطة ككل. ومع ذلك، فإنه لا يؤثر في مؤشرات حركة المرور على المسار الذي رسمه المستكشف.
private GoogleMap mMap;
// Get the map, and when the async call returns, setTrafficEnabled
// (callback will be on the UI thread)
mMap = mNavFragment.getMapAsync(navMap -> navMap.setTrafficEnabled(false));
تفعيل إشارات المرور ولافتات الوقوف
يمكنك تفعيل إشارات المرور وإيقاف إشارات المرور في واجهة مستخدم الخريطة. وباستخدام هذه الميزة، يمكن للمستخدم تفعيل عرض إشارات المرور أو رموز لافتات التوقف على طول مساره، ما يوفّر سياقًا أفضل للرحلات الأكثر كفاءة ودقة.
يتم إيقاف إشارات المرور وإشارات التوقف بشكل افتراضي في
حزمة SDK للتنقل. لتفعيل هذه الميزة، يمكنك استدعاء
DisplayOptions
لكل ميزة على حدة.
DisplayOptions displayOptions =
new DisplayOptions().showTrafficLights(true).showStopSigns(true);
إضافة علامات مخصصة
تستخدم حزمة تطوير البرامج (SDK) للتنقل لنظام التشغيل Android الآن واجهات برمجة التطبيقات لخرائط Google في العلامات. انتقل إلى وثائق واجهة برمجة تطبيقات الخرائط للحصول على مزيد من المعلومات.
نص عائم
يمكنك إضافة نص عائم في أي مكان في تطبيقك، بشرط ألا يغطّي إحالة Google. لا تدعم حزمة SDK للتنقل تثبيت النص بخط عرض/خط طول على الخريطة أو بتسمية. انتقِل إلى نوافذ المعلومات للاطّلاع على المزيد من المعلومات.
عرض الحد الأقصى للسرعة
يمكنك إظهار رمز حد السرعة أو إخفاؤه آليًا. يمكنك استخدام
NavigationView.setSpeedLimitIconEnabled()
أو
SupportNavigationFragment.setSpeedLimitIconEnabled()
لعرض رمز حد السرعة أو إخفائه. عند تفعيل هذه الميزة، يظهر رمز حد السرعة
في الزاوية السفلية أثناء التوجيه. تعرض الأيقونة حد سرعة
الطريق التي تسير عليها المركبة. لا تظهر الأيقونة إلا في المواقع التي
توفر فيها بيانات موثوقة عن حد السرعة.
// عرض رمز الحد الأقصى للسرعة mNavFragment.setSpeedLimitIconEnabled(true)
يكون رمز حد السرعة مخفيًا مؤقتًا عند عرض زر إعادة التوسيط.
ضبط "الوضع الليلي"
يمكنك التحكّم آليًا في سلوك "الوضع الليلي". يمكنك استخدام
NavigationView.setForceNightMode()
أو
SupportNavigationFragment.setForceNightMode()
لتفعيل "الوضع الليلي" أو إيقافه، أو اسمح لـ "حزمة تطوير البرامج (SDK) للتنقل" لنظام التشغيل Android
بالتحكّم فيه.
AUTO
: تسمح هذه الميزة لحزمة تطوير البرامج (SDK) للتنقّل بتحديد الوضع المناسب وفقًا للموقع الجغرافي للجهاز والتوقيت المحلي.- يفرض
FORCE_NIGHT
تفعيل "الوضع الليلي". - يفرض
FORCE_DAY
تفعيل وضع اليوم.
يوضّح المثال التالي فرض تفعيل "الوضع الليلي" ضمن أحد أجزاء التنقّل:
// Force night mode on.
mNavFragment.setForceNightMode(FORCE_NIGHT);
عرض قائمة الاتجاهات
أولاً، أنشئ طريقة العرض وأضِفها إلى التسلسل الهرمي.
void setupDirectionsListView() {
// Create the view.
DirectionsListView directionsListView = new DirectionsListView(getApplicationContext());
// Add the view to your view hierarchy.
ViewGroup group = findViewById(R.id.directions_view);
group.addView(directionsListView);
// Add a button to your layout to close the directions list view.
ImageButton button = findViewById(R.id.close_directions_button); // this button is part of the container we hide in the next line.
button.setOnClickListener(
v -> findViewById(R.id.directions_view_container).setVisibility(View.GONE));
}
احرص على إعادة توجيه أحداث دورة الحياة إلى DirectionsListView
تمامًا كما هي مع NavigationView
. مثلاً:
protected void onResume() {
super.onResume();
directionsListView.onResume();
}
إخفاء المسارات البديلة
عندما تصبح واجهة المستخدم مزدحمة بكثير من المعلومات، يمكنك تقليل الفوضى من خلال عرض مسارات بديلة أقل من المسارات التلقائية (الطريقتان)، أو من خلال عدم عرض أي مسارات بديلة على الإطلاق. يمكنك ضبط هذا الخيار قبل استرجاع المسارات من خلال استدعاء طريقة RoutingOptions.alternateRoutesStrategy()
باستخدام إحدى قيم التعداد التالية:
قيمة التعداد | الوصف |
---|---|
AlternateRoutesStrategy.SHOW_ALL | تلقائي: تعرض ما يصل إلى مسارين بديلين. |
AlternateRoutesStrategy.SHOW_ONE | تعرض مسارًا بديلاً واحدًا (إذا كان متاحًا). |
AlternateRoutesStrategy.SHOW_NONE | لإخفاء المسارات البديلة. |
يوضح مثال التعليمة البرمجية التالي كيفية إخفاء المسارات البديلة تمامًا.
RoutingOptions routingOptions = new RoutingOptions();
routingOptions.alternateRoutesStrategy(AlternateRoutesStrategy.SHOW_NONE);
navigator.setDestinations(destinations, routingOptions, displayOptions);
شريط تقدم الرحلة
شريط تقدم الرحلة هو شريط رأسي يظهر على الحافة اليمنى اللاحقة من الخريطة عند بدء التنقل. عند تفعيل هذه الميزة، تعرض نظرة عامة لرحلة كاملة، إلى جانب وجهة المستخدم وموقعه الحالي.
توفر للمستخدمين القدرة على توقع أي مشكلات قادمة بسرعة، مثل حركة المرور، دون الحاجة إلى التكبير. ويمكنهم بعد ذلك تغيير مسار الرحلة إذا لزم الأمر. إذا غيّر المستخدم مسار الرحلة، تتم إعادة ضبط شريط التقدّم كما لو كانت رحلة جديدة قد بدأت من تلك النقطة.
يعرض شريط تقدّم الرحلة مؤشرات الحالة التالية:
المسار المنقضي - الجزء المنقضي من الرحلة.
الموضع الحالي: الموقع الجغرافي الحالي للمستخدم في الرحلة
حالة الزيارات: وهي حالة الزيارات القادمة.
الوجهة النهائية: وجهة الرحلة النهائية.
يمكنك تفعيل شريط تقدم الرحلة من خلال استدعاء طريقة setTripProgressBarEnabled()
على
NavigationView
أو
SupportNavigationFragment.
مثلاً:
// Enable the trip progress bar.
mNavFragment.setTripProgressBarEnabled(true);