يوضّح هذا الدليل الطرق التي يمكنك من خلالها تخصيص الخريطة التي تظهر في تطبيق Android عند تتبُّع رحلة. يمكنك تخصيص شكل الخريطة وأسلوبها بالطرق التالية:
- تصميم الخريطة باستخدام ميزة "تصميم الخرائط" المستندة إلى السحابة الإلكترونية
- ضبط الكاميرا للتركيز على الرحلة
- تخصيص العلامات
- تخصيص الخطوط المتعددة
تصميم الخريطة باستخدام ميزة "تصميم الخرائط" المستندة إلى السحابة الإلكترونية
يمكنك تخصيص شكل مكوّن الخرائط ومظهره باستخدام ميزة "تصميم الخرائط" المستندة إلى السحابة الإلكترونية. يمكنك إنشاء أنماط الخرائط وتعديلها على Google Cloud Console لأي من تطبيقاتك التي تستخدم "خرائط Google"، بدون الحاجة إلى إجراء أي تغييرات على الرمز البرمجي. لمزيد من المعلومات، يُرجى الاطّلاع على تصميم الخرائط المستنِد إلى السحابة الإلكترونية.
تتيح كلتا الفئتَين
ConsumerMapView
و
ConsumerMapFragment
تصميم الخرائط المستنِد إلى السحابة الإلكترونية.
لاستخدام ميزة تصميم الخرائط المستندة إلى السحابة الإلكترونية، تأكَّد من أنّ LATEST
هو مُنشئ LATEST
الذي تم اختياره. تعرض الأقسام التالية أمثلة على كيفية استخدام
تنسيق الخرائط المستندة إلى السحابة الإلكترونية مع مشروعك.
ConsumerMapView
لاستخدام تنسيق الخرائط المستندة إلى السحابة الإلكترونية في ConsumerMapView
، اضبط الحقل
mapId
على GoogleMapOptions
وأرسِل GoogleMapOptions
إلى
getConsumerGoogleMapAsync(ConsumerMapReadyCallback, Fragment,
GoogleMapOptions)
أو getConsumerGoogleMapAsync(ConsumerMapReadyCallback, FragmentActivity,
GoogleMapOptions).
مثال
Java
public class SampleAppActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
ConsumerMapView mapView = findViewById(R.id.consumer_map_view);
if (mapView != null) {
GoogleMapOptions optionsWithMapId = new GoogleMapOptions().mapId("map-id");
mapView.getConsumerGoogleMapAsync(
new ConsumerMapReadyCallback() {
@Override
public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
// ...
}
},
/* fragmentActivity= */ this,
/* googleMapOptions= */ optionsWithMapId);
}
}
}
Kotlin
class SampleAppActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
val mapView = findViewById(R.id.consumer_map_view) as ConsumerMapView
val optionsWithMapId = GoogleMapOptions().mapId("map-id")
mapView.getConsumerGoogleMapAsync(
object : ConsumerGoogleMap.ConsumerMapReadyCallback() {
override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
// ...
}
},
/* fragmentActivity= */ this,
/* googleMapOptions= */ optionsWithMapId)
}
}
ConsumerMapFragment
هناك طريقتان لاستخدام ميزة تصميم الخرائط المستندة إلى السحابة الإلكترونية في علامة تشكل ConsumerMapFragments:
- بشكل ثابت مع ملف XML
- ديناميكيًا باستخدام
newInstance
بشكل ثابت مع ملف XML
لاستخدام تنسيق الخرائط المستندة إلى السحابة الإلكترونية مع ملف XML في
ConsumerMapFragment
، أضِف سمة XML map:mapId
مع
mapId
المحدّد. انظر المثال التالي:
<fragment
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map="http://schemas.android.com/apk/res-auto"
android:name="com.google.android.libraries.mapsplatform.transportation.consumer.view.ConsumerMapFragment"
android:id="@+id/consumer_map_fragment"
map:mapId="map-id"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
ديناميكيًا باستخدام newInstance
لاستخدام تصميم الخرائط المستندة إلى السحابة الإلكترونية مع newInstance
في
ConsumerMapFragment
، اضبط الحقل mapId
على GoogleMapOptions
وأرسِل
GoogleMapOptions
إلى newInstance
. انظر المثال التالي:
Java
public class SampleFragmentJ extends Fragment {
@Override
public View onCreateView(
@NonNull LayoutInflater inflater,
@Nullable ViewGroup container,
@Nullable Bundle savedInstanceState) {
final View view = inflater.inflate(R.layout.consumer_map_fragment, container, false);
GoogleMapOptions optionsWithMapId = new GoogleMapOptions().mapId("map-id");
ConsumerMapFragment consumerMapFragment = ConsumerMapFragment.newInstance(optionsWithMapId);
getParentFragmentManager()
.beginTransaction()
.add(R.id.consumer_map_fragment, consumerMapFragment)
.commit();
consumerMapFragment.getConsumerGoogleMapAsync(
new ConsumerMapReadyCallback() {
@Override
public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
// ...
}
});
return view;
}
}
Kotlin
class SampleFragment : Fragment() {
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?): View? {
val view = inflater.inflate(R.layout.consumer_map_fragment, container, false)
val optionsWithMapId = GoogleMapOptions().mapId("map-id")
val consumerMapFragment = ConsumerMapFragment.newInstance(optionsWithMapId)
parentFragmentManager
.beginTransaction()
.add(R.id.consumer_map_fragment, consumerMapFragment)
.commit()
consumerMapFragment.getConsumerGoogleMapAsync(
object : ConsumerMapReadyCallback() {
override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
// ...
}
})
return view
}
}
تعديل مستوى تكبير/تصغير الكاميرا للتركيز على رحلة
أثناء جلسة مشاركة رحلة نشطة، يمكنك استخدام ميزة تكبير/تصغير الكاميرا و التركيز بها بطريقتَين:
AutoCamera
: إذا أردت استخدامAutoCamera
، ليس عليك اتخاذ أي إجراء. تتّبع الكاميرا الرحلة. للاطّلاع على التفاصيل، يُرجى الاطّلاع علىAutoCamera
.تخصيص سلوك الكاميرا: لتخصيص سلوك الكاميرا، يجب إيقاف
AutoCamera
ثم إجراء عمليات التخصيص. لمعرفة التفاصيل، يُرجى الاطّلاع على تخصيص سلوك الكاميرا.
AutoCamera
تضع الكاميرا في المنتصف
توفّر حزمة Consumer SDK ميزة AutoCamera
تكون مفعّلة تلقائيًا
في الزرّ المضمّن موقعي الجغرافي لحزمة تطوير البرامج (SDK) لتطبيق "خرائط Google". تكبِّر الكاميرا الشاشة لشدّ التركيز على مسار الرحلة ونقطة التوقف التالية في الرحلة.
إذا أردت استخدام AutoCamera
، احرص على تفعيله. لمزيد من التفاصيل، يُرجى الاطّلاع على isAutoCameraEnabled
.
للاطّلاع على تفاصيل عن الزر موقعي الجغرافي، اطّلِع على زر "موقعي الجغرافي" في مستندات واجهة برمجة التطبيقات Maps JavaScript API.
تخصيص سلوك الكاميرا
لمزيد من التحكّم في سلوك الكاميرا، اتّبِع الخطوات التالية لإيقاف
AutoCamera
وتخصيص سلوك الكاميرا يدويًا.
أوقِف
AutoCamera
باستخدام ConsumerController.setAutoCameraEnabled().يمكنك الحصول على حدود الكاميرا المقترَحة باستخدام ConsumerController.getCameraUpdate().
قدِّم
CameraUpdate
كوسيطة لواحدة من دوال Android التالية: