หากต้องการติดตามการเดินทางในแอปสำหรับผู้บริโภค ก่อนอื่นคุณต้องกำหนด แผนที่และเพิ่มการสนับสนุนแผนที่เวกเตอร์ หากจำเป็น
หากต้องการตั้งค่าแผนที่ในแอป ให้ทำตามขั้นตอนต่อไปนี้
- กำหนดส่วนย่อยของแผนที่สำหรับการแชร์เส้นทาง
- เพิ่มการรองรับเลเยอร์ฐานของแผนที่และมุมมองตัวควบคุม
- เพิ่มการสนับสนุนกราฟิกเวกเตอร์ของ Android เพื่อแสดงเวกเตอร์ แผนที่ หากจำเป็น
หลังจากกำหนดแผนที่แล้ว คุณสามารถเพิ่มมุมมองและกล้องเพิ่มเติมได้ ที่คุณต้องการปรับแต่งประสบการณ์การมองเห็น สำหรับรายละเอียดเพิ่มเติม ดูจัดรูปแบบแผนที่
ขั้นตอนที่ 1: กำหนดส่วนย่อยของแผนที่สำหรับการแชร์เส้นทาง
คุณสามารถกำหนดแผนที่โดยเพิ่มส่วนย่อยหรือมุมมองของแผนที่เพื่อสร้างแผนที่ที่ คุณแชร์การเดินทางแบบออนดีมานด์ในแอปผู้บริโภค หากต้องการระบุแผนที่ ให้ทำตามวิธีใดวิธีหนึ่งต่อไปนี้
ConsumerMapFragment
: ใช้เพื่อกำหนดแผนที่ของคุณด้วยFragment
ConsumerMapView
: ใช้เพื่อกำหนดแผนที่ด้วยView
แต่ละวิธีจะเหมือนกัน คุณจึงเลือกวิธีการใดก็ได้ เหมาะกับแอปพลิเคชันของคุณมากกว่า
เราจะอธิบายทั้งสองวิธีโดยละเอียดยิ่งขึ้นในหัวข้อต่อไปนี้
เพิ่มส่วนย่อยหรือมุมมองแผนที่
ในการสร้างแผนที่เพื่อแสดงความคืบหน้าของการเดินทางโดยใช้ ส่วนย่อยของ Android หรือมุมมอง ให้ทำตามขั้นตอนต่อไปนี้และอ้างถึง ตัวอย่างโค้ด
กำหนดส่วนย่อยหรือมุมมองในไฟล์ XML การจัดวางแอปพลิเคชันของคุณใน
/res/layout
กำหนดแผนที่การแชร์การเดินทางเป็นส่วนย่อยโดยใช้ConsumerMapFragment
, หรือเป็นการแสดงผลโดยใช้ConsumerMapView
จากนั้นส่วนย่อยหรือมุมมองจะให้สิทธิ์เข้าถึงการเดินทาง กำลังแชร์แผนที่ที่แอปของคุณสามารถเข้าถึงและแก้ไขได้ แผนที่ยังมี จัดการกับ
ConsumerController
ซึ่งทำให้แอปของคุณควบคุมและ ปรับแต่งประสบการณ์การแชร์เส้นทางจากเมธอด
onCreate()
ของคุณ ให้โทรหาgetConsumerGoogleMapAsync(callback)
ซึ่งจะแสดงผลConsumerGoogleMap
แบบไม่พร้อมกันใน Callbackใช้
ConsumerGoogleMap
เพื่อแสดงความคืบหน้าของการเดินทางและอัปเดตเมื่อจำเป็น
ตัวอย่างวิธีเพิ่ม ConsumerMapFragment
กำหนดส่วนย่อยในไฟล์ XML สำหรับเลย์เอาต์ของแอปพลิเคชันของคุณ ดังที่แสดงใน ตัวอย่างโค้ดต่อไปนี้
<fragment xmlns:android="http://schemas.android.com/apk/res/android" android:name="com.google.android.libraries.mapsplatform.transportation.consumer.view.ConsumerMapFragment" android:id="@+id/consumer_map_fragment" android:layout_width="match_parent" android:layout_height="match_parent" />
โทรออกไปยัง
getConsumerGoogleMapAsync()
จากonCreate()
Java
public class SampleAppActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
// Find the ConsumerMapFragment.
ConsumerMapFragment consumerMapFragment =
(ConsumerMapFragment) fragmentManager.findFragmentById(R.id.consumer_map_fragment);
// Initiate the callback that returns the map.
if (consumerMapFragment != null) {
consumerMapFragment.getConsumerGoogleMapAsync(
new ConsumerMapReadyCallback() {
// The map returned in the callback is used to access the ConsumerController.
@Override
public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
ConsumerController consumerController = consumerGoogleMap.getConsumerController();
}
});
}
}
}
Kotlin
class SampleAppActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
// Find the ConsumerMapFragment.
val consumerMapFragment =
fragmentManager.findFragmentById(R.id.consumer_map_fragment) as ConsumerMapFragment
consumerMapFragment.getConsumerGoogleMapAsync(
object : ConsumerMapReadyCallback() {
override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
val consumerController = consumerGoogleMap.getConsumerController()!!
}
}
)
}
}
ตัวอย่างวิธีเพิ่ม ConsumerMapView
ใช้มุมมองในส่วนย่อยหรือในกิจกรรม ตามที่ระบุไว้ใน ไฟล์ XML
<com.google.android.libraries.mapsplatform.transportation.consumer.view.ConsumerMapView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/consumer_map_view" android:layout_width="match_parent" android:layout_height="match_parent" />
โทรออกไปยัง
getConsumerGoogleMapAsync()
จากonCreate()
ใน นอกเหนือจากพารามิเตอร์ Callback โปรดระบุรายละเอียดต่อไปนี้กิจกรรมหรือส่วนย่อยที่มี กิจกรรมหรือฐานส่วนย่อย คลาสต้องเป็น
FragmentActivity
หรือFragment
การสนับสนุน (ตามลำดับ) เนื่องจากมอบการเข้าถึงตามวงจรของลูกค้าGoogleMapOptions
(อาจเป็นค่าว่าง) ที่มีการกำหนดค่า สำหรับMapView
Java
public class SampleAppActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
ConsumerMapView mapView = findViewById(R.id.consumer_map_view);
if (mapView != null) {
mapView.getConsumerGoogleMapAsync(
new ConsumerMapReadyCallback() {
// The map returned in the callback is used to access the ConsumerController.
@Override
public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
ConsumerController consumerController = consumerGoogleMap.getConsumerController();
}
}, this, null);
}
}
}
Kotlin
class SampleAppActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
val mapView = findViewById(R.id.consumer_map_view) as ConsumerMapView
mapView.getConsumerGoogleMapAsync(
object : ConsumerMapReadyCallback() {
// The map returned in the callback is used to access the ConsumerController.
override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
val consumerController = consumerGoogleMap.getConsumerController()!!
}
},
/* fragmentActivity= */ this,
/* googleMapOptions= */ null,
)
}
}
MapView
ในส่วนย่อยเหมือนกับตัวอย่างก่อนหน้านี้สำหรับ
MapView
ในกิจกรรม เว้นแต่ส่วนย่อยพองในเลย์เอาต์ที่
รวม MapView
ในเมธอด onCreateView()
Java
public class MapViewInFragment extends Fragment {
@Override
public View onCreateView(
@NonNull LayoutInflater layoutInflater,
@Nullable ViewGroup viewGroup,
@Nullable Bundle bundle) {
return layoutInflater.inflate(R.layout.consumer_map_view, viewGroup, false);
}
}
Kotlin
class MapViewInFragment : Fragment() {
override fun onCreateView(
layoutInflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?,
): View {
return layoutInflater.inflate(R.layout.consumer_map_view, viewGroup, false)
}
}
ขั้นตอนที่ 2: เพิ่มการรองรับเลเยอร์ฐานของแผนที่และดูตัวควบคุม
หากต้องการเปิดใช้การแชร์เส้นทางในแอป ให้เพิ่ม
ชั้นเรียนต่อไปนี้ในแอปของคุณ: ConsumerGoogleMap
และ ConsumerController
รับ
ConsumerGoogleMap
จากConsumerMapFragment
หรือConsumerMapView
ซึ่งทั้ง 2 อย่างนี้แสดงผลแบบไม่พร้อมกันConsumerGoogleMap
ในConsumerMapReadyCallback
ConsumerGoogleMap
คือคลาส Wrapper สำหรับคลาสGoogleMap
โดยใช้ API ที่เทียบเท่ากับGoogleMap
เพื่อให้แอปของคุณโต้ตอบกับแผนที่ได้ ด้วยวิธีนี้ แอปของคุณจะสามารถโต้ตอบกับ Google แผนที่ ตัวอย่างเช่นGoogleMap
อนุญาตให้ลงทะเบียน Callback เพียงครั้งเดียว แต่ConsumerGoogleMap
รองรับ Callback ที่ลงทะเบียนแบบคู่ Callback เหล่านี้ช่วยให้ แอปของคุณจะลงทะเบียน Callback ที่มีการเรียกใช้ตามลำดับรับ
ConsumerController
จากConsumerGoogleMap
ในgetConsumerController()
ConsumerController
ให้สิทธิ์เข้าถึงฟีเจอร์การแชร์เส้นทาง เช่น เช่น ติดตามการเดินทาง ควบคุมสถานะการเดินทาง และกำหนดสถานที่
สำหรับวิธีเพิ่ม ConsumerGoogleMap
และ ConsumerController
ลงในแอปของคุณใน
Java และ Kotlin ดูตัวอย่างต่อไปนี้
Java
private ConsumerGoogleMap consumerGoogleMap;
private ConsumerController consumerController;
private ConsumerMapView consumerMapView;
consumerMapView.getConsumerGoogleMapAsync(
new ConsumerMapReadyCallback() {
@Override
public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerMap) {
consumerGoogleMap = consumerMap;
consumerController = consumerMap.getConsumerController();
}
},
this, null);
Kotlin
var consumerGoogleMap: ConsumerGoogleMap
var consumerController: ConsumerController
val consumerMapView = findViewById(R.id.consumer_map_view) as ConsumerMapView
consumerMapView.getConsumerGoogleMapAsync(
object : ConsumerMapReadyCallback() {
override fun onConsumerMapReady(consumerMap: ConsumerGoogleMap) {
consumerGoogleMap = consumerMap
consumerController = consumerMap.getConsumerController()
},
/* fragmentActivity= */ this,
/* googleMapOptions= */ null,
}
)
ขั้นตอนที่ 3: เพิ่มการรองรับกราฟิกเวกเตอร์ของ Android
หากการออกแบบแอปกำหนดให้ต้องมีการรองรับกราฟิกเวกเตอร์ ให้เพิ่มการรองรับสำหรับ อุปกรณ์ Android และเวกเตอร์ที่ถอนออกได้โดยทำตามขั้นตอนต่อไปนี้
- เพิ่มโค้ดต่อไปนี้ลงในกิจกรรม รหัสนี้ครอบคลุมถึง
AppCompatActivity
เพื่อใช้ Vector ที่ถอนออกได้ใน SDK ของผู้บริโภค
Java
// ...
import android.support.v7.app.AppCompatActivity;
// ...
public class ConsumerTestActivity extends AppCompatActivity {
// ...
}
Kotlin
// ...
import android.support.v7.app.AppCompatActivity
// ...
class ConsumerTestActivity : AppCompatActivity() {
// ...
}