Untuk mengikuti perjalanan di aplikasi konsumen, Anda harus menentukan peta terlebih dahulu dan menambahkan dukungan untuk peta vektor, jika diperlukan.
Untuk menyiapkan peta di aplikasi, ikuti langkah-langkah berikut:
- Menentukan fragmen peta untuk mengikuti perjalanan.
- Menambahkan dukungan untuk lapisan dasar peta dan pengontrol tampilan.
- Menambahkan dukungan untuk grafis vektor Android untuk menampilkan peta vektor, jika diperlukan.
Setelah menentukan peta, Anda dapat menambahkan tampilan dan kontrol kamera tambahan yang ingin disesuaikan untuk pengalaman visual. Untuk mengetahui detail selengkapnya, lihat artikel Menata gaya peta.
Langkah 1: Tentukan fragmen peta untuk mengikuti perjalanan
Anda menentukan peta dengan menambahkan fragmen atau tampilan peta untuk membuat peta tempat Anda membagikan perjalanan on demand di aplikasi konsumen. Untuk menentukan peta, ikuti salah satu metode berikut:
ConsumerMapFragment
: Gunakan untuk menentukan peta denganFragment
.ConsumerMapView
: Gunakan untuk menentukan peta denganView
.
Fiturnya sama untuk kedua metode tersebut, jadi pilih metode mana yang lebih baik untuk aplikasi Anda.
Kedua metode tersebut dijelaskan secara lebih mendetail di bagian berikut.
Menambahkan fragmen atau tampilan peta
Untuk membuat peta guna menampilkan progres perjalanan menggunakan fragmen Android atau tampilan, ikuti langkah-langkah berikut dan lihat contoh kode.
Tentukan fragmen atau tampilan di file XML tata letak aplikasi Anda yang berada di
/res/layout
. Tentukan peta perjalanan sebagai fragmen menggunakanConsumerMapFragment
, atau sebagai tampilan menggunakanConsumerMapView
.Fragmen atau tampilan tersebut kemudian memberikan akses ke peta perjalanan yang dapat diakses dan diubah oleh aplikasi Anda. Peta juga menyediakan handle ke
ConsumerController
, yang memungkinkan aplikasi Anda mengontrol dan menyesuaikan pengalaman konsumen.Dari metode
onCreate()
, panggilgetConsumerGoogleMapAsync(callback)
yang menampilkanConsumerGoogleMap
secara asinkron dalam callback.Gunakan
ConsumerGoogleMap
untuk menampilkan progres dan update perjalanan sesuai kebutuhan.
Contoh cara menambahkan ConsumerMapFragment
Tentukan fragmen dalam file XML tata letak aplikasi Anda, seperti yang ditunjukkan dalam contoh kode berikut.
<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" />
Lakukan panggilan ke
getConsumerGoogleMapAsync()
dari metodeonCreate()
.
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()!!
}
}
)
}
}
Contoh cara menambahkan ConsumerMapView
Gunakan tampilan dalam fragmen atau aktivitas, seperti yang ditetapkan dalam file XML Anda.
<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" />
Lakukan panggilan ke
getConsumerGoogleMapAsync()
darionCreate()
. Selain parameter callback, sertakan detail berikut:Aktivitas atau fragmen yang memuatnya. Class dasar aktivitas atau fragmen harus berupa
FragmentActivity
atauFragment
dukungan (berturut-turut), karena class dasar tersebut memberikan akses ke siklus prosesnya.GoogleMapOptions
(yang dapat berupa null), yang berisi atribut konfigurasi untukMapView
.
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
dalam fragmen sama dengan contoh sebelumnya untuk
MapView
dalam aktivitas, kecuali bahwa fragmen meng-inflate tata letak yang
menyertakan MapView
dalam metode onCreateView()
fragmen.
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)
}
}
Langkah 2: Menambahkan dukungan untuk lapisan dasar peta dan pengontrol tampilan
Untuk membagikan progres perjalanan di aplikasi Anda, tambahkan
class berikut ke aplikasi Anda: ConsumerGoogleMap
dan ConsumerController
.
Dapatkan
ConsumerGoogleMap
dariConsumerMapFragment
atauConsumerMapView
, yang keduanya secara asinkron menampilkanConsumerGoogleMap
diConsumerMapReadyCallback
.ConsumerGoogleMap
adalah class wrapper untuk classGoogleMap
. Class ini menggunakan API yang setara denganGoogleMap
sehingga aplikasi Anda dapat berinteraksi dengan peta. Dengan cara ini, aplikasi Anda dapat berinteraksi secara lancar dengan peta Google pokok yang sama. Misalnya,GoogleMap
hanya mengizinkan satu pendaftaran callback, tetapiConsumerGoogleMap
mendukung callback terdaftar ganda. Callback ini memungkinkan aplikasi Anda mendaftarkan callback yang dipanggil secara berurutan.Dapatkan
ConsumerController
dariConsumerGoogleMap
digetConsumerController()
.ConsumerController
memberikan akses ke fitur berbagi perjalanan seperti memantau perjalanan, mengontrol status perjalanan, dan menetapkan lokasi.
Untuk cara menambahkan ConsumerGoogleMap
dan ConsumerController
ke aplikasi Anda di
Java dan Kotlin, lihat contoh berikut.
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,
}
)
Langkah 3: Menambahkan dukungan untuk grafik vektor Android
Jika desain aplikasi Anda memerlukan dukungan untuk grafik vektor, tambahkan dukungan untuk perangkat Android dan vektor drawable menggunakan langkah-langkah berikut:
- Tambahkan kode berikut ke Aktivitas Anda. Kode ini memperluas
AppCompatActivity
untuk menggunakan Vector drawable di Consumer SDK.
Java
// ...
import android.support.v7.app.AppCompatActivity;
// ...
public class ConsumerTestActivity extends AppCompatActivity {
// ...
}
Kotlin
// ...
import android.support.v7.app.AppCompatActivity
// ...
class ConsumerTestActivity : AppCompatActivity() {
// ...
}