Dodaj mapę

Wybierz platformę: Android iOS JavaScript

W tym artykule opisujemy, jak dodać podstawową mapę do aplikacji na Androida, gdy już skonfigurujesz projekt pod kątem korzystania z pakietu Maps SDK na Androida. Po dodaniu mapy możesz zmienić jej typ i funkcje.

Przegląd

Pakiet SDK Map na Androida oferuje kilka klas, za pomocą których Twoja aplikacja może zarządzać cyklem życia, funkcjami i danymi na mapie. Klasy obsługują interakcje użytkownika na podstawie modelu interfejsu Androida, na przykład określają początkowy stan mapy i reagują na wprowadzone przez użytkownika gesty w czasie działania.

Główny interfejs i klasy do obsługi map:

  • GoogleMap – punkt wejścia do zarządzania bazowymi funkcjami mapy i danymi. Aplikacja może uzyskać dostęp do obiektu GoogleMap dopiero po pobraniu go z obiektu SupportMapFragment lub MapView.

  • SupportMapFragment – fragment do zarządzania cyklem życia obiektu GoogleMap.

  • MapView – widok służący do zarządzania cyklem życia obiektu GoogleMap.

  • OnMapReadyCallback – interfejs wywołania zwrotnego, który obsługuje zdarzenia i interakcję użytkownika z obiektem GoogleMap.

Obiekt GoogleMap automatycznie wykonuje te operacje:

  • Łączę z usługą Mapy Google.
  • Pobieram elementy mapy.
  • Wyświetlanie kafelków na ekranie urządzenia.
  • Wyświetlam różne elementy sterujące, takie jak przesuwanie i powiększanie.
  • Reagowanie na gesty przesunięcia i powiększenia przez przesuwanie mapy oraz powiększanie i pomniejszanie.

Aby użyć obiektu GoogleMap w aplikacji, musisz użyć obiektu SupportMapFragment lub MapView jako obiektu kontenera na mapie, a następnie pobrać obiekt GoogleMap z kontenera. Klasy kontenera pochodzą z fragmentu lub widoku Androida, dlatego udostępniają mapie funkcje zarządzania cyklem życia i interfejsy klas podstawowych Androida. Klasa SupportMapFragment jest nowocześniejszym i bardziej powszechnym kontenerem dla obiektu GoogleMap.

Wyświetl kod

Następujący kod pochodzi z pełnej aktywności Java w tym temacie podczas statycznego dodawania fragmentu. Projekt na Androida został utworzony na podstawie szablonu Pusty projekt, a następnie zaktualizowany na podstawie przewodnika konfiguracji projektu. Po wykonaniu czynności opisanych w tym temacie Twój kod może się różnić w zależności od szablonu projektu.

  package com.example.mapsetup;

  import androidx.appcompat.app.AppCompatActivity;

  import android.os.Bundle;

  import com.google.android.gms.maps.GoogleMap;
  import com.google.android.gms.maps.OnMapReadyCallback;
  import com.google.android.gms.maps.SupportMapFragment;
  import com.google.android.gms.maps.model.LatLng;
  import com.google.android.gms.maps.model.MarkerOptions;

  // Implement OnMapReadyCallback.
  public class MainActivity extends AppCompatActivity implements OnMapReadyCallback {

      @Override
      protected void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
          // Set the layout file as the content view.
          setContentView(R.layout.activity_main);

          // Get a handle to the fragment and register the callback.
          SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
                  .findFragmentById(R.id.map);
          mapFragment.getMapAsync(this);

      }

      // Get a handle to the GoogleMap object and display marker.
      @Override
      public void onMapReady(GoogleMap googleMap) {
          googleMap.addMarker(new MarkerOptions()
                  .position(new LatLng(0, 0))
                  .title("Marker"));
      }
  }

Dodawanie mapy

W tej sekcji dowiesz się, jak dodać podstawową mapę, używając fragmentu jako kontenera mapy, ale możesz użyć widoku. Przykład znajdziesz w narzędziu RawMapViewDemoActivity na GitHubie.

Podstawowe czynności:

  1. Aby uzyskać pakiet SDK, uzyskać klucz interfejsu API i dodać wymagane platformy, wykonaj te czynności:

    1. Konfiguracja w Google Cloud Console

    2. Używanie klucza interfejsu API

    3. Konfigurowanie projektu w Android Studio

  2. Dodaj do obiektu obiekt SupportMapFragment, który będzie obsługiwał mapę. Fragment możesz dodać statycznie lub dynamicznie.

  3. Zaimplementuj interfejs OnMapReadyCallback.

  4. Ustaw plik układu jako widok treści.

  5. Jeśli fragment został dodany statycznie, uzyskaj jego obsługę.

  6. Zarejestruj wywołanie zwrotne.

  7. Uchwyć obiekt GoogleMap.

Dodawanie obiektu SupportMapFragment

Obiekt SupportMapFragment możesz dodać do aplikacji statycznie lub dynamicznie. Najprostszym sposobem jest dodanie jej statycznie. Jeśli dodasz fragment dynamicznie, możesz wykonywać na nim dodatkowe działania, np. usuwać go i zastępować w czasie działania.

Do dodania statycznego fragmentu

W pliku układu działania, które będzie zajmować mapę:

  1. Dodaj element fragment.
  2. Dodaj deklarację nazwy xmlns:map="http://schemas.android.com/apk/res-auto". Umożliwia to korzystanie z maps niestandardowych atrybutów XML.
  3. W elemencie fragment ustaw atrybut android:name na com.google.android.gms.maps.SupportMapFragment.
  4. W elemencie fragment dodaj atrybut android:id i ustaw go na identyfikator zasobu R.id.map (@+id/map).

Oto na przykład kompletny plik układu zawierający element fragment:

<?xml version="1.0" encoding="utf-8"?>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:map="http://schemas.android.com/apk/res-auto"
    android:name="com.google.android.gms.maps.SupportMapFragment"
    android:id="@+id/map"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

Dynamiczne dodawanie fragmentu

W ramach ćwiczenia:

  1. utworzyć instancję SupportMapFragment,
  2. Zatwierdź transakcję, która dodaje fragment do aktywności. Więcej informacji znajdziesz w sekcji Transakcje.

Na przykład:

Java


SupportMapFragment mapFragment = SupportMapFragment.newInstance();
getSupportFragmentManager()
    .beginTransaction()
    .add(R.id.my_container, mapFragment)
    .commit();

Kotlin


val mapFragment = SupportMapFragment.newInstance()
supportFragmentManager
    .beginTransaction()
    .add(R.id.my_container, mapFragment)
    .commit()

Wdróż interfejs OnMapReadyCallback

Zaktualizuj deklarację dotyczącą aktywności w ten sposób:

Java


class MainActivity extends AppCompatActivity implements OnMapReadyCallback {
    // ...
}

Kotlin


class MainActivity : AppCompatActivity(), OnMapReadyCallback {

    // ...
}

Ustawianie widoku treści

W metodzie onCreate swojej aktywności wywołaj metodę setContentView i ustaw plik układu jako widok treści.

Jeśli na przykład plik układu ma nazwę main.xml:

Java


@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
}

Kotlin


override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.main)
}

Uzyskaj nick dla fragmentu i zarejestruj wywołanie zwrotne

  1. Aby uzyskać nick dla fragmentu, wywołaj metodę FragmentManager.findFragmentById i przekaż mu identyfikator zasobu fragmentu w pliku układu. Jeśli fragment został dynamicznie dodany, pomiń ten krok, ponieważ masz już pobrany nick.

  2. Wywołaj metodę getMapAsync, aby ustawić wywołanie zwrotne dla fragmentu.

Jeśli fragment został dodany statycznie:

Java


SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
    .findFragmentById(R.id.map);
mapFragment.getMapAsync(this);

Kotlin


val mapFragment = supportFragmentManager
    .findFragmentById(R.id.map) as SupportMapFragment
mapFragment.getMapAsync(this)

Pobranie obiektu GoogleMap

Aby uzyskać pomoc do obiektu GoogleMap, użyj wywołania zwrotnego onMapReady. Wywołanie zwrotne jest wywoływane, gdy mapa jest gotowa do otrzymania danych wejściowych użytkownika. Udostępnia ono niepustą instancję klasy GoogleMap, której można używać do aktualizowania mapy.

W tym przykładzie wywołanie zwrotne onMapReady pobiera nick do obiektu GoogleMap, a potem do mapy dodawany jest znacznik:

Java


@Override
public void onMapReady(GoogleMap googleMap) {
    googleMap.addMarker(new MarkerOptions()
        .position(new LatLng(0, 0))
        .title("Marker"));
}

Kotlin


override fun onMapReady(googleMap: GoogleMap) {
    googleMap.addMarker(
        MarkerOptions()
            .position(LatLng(0.0, 0.0))
            .title("Marker")
    )
}

Zrzut ekranu z mapą i markerem na środku wyspy Null.

Gdy utworzysz i uruchomisz aplikację, pojawi się na niej mapa ze znacznikiem na wyspie Null (szerokość geograficzna zero i zerowa długość geograficzna).

Wyświetl kod dla całej aktywności:

Wyświetl Pełna aktywność

Co dalej

Po wykonaniu tych czynności możesz skonfigurować ustawienia mapy.