کلاس ConsumerMapStyle
دارای متدهای تنظیم کننده و دریافت کننده است که سفارشی سازی پویا را برای نشانگرها و چند خط به شما ارائه می دهد. این کلاس به صورت ناهمزمان با استفاده از متد ConsumerController.getConsumerMapStyle()
نمایش داده می شود.
سفارشیسازی UI در تمام چرخشهای دستگاه ادامه دارد و تا زمانی که ConsumerController
جدا نشود به قوت خود باقی میماند.
نشانگرهای سفارشی
روش تنظیم نوع نشانگر و خصوصیات آن ConsumerMapStyle.setMarkerStyleOptions()
است. گزینه های نشانگر سفارشی شما مقادیر پیش فرض ارائه شده توسط Consumer SDK را لغو می کند. برای بازیابی مقادیر پیش فرض، setMarkerStyleOptions()
را با استفاده از null برای پارامتر MarkerOptions
فراخوانی کنید. MarkerOptions
فعال را با استفاده از getMarkerStyleOptions()
بازیابی کنید.
انواع نشانگر
نشانگرهای زیر برای سفارشی سازی در دسترس هستند:
-
TRIP_PICKUP_POINT
-
TRIP_DROPOFF_POINT
-
TRIP_INTERMEDIATE_DESTINATION
-
TRIP_VEHICLE
نمایش TRIP_PICKUP_POINT
و TRIP_DROPOFF_POINT
در حین نظارت بر سفر.
TRIP_VEHICLE
در حین نظارت بر سفر نمایش داده می شود. نماد نشانگر با توجه به نوع وسیله نقلیه واقعی برای سفر تغییر نمی کند. Consumer SDK چرخش نماد TRIP_VEHICLE
را در حین نظارت بر سفر بهروزرسانی میکند تا رفتار خودروی واقعی را در حین حرکت در مسیر تقلید کند.
گزینه های نشانگر
ویژگی های قابل تنظیم موجود برای هر نشانگر مجموعه ای از ویژگی های ارائه شده توسط Google Maps MarkerOptions
است.
MarkerOptions
با استفاده از سازنده آن ساخته میشود و ویژگیهای سفارشیشده با استفاده از روشهای سبک «Setter» مشخص میشوند. مقادیر پیش فرض برای هر ویژگی ارائه شده است، بنابراین شما فقط باید مقادیر سفارشی را مشخص کنید.
میتوانید با تنظیم visible
false
، نشانگر را خاموش کنید. داده های کافی باید ارائه شود تا بتوانید از عنصر UI خود در جای خود استفاده کنید.
مثال
جاوا
// 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);
کاتلین
// 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)
چند خط سفارشی
سفارشی سازی Polyline با استفاده از روش ConsumerMapStyle.setPolylineStyleOptions
تنظیم می شود. تنظیم گزینه های چند خط سفارشی، مقادیر پیش فرض ارائه شده توسط Consumer SDK را لغو می کند. مقادیر پیش فرض را می توان با فراخوانی setPolylineStyleOptions
با null برای پارامتر PolylineOptions
بازیابی کرد. PolylineOptions
فعال را می توان با استفاده از روش getPolylineStyleOptions
بازیابی کرد.
انواع پلی لاین
انواع چند خط زیر برای سفارشی سازی در دسترس هستند:
-
ACTIVE_ROUTE
-
REMAINING_ROUTE
ACTIVE_ROUTE
و REMAINING_ROUTE
در حین نظارت بر سفر نمایش داده میشوند و مسیر خودرو را نشان میدهند.
ویژگی های پلی لاین
ویژگی های قابل سفارشی سازی موجود برای هر چند خط توسط Google Maps PolylineOptions
ارائه شده است. PolylineOptions
با استفاده از سازنده آن ساخته میشود و ویژگیهای سفارشیشده با استفاده از روشهای سبک «Setter» مشخص میشوند. مقادیر پیش فرض برای هر ویژگی ارائه شده است، بنابراین شما فقط باید مقادیر سفارشی را مشخص کنید. میتوانید با تنظیم visible
روی false
، چند خط را خاموش کنید.
مثال
جاوا
// 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);
کاتلین
// 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)
مسیر فعال و باقی مانده
با فعال بودن Trip and Order Progress، برنامه شما می تواند تجربه کاربر را با استفاده از چند خطی که وسایل نقلیه شما را فعال و مسیر باقی مانده را نشان می دهد، سفارشی کند.
مسیر فعال مسیری است که وسیله نقلیه در حال حاضر برای رسیدن به ایستگاه بعدی در سفر فعال مصرف کننده طی می کند. مسیر باقی مانده مسیری است که وسیله نقلیه از مسیر فعال عبور می کند. زمانی که نقطه بین مسیر فعال آخرین نقطه بین سفر باشد، مسیر باقیمانده وجود ندارد.
چند خطوط فعال و باقیمانده را می توان سفارشی کرد و قابلیت مشاهده توسط برنامه شما کنترل می شود. به طور پیش فرض مسیر فعال قابل مشاهده است و مسیر باقی مانده قابل مشاهده نیست.
مثال
جاوا
// 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);
کاتلین
// 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
بسازید که سپس با فراخوانی setPolylineTrafficStyle()
به ConsumerMapStyle
ارسال میشود.
مثال
جاوا
// 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);
کاتلین
// 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)
تنظیم زوم دوربین برای تمرکز بر یک سفر
دکمه پیشفرض My Location که در Maps SDK تعبیه شده است، دوربین را روی مکان دستگاه متمرکز میکند. اگر جلسه پیشرفت سفر و سفارش فعال است، ممکن است بخواهید دوربین را در مرکز قرار دهید تا به جای مکان دستگاه، روی سفر تمرکز کند.
راه حل داخلی SDK مصرف کننده برای Android: AutoCamera
برای اینکه بتوانید به جای مکان دستگاه روی سفر تمرکز کنید، Consumer SDK یک ویژگی AutoCamera را ارائه می دهد که به طور پیش فرض فعال است. دوربین زوم میکند تا روی مسیر پیشرفت سفر و سفارش و ایستگاه بعدی سفر فوکوس کند.
سفارشی کردن رفتار دوربین
اگر به کنترل بیشتری بر رفتار دوربین نیاز دارید، میتوانید AutoCamera را با استفاده از ConsumerController.setAutoCameraEnabled()
غیرفعال یا فعال کنید.
ConsumerController.getCameraUpdate()
محدوده های توصیه شده دوربین را در آن لحظه برمی گرداند. سپس می توانید این CameraUpdate
به عنوان یک آرگومان برای GoogleMap.moveCamera()
یا GoogleMap.animateCamera()
ارائه دهید.
طراحی نقشه های مبتنی بر ابر
هر دو کلاس ConsumerMapView
و ConsumerMapFragment
از طراحی نقشه های مبتنی بر ابر پشتیبانی می کنند. به منظور استفاده از طرحبندی نقشههای مبتنی بر ابر، مطمئن شوید که رندر نقشه انتخابشده LATEST
است. مثالهای زیر نشان میدهند که چگونه میتوانید از طراحی نقشههای مبتنی بر ابر در پروژه خود استفاده کنید.
ConsumerMapView
برای استفاده از طرحبندی نقشههای مبتنی بر ابر در ConsumerMapView
، فیلد mapId
را در GoogleMapOptions
تنظیم کنید و GoogleMapOptions
به getConsumerGoogleMapAsync(ConsumerMapReadyCallback، Fragment، GoogleMapOptions) یا getConsumerGoogleMapAsync(ConsumerConsumerCallback,FragdyConsumerCallback) ارسال کنید.
مثال
جاوا
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);
}
}
}
کاتلین
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
، ویژگی map:mapId
XML را با 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
منتقل کنید. مثال زیر را ببینید:
جاوا
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;
}
}
کاتلین
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
}
}