Konfigurowanie mapy

Wybierz platformę: Android iOS

Aby śledzić przejazd w aplikacji dla użytkowników, musisz najpierw zdefiniować mapę i w razie potrzeby dodać obsługę map wektorowych.

Aby skonfigurować mapę w aplikacji:

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

Po zdefiniowaniu mapy możesz dodać dodatkowe widoki i ustawienia kamery, aby dostosować wygląd. Więcej informacji znajdziesz w artykule Nadawanie mapie odpowiedniego wyglądu.

Krok 1. Określ fragment mapy, który ma być wyświetlany podczas podróży

Mapę definiujesz, dodając fragment mapy lub widok, aby utworzyć mapę, na której udostępniasz przejazd na żądanie w aplikacji dla klientów. Aby zdefiniować mapę, użyj 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 pasuje do Twojej aplikacji.

Więcej informacji o obu tych metodach znajdziesz w następnej sekcji.

Dodawanie fragmentu mapy lub widoku

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, który znajduje się w folderze /res/layout. Zdefiniuj mapę podróży jako fragment za pomocą elementu ConsumerMapFragment lub jako widok za pomocą elementu 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ż element ConsumerController, który umożliwia aplikacji kontrolowanie i dostosowywanie wrażeń konsumentów.

  2. Z metody onCreate() wywołaj metodę getConsumerGoogleMapAsync(callback), która zwraca ConsumerGoogleMap asynchronicznie 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. Zadzwoń do getConsumerGoogleMapAsync() z 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 dodawania 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 getConsumerGoogleMapAsync() z onCreate(). Oprócz parametru callback podaj te informacje:

    • Aktywność lub fragment zawierający. Klasa bazowa aktywności lub fragmentu musi być klasą FragmentActivity lub klasą pomocniczą Fragment, ponieważ zapewniają dostęp do cyklu życia.

    • GoogleMapOptions (może być równa null), zawierająca atrybuty konfiguracji 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 w fragmentach działa tak samo jak w poprzednim przykładzie elementu MapView w aktywności, z tą różnicą, że fragment powoduje rozwinięcie układu, który zawiera element MapView w metodzie onCreateView() fragmentu.

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 map i kontrolera widoku

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

  • Uzyskaj wartość ConsumerGoogleMap z elementu ConsumerMapFragment lub ConsumerMapView, które asynchronicznie zwracają wartość ConsumerGoogleMap w elementach ConsumerMapReadyCallback.

    ConsumerGoogleMap to klasa opakowująca dla klasy GoogleMap. Używa ona interfejsu API podobnego do GoogleMap, aby aplikacja mogła wchodzić w interakcję z mapą. Dzięki temu Twoja aplikacja może płynnie współpracować z tą samą mapą Google. Na przykład GoogleMap zezwala tylko na jedno zarejestrowane połączenie zwrotne, ale ConsumerGoogleMap obsługuje połączenia zwrotne zarejestrowane podwójnie. Te wywołania zwrotne umożliwiają aplikacji rejestrowanie wywołań zwrotnych, które są wywoływane sekwencyjnie.

  • Pobierz ConsumerController z ConsumerGoogleMap w getConsumerController().

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

Aby dowiedzieć się, jak dodać do aplikacji w językach Java i Kotlin elementy ConsumerGoogleMap i ConsumerController, 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ę grafik wektorowych na Androida

Jeśli projekt aplikacji wymaga obsługi grafiki wektorowej, dodaj obsługę urządzeń z Androidem i elementów wektorowych. Aby to zrobić:

  1. Dodaj do aktywności ten kod: Te kody rozszerzają AppCompatActivity, aby umożliwić korzystanie z rysunków wektorowych w pakiecie SDK dla konsumentów.

Java

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

// ...

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

Kotlin

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

// ...

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

Co dalej

Śledzenie przejazdu na urządzeniu z Androidem

Zmienianie stylu mapy