Konfigurowanie mapy

Wybierz platformę: Android iOS

Aby śledzić podróż w aplikacji dla klientów indywidualnych, musisz najpierw zdefiniować mapę i w razie potrzeby dodać do niej obsługę map wektorowych.

Aby skonfigurować mapę w aplikacji:

  1. Określ fragment mapy, aby śledzić podróż
  2. Dodano obsługę warstwy podstawowej map i kontrolera widoku
  3. Dodaj obsługę grafik wektorowych na Androida, aby w razie potrzeby wyświetlać wektorowe mapy.

Po zdefiniowaniu mapy możesz dodać dodatkowe widoki i ustawienia kamery, aby dostosować wygląd. Więcej informacji znajdziesz w sekcji Określanie stylu mapy.

Krok 1. Zdefiniuj fragment mapy, by śledzić podróż

Aby zdefiniować mapę, dodaj fragment mapy lub widok, aby utworzyć mapę, w której udostępniasz podróż na żądanie w swojej aplikacji dla klientów indywidualnych. Aby zdefiniować mapę, skorzystaj z jednej z tych metod:

  • ConsumerMapFragment: służy do definiowania mapy za pomocą Fragment.

  • ConsumerMapView: służy do definiowania mapy z View.

W obu przypadkach funkcje są takie same, więc wybierz metodę, która lepiej sprawdzi się w Twojej aplikacji.

W następnej sekcji znajdziesz więcej informacji o obu tych metodach.

Dodawanie fragmentu lub widoku mapy

Aby utworzyć mapę wyświetlającą postęp podróży za pomocą fragmentu kodu na Androida lub widoku, wykonaj te czynności i odwołaj się do przykładów kodu.

  1. Zdefiniuj fragment lub widok w pliku XML układu aplikacji znajdującym się w folderze /res/layout. Zdefiniuj mapę podróży jako fragment za pomocą właściwości ConsumerMapFragment lub jako widok za pomocą właściwości ConsumerMapView.

    Fragment lub widok zapewnia dostęp do mapy podróży, do której aplikacja może uzyskać dostęp i ją modyfikować. Mapa zawiera też uchwyt do ConsumerController, który umożliwia aplikacji dostosowywanie i dostosowywanie obsługi klienta.

  2. Z metody onCreate() wywołaj getConsumerGoogleMapAsync(callback), który zwraca asynchronicznie ConsumerGoogleMap w wywołaniu zwrotnym.

  3. Użyj ConsumerGoogleMap, aby wyświetlić postępy w podróży i w razie potrzeby je zaktualizować.

Przykład dodawania ConsumerMapFragment

  1. Zdefiniuj fragment w pliku XML układu aplikacji, jak pokazano w tym przykładzie kodu.

    <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" />
    
  2. Wywołaj funkcję getConsumerGoogleMapAsync() za pomocą metody 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()!!
         }
       }
     )
   }
 }

Przykład dodania: ConsumerMapView

  1. Użyj widoku w fragmentie lub w aktywności zgodnie z definicją w pliku 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" />
    
  2. Zadzwoń do grupy kontaktowej getConsumerGoogleMapAsync() z numeru onCreate(). Oprócz parametru callback podaj te informacje:

    • Aktywność lub fragment, który go zawiera. Klasa podstawowa działania lub fragmentu musi być albo FragmentActivity albo obsługą Fragment, ponieważ zapewnia dostęp do cyklu życia.

    • GoogleMapOptions (który może mieć wartość null) zawierający atrybuty konfiguracji obiektu 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,
    )
  }
}

Element MapView we fragmencie jest taki sam jak w poprzednim przykładzie dla elementu MapView w aktywności, z tym że fragment rozszerza układ zawierający MapView we fragmencie 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)
  }
}

Krok 2. Dodaj obsługę warstwy podstawowej mapy i kontrolera widoku

Aby udostępniać postępy w podróży w aplikacji, dodaj do niej te klasy: ConsumerGoogleMapConsumerController.

  • Uzyskaj ConsumerGoogleMap z ConsumerMapFragment lub ConsumerMapView, które asynchronicznie zwracają ConsumerGoogleMap w ConsumerMapReadyCallback.

    ConsumerGoogleMap to klasa kodu dla klasy GoogleMap. Wykorzystuje interfejs API odpowiednika GoogleMap, aby aplikacja mogła korzystać z mapy. Dzięki temu Twoja aplikacja może płynnie współpracować z tą samą mapą Google. Na przykład GoogleMap umożliwia rejestrację tylko z jednym wywołaniem zwrotnym, ale ConsumerGoogleMap obsługuje podwójne zarejestrowane wywołania zwrotne. Te wywołania zwrotne umożliwiają aplikacji rejestrowanie wywołań zwrotnych, które są wywoływane sekwencyjnie.

  • ConsumerControllerConsumerGoogleMapgetConsumerController().

    ConsumerController zapewnia dostęp do funkcji udostępniania podróży, takich jak monitorowanie podróży, kontrolowanie stanu podróży i ustawianie lokalizacji.

Aby dowiedzieć się, jak dodać do aplikacji w językach Java i Kotlin elementy ConsumerGoogleMapConsumerController, zapoznaj się z podawanymi niżej przykładami.

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,
  }
)

Krok 3. Dodaj obsługę grafiki wektorowej na Androida

Jeśli projekt Twojej aplikacji wymaga obsługi grafiki wektorowej, dodaj obsługę urządzeń z Androidem i obiektów rysunkowych wektorowych, wykonując te czynności:

  1. Dodaj do swojej aktywności ten kod: Te kody rozszerzają AppCompatActivity o możliwość używania wektorowych obiektów graficznych w pakiecie Consumer SDK.

Java

// ...
import android.support.v7.app.AppCompatActivity;

// ...

public class ConsumerTestActivity extends AppCompatActivity {
  // ...
}

Kotlin

// ...
import android.support.v7.app.AppCompatActivity

// ...

class ConsumerTestActivity : AppCompatActivity() {
  // ...
}

Co dalej

Obserwowanie przejazdu na urządzeniu z Androidem Nadawanie mapie stylu