Konfigurowanie mapy

Wybierz platformę: Android iOS

Aby śledzić przejazd w aplikacji konsumenckiej, musisz najpierw zdefiniować mapę i w razie potrzeby dodać obsługę map wektorowych.

Aby skonfigurować mapę w aplikacji:

  1. Określ fragment mapy, który ma śledzić podróż.
  2. Dodanie obsługi warstwy bazowej mapy i kontrolera widoku
  3. W razie potrzeby dodaj obsługę grafiki wektorowej na Androidzie, aby wyświetlać mapy wektorowe.

Po zdefiniowaniu mapy możesz dodać dodatkowe widoki i elementy sterujące kamerą, aby dostosować wrażenia wizualne. Więcej informacji znajdziesz w artykule Stylizowanie mapy.

Krok 1. Określ fragment mapy, który ma śledzić podróż

Mapę definiujesz, dodając fragment lub widok mapy, aby utworzyć mapę, na której udostępniasz przejazd na żądanie w aplikacji dla konsumentów. Aby zdefiniować mapę, wykonaj jedną z tych czynności:

  • ConsumerMapFragment: użyj tej właściwości, aby zdefiniować mapę za pomocą elementu Fragment.

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

Funkcje są takie same w przypadku obu metod, więc wybierz tę, która lepiej pasuje do Twojej aplikacji.

Obie metody zostały szczegółowo opisane w następnej sekcji.

Dodawanie fragmentu mapy lub widoku

Aby utworzyć mapę wyświetlającą postępy w podróży za pomocą fragmentu lub widoku Androida, wykonaj te czynności i zapoznaj się z przykładami 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ą elementu ConsumerMapFragment lub jako widok za pomocą elementu ConsumerMapView.

    Fragment lub widok zapewnia wtedy dostęp do mapy podróży, do której Twoja aplikacja może mieć dostęp i którą może modyfikować. Mapa zawiera też uchwyt do ConsumerController, który umożliwia aplikacji kontrolowanie i dostosowywanie wrażeń użytkownika.

  2. W metodzie onCreate() wywołaj getConsumerGoogleMapAsync(callback), która asynchronicznie zwraca ConsumerGoogleMap w wywołaniu zwrotnym.

  3. Użyj ikony 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ń na numer 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 dodawania ConsumerMapView

  1. Użyj widoku we fragmencie 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ń na numer getConsumerGoogleMapAsync() z numeru onCreate(). Oprócz parametru wywołania zwrotnego uwzględnij następujące szczegóły:

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

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

MapView we fragmencie jest taki sam, jak w poprzednim przykładzie dla MapView w aktywności, z tą różnicą, że fragment rozszerza układ, który zawiera MapView w metodzie fragmentu 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 bazowej mapy i kontrolera widoku

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

  • Pobierz ConsumerGoogleMapConsumerMapFragment lub ConsumerMapView. Obie te funkcje asynchronicznie zwracają ConsumerGoogleMapConsumerMapReadyCallback.

    ConsumerGoogleMap to klasa opakowująca klasę GoogleMap. Korzysta z interfejsu API podobnego do GoogleMap, dzięki czemu Twoja aplikacja może wchodzić w interakcje z mapą. Dzięki temu aplikacja może bezproblemowo korzystać z tej samej mapy Google. Na przykład funkcja GoogleMap umożliwia tylko jedną rejestrację wywołania zwrotnego, ale funkcja ConsumerGoogleMap obsługuje podwójne zarejestrowane wywołania zwrotne. Te wywołania zwrotne umożliwiają zarejestrowanie w aplikacji wywołań zwrotnych, które są wywoływane kolejno.

  • Odbierz ConsumerControllerConsumerGoogleMapgetConsumerController().

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

Przykłady dodawania wywołań ConsumerGoogleMapConsumerController do aplikacji w językach Java i Kotlin znajdziesz poniżej.

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 Androidzie

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

  1. Dodaj poniższy kod do aktywności. Ten kod rozszerza AppCompatActivity możliwość używania 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 Androidzie

Zmienianie stylu mapy