Pilih platform: Android iOS

Mengonfigurasi gangguan real-time

Gangguan real-time adalah kumpulan fitur yang memberi tahu pengguna tentang gangguan di sepanjang rute mereka dan memungkinkan pengguna melaporkan dan memverifikasi gangguan yang mereka alami. Contoh gangguan meliputi kecelakaan kendaraan, kemacetan lalu lintas, kehadiran polisi dan kamera pengukur kecepatan, konstruksi, penutupan jalur, dan kondisi cuaca tertentu. Halaman ini menjelaskan fitur gangguan real-time dan opsi konfigurasinya, termasuk pertimbangan untuk aplikasi yang menggunakan UI navigasi kustom.

Fitur gangguan real-time

Navigation SDK menyertakan fitur gangguan real-time berikut sebagai bagian dari pengalaman navigasi inti:

Fitur ini dapat dikonfigurasi dan diaktifkan secara default. Bagian berikut memberikan informasi selengkapnya tentang fitur dan opsi konfigurasi yang tersedia.

Info gangguan interaktif di sepanjang rute

Saat aplikasi menampilkan rute, baik dalam ringkasan rute atau selama navigasi aktif, gangguan saat ini akan muncul sebagai keterangan di sepanjang rute. Info penting menyertakan ikon yang menunjukkan jenis gangguan.

Info di sepanjang rute

Anda dapat mengontrol tampilan info gangguan di sepanjang rute menggunakan shouldDisplayPrompts, yang juga mengontrol tampilan pemberitahuan otomatis saat pengguna mendekati gangguan.

mapView.navigator.shouldDisplayPrompts = true

Menampilkan detail gangguan saat pengguna mengetuk balon

Pengguna dapat mengetuk info singkat untuk menampilkan kartu info dengan informasi selengkapnya tentang gangguan, termasuk jenis gangguan, waktu terakhir dilaporkan, dan dalam beberapa kasus, opsi untuk memilih apakah gangguan masih terjadi. Ada dua jenis kartu info berbeda yang dapat muncul, bergantung pada apakah pengguna sedang dalam navigasi aktif, dan opsi konfigurasi bervariasi untuk setiap jenis.

Kartu info balon teks pada ringkasan rute, sebelum memulai navigasi aktif

Saat pengguna mengetuk balon ucapan pada ringkasan rute, sebelum memulai navigasi aktif, kartu info akan muncul dengan informasi selengkapnya tentang gangguan.

Kartu info ringkasan

Anda dapat mengontrol kemampuan pengguna untuk mengetuk balon peringatan gangguan pada ringkasan rute untuk menampilkan informasi selengkapnya menggunakan showsIncidentCards.

mapView.settings.showsIncidentCards = true

Kartu info balon teks selama navigasi aktif

Saat info gangguan muncul di sepanjang rute selama navigasi aktif, pengguna dapat mengetuk info gangguan tersebut untuk menampilkan kartu info dengan informasi selengkapnya tentang gangguan, termasuk jenis gangguan dan waktu terakhir kali dilaporkan, serta tombol untuk memberikan suara apakah gangguan tersebut masih ada. Suara yang dikirimkan oleh pengguna diproses oleh Google dan dapat ditampilkan di peta untuk pengguna Google Maps dan pengguna Navigation SDK lainnya, serta digunakan untuk menentukan apakah akan terus menampilkan gangguan.

Kartu info navigasi aktif

Anda dapat mengontrol tampilan dan kemampuan ketuk info gangguan selama navigasi aktif menggunakan shouldDisplayPrompts, yang juga mengontrol tampilan info di sepanjang rute dan tampilan peringatan otomatis saat pengguna mendekati gangguan.

mapView.navigator.shouldDisplayPrompts = true

Pemberitahuan gangguan otomatis dengan pemungutan suara selama navigasi aktif

Selama navigasi aktif, saat pengguna mendekati gangguan di sepanjang rute, perintah akan muncul dengan informasi tentang gangguan dan tombol untuk memilih apakah gangguan tersebut masih ada. Suara yang dikirimkan oleh pengguna diproses oleh Google dan dapat ditampilkan di peta untuk pengguna Google Maps dan Navigation SDK lainnya, serta digunakan untuk menentukan apakah akan terus menampilkan gangguan.

Kartu info navigasi aktif

Anda dapat mengonfigurasi tampilan dialog pemberitahuan selama navigasi aktif menggunakan shouldDisplayPrompts, yang juga mengontrol tampilan info di sepanjang rute.

mapView.navigator.shouldDisplayPrompts = true

Pelaporan gangguan selama navigasi aktif

Selama mode navigasi aktif, tombol akan muncul di UI navigasi yang memungkinkan pengguna melaporkan gangguan baru di sepanjang rute mereka. Saat pengguna mengetuk tombol, menu dengan jenis gangguan yang tersedia untuk dilaporkan akan muncul. Laporan yang dikirimkan pengguna diproses oleh Google dan dapat ditampilkan di peta untuk pengguna Google Maps dan Navigation SDK lainnya.

Tombol pelaporan Menu pelaporan

Menampilkan atau menyembunyikan tombol pelaporan standar

Anda dapat mengonfigurasi visibilitas tombol pelaporan standar selama navigasi aktif menggunakan navigationReportIncidentButtonEnabled.

// Enables the incident reporting FAB to show in situations where incident
// reporting is possible.
mapView.settings.navigationReportIncidentButtonEnabled = true

Menambahkan tombol pelaporan kustom

Sebagai pengganti tombol pelaporan gangguan standar, Anda dapat menambahkan tombol pelaporan kustom ke UI navigasi. Saat pengguna mengklik tombol kustom, Anda dapat memicu tampilan menu pelaporan dengan memanggil metode presentReportIncidentsPanel. Sebelum menambahkan tombol pelaporan kustom, verifikasi bahwa aplikasi berada dalam navigasi aktif dan pengguna berada di negara tempat pelaporan diaktifkan dengan memanggil reportIncidentsAvailable. Jika salah satu dari kondisi ini tidak terpenuhi, menu pelaporan tidak akan muncul.

  // Check if reporting is available before displaying your button
  let isReportingAvailable = mapview.isIncidentReportingAvailable()
  customReportingIncidentButton.isHidden = !isReportingAvailable
  customReportingIncidentButton.addTarget(self, action: #selector(didTapReportIncidentButton), for: .touchUpInside)
  
  // Trigger the reporting flow if the button is clicked
  func didTapReportIncidentButton() {
          mapView.presentReportIncidentsPanel(self) { [weak self] error in
              guard let self = self else { return }
              if let error = error as NSError? {
                  if error.domain == GMSMapViewPresentReportIncidentPanelErrorDomain {
                      let errorCode = GMSMapViewPresentReportIncidentPanelErrorCode(rawValue: error.code)
                      
                      switch errorCode {
                      case .internal:
                          self.showErrorMessage(
                              title: "Error Presenting Report Incident Panel",
                              message: "An internal error occurred."
                          )
                      case .reportingNotAvailable:
                          self.showErrorMessage(
                              title: "Error Presenting Report Incident Panel",
                              message: "Reporting is not available."
                          )
                      case .none:
                          self.showErrorMessage(
                              title: "Error Presenting Report Incident Panel",
                              message: "An unknown error occurred."
                          )
                      }
                  } else {
                      // Handle other potential errors (e.g., network errors)
                      self.showErrorMessage(
                          title: "Error Presenting Report Incident Panel",
                          message: "An unexpected error occurred: \(error.localizedDescription)"
                      )
                  }
              }
              // If error is nil, the panel was presented successfully. You can add any extra logic here.
          }
     }

Bekerja dengan UI navigasi kustom

Jika penerapan Navigation SDK Anda menyertakan elemen UI kustom, Anda harus mempertimbangkan elemen gangguan real-time untuk menghindari konflik.

Penempatan tombol pelaporan

Secara default, tombol pelaporan gangguan diposisikan di ujung bawah/sudut belakang peta—di sisi kanan untuk bahasa kiri ke kanan dan sisi kiri untuk bahasa kanan ke kiri. Jika Anda perlu memindahkan tombol pelaporan untuk memberi ruang bagi elemen UI kustom, gunakan bottomTrailingButtonsLayoutGuide.

Swift

// Create a new layout guide
let topRightLayoutGuide = UILayoutGuide()
self.view.addLayoutGuide(topRightLayoutGuide)

// Activate constraints using fixed constants here as an example
// assuming the current reporting button is of fixed height
topRightLayoutGuide.topAnchor.constraint(equalTo: _mapView.navigationHeaderLayoutGuide.bottomAnchor, constant: 50).isActive = true
topRightLayoutGuide.trailingAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.trailingAnchor, constant: -14).isActive = true

// Assign the layout guide
_mapView.bottomTrailingButtonsLayoutGuide = topRightLayoutGuide

// Create an alternate layout guide to use when the header and the footer are not full width
let topRightAlternateLayoutGuide = UILayoutGuide()
self.view.addLayoutGuide(topRightAlternateLayoutGuide)

// Activate constraints using fixed constants here as an example
// assuming the current RTD button is of fixed height
topRightAlternateLayoutGuide.topAnchor.constraint(equalTo: _mapView.navigationHeaderLayoutGuide.bottomAnchor, constant: 20).isActive = true
topRightAlternateLayoutGuide.trailingAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.trailingAnchor, constant: -10).isActive = true

// Assign the layout guide
_mapView.bottomTrailingButtonsAlternateLayoutGuide = topRightAlternateLayoutGuide

Objective-C

// Create a new layout guide
UILayoutGuide *topRightLayoutGuide = [[UILayoutGuide alloc] init];
[self.view addLayoutGuide:topRightLayoutGuide];

// Activate constraints using fixed constants here as an example
// assuming the current RTD button is of fixed height
[[topRightLayoutGuide.topAnchor
    constraintEqualToAnchor:_mapView.navigationHeaderLayoutGuide.bottomAnchor
                   constant:50]
    setActive:YES];

[[topRightLayoutGuide.trailingAnchor
    constraintEqualToAnchor:self.view.safeAreaLayoutGuide.trailingAnchor
                   constant:-14]
    setActive:YES];

// Assign the layout guide
_mapView.bottomTrailingButtonsLayoutGuide = topRightLayoutGuide;

// Create an alternate layout guide to use when the header and the footer are not full width
UILayoutGuide *topRightAlternateLayoutGuide = [[UILayoutGuide alloc] init];
[self.view addLayoutGuide:topRightAlternateLayoutGuide];

// Activate constraints using fixed constants here as an example
// assuming the current RTD button is of fixed height
[[topRightAlternateLayoutGuide.topAnchor
    constraintEqualToAnchor:_mapView.navigationHeaderLayoutGuide.bottomAnchor
                   constant:50]
    setActive:YES];

[[topRightAlternateLayoutGuide.trailingAnchor
    constraintEqualToAnchor:self.view.safeAreaLayoutGuide.trailingAnchor
                   constant:-14]
    setActive:YES];

// Assign the layout guide
_mapView.bottomTrailingButtonsAlternateLayoutGuide = topRightAlternateLayoutGuide;

Prompt Visibility API (Eksperimental)

Prompt Visibility API membantu Anda menghindari konflik antara elemen UI yang dihasilkan oleh Navigation SDK dan elemen UI kustom Anda sendiri dengan menambahkan pemroses untuk menerima callback sebelum elemen UI Navigation SDK akan muncul dan segera setelah elemen dihapus. Anda dapat menerima callback untuk elemen gangguan real-time, termasuk kartu info, perintah, dan menu pelaporan gangguan, serta untuk notifikasi lain yang dihasilkan oleh Navigation SDK.

Swift

// Additional methods added to GMSNavigatorListener
...
func navigatorWillPresentPrompt(_ navigator: GMSNavigator) {
  // Hide any sort of custom UI element.
}

func navigatorDidDismissPrompt(_ navigator: GMSNavigator) {
  // Show any sort of custom UI element.
}
...

Objective-C

// Additional methods added to GMSNavigatorListener
...
- (void)navigatorWillPresentPrompt:(GMSNavigator *)navigator {
  // Hide any sort of custom UI element.
}

- (void)navigatorDidDismissPrompt:(GMSNavigator *)navigator {
  // Show any sort of custom UI element.
}
...