Okna informacyjne

Wybierz platformę: Android iOS JavaScript

Okno informacyjne wyświetla tekst lub obrazy w wyskakującym okienku nad mapą. Okna informacyjne są zawsze zakotwiczone w znaczniku. Domyślnie wyświetlają się, gdy użytkownik kliknie znacznik.

Przykładowe fragmenty kodu

Repozytorium ApiDemos na GitHubie zawiera przykład, który demonstruje wszystkie funkcje okna informacyjnego:

Wprowadzenie

Okno informacyjne umożliwia wyświetlanie informacji użytkownikowi, gdy kliknie on znacznik. W danym momencie wyświetlane jest tylko 1 okno informacyjne. Jeśli użytkownik kliknie znacznik, bieżące okno informacyjne zostanie zamknięte i pojawi się nowe. Pamiętaj, że jeśli użytkownik kliknie znacznik, który obecnie wyświetla okno informacyjne, okno to zostanie zamknięte i ponownie otwarte.

Okno informacyjne jest wyświetlane na ekranie urządzenia i wyśrodkowane nad powiązanym z nim znacznikiem. Domyślne okno informacyjne zawiera pogrubiony tytuł, a pod nim (opcjonalny) tekst fragmentu.

Dodawanie okna informacyjnego

Najprostszym sposobem dodania okna informacyjnego jest ustawienie metod title() i snippet() odpowiedniego znacznika. Ustawienie tych właściwości spowoduje, że po kliknięciu znacznika pojawi się okno informacyjne.

Kotlin

val melbourneLatLng = LatLng(-37.81319, 144.96298)
val melbourne = map.addMarker(
    MarkerOptions()
        .position(melbourneLatLng)
        .title("Melbourne")
        .snippet("Population: 4,137,400"),
)

Java

final LatLng melbourneLatLng = new LatLng(-37.81319, 144.96298);
Marker melbourne =
        map.addMarker(
                new MarkerOptions()
                        .position(melbourneLatLng)
                        .title("Melbourne")
                        .snippet("Population: 4,137,400"));

Wyświetlanie i ukrywanie okna informacyjnego

Okna informacyjne są zaprojektowane tak, aby reagować na zdarzenia dotknięcia przez użytkownika. Jeśli wolisz, możesz wyświetlić okno informacyjne automatycznie, wywołując metodę showInfoWindow() na znaczniku docelowym. Okno informacyjne można ukryć, wywołując metodę hideInfoWindow().

Kotlin

val melbourneLatLng = LatLng(-37.81319, 144.96298)
val melbourne = map.addMarker(
    MarkerOptions()
        .position(melbourneLatLng)
        .title("Melbourne"),
)
melbourne?.showInfoWindow()
if (melbourne?.isInfoWindowShown == true) {
    melbourne.hideInfoWindow()
}

Java

final LatLng melbourneLatLng = new LatLng(-37.81319, 144.96298);
Marker melbourne =
        map.addMarker(new MarkerOptions().position(melbourneLatLng).title("Melbourne"));
melbourne.showInfoWindow();
if (melbourne.isInfoWindowShown()) {
    melbourne.hideInfoWindow();
}

Możesz też tworzyć okna informacyjne dla poszczególnych znaczników w klastrze. Zapoznaj się z przewodnikiem na temat dodawania okna informacyjnego do poszczególnych znaczników w klastrze.

Niestandardowe okna informacyjne

Możesz też dostosować zawartość i wygląd okien informacyjnych. W tym celu musisz utworzyć konkretną implementację interfejsu InfoWindowAdapter, a następnie wywołać metodę GoogleMap.setInfoWindowAdapter() z tą implementacją. Interfejs zawiera 2 metody, które możesz zaimplementować: getInfoWindow(Marker) i getInfoContents(Marker). Interfejs API najpierw wywoła getInfoWindow(Marker), a jeśli zwróci null, wywoła getInfoContents(Marker). Jeśli ta metoda również zwróci wartość null, zostanie użyte domyślne okno informacyjne.

Pierwsza z nich (getInfoWindow()) umożliwia podanie widoku, który będzie używany w całym oknie informacyjnym. Drugi z nich (getInfoContents()) umożliwia dostosowanie zawartości okna, ale zachowuje domyślną ramkę i tło okna informacyjnego.

Poniższe obrazy przedstawiają domyślne okno informacyjne, okno informacyjne z dostosowaną zawartością oraz okno informacyjne z dostosowaną ramką i tłem.

Porównanie okien informacyjnych

Zdarzenia okna informacyjnego

Przykładowy kod MarkerDemoActivity zawiera przykładowy kod do rejestrowania i obsługi zdarzeń okna informacyjnego.

Możesz użyć OnInfoWindowClickListener, aby nasłuchiwać zdarzeń kliknięcia w oknie informacyjnym. Aby ustawić ten detektor na mapie, wywołaj GoogleMap.setOnInfoWindowClickListener(OnInfoWindowClickListener). Gdy użytkownik kliknie okno informacyjne, wywoływana jest metoda onInfoWindowClick(Marker), a okno informacyjne jest podświetlane domyślnym kolorem (szarym).

Kotlin

map.setOnInfoWindowClickListener { marker ->
    Toast.makeText(
        context,
        "Info window clicked",
        Toast.LENGTH_SHORT,
    ).show()
}

Java

map.setOnInfoWindowClickListener(
        new GoogleMap.OnInfoWindowClickListener() {
            @Override
            public void onInfoWindowClick(Marker marker) {
                Toast.makeText(context, "Info window clicked", Toast.LENGTH_SHORT).show();
            }
        });

Podobnie możesz nasłuchiwać zdarzeń długiego kliknięcia za pomocą interfejsu OnInfoWindowLongClickListener, który możesz ustawić, wywołując metodę GoogleMap.setOnInfoWindowCloseListener(OnInfoWindowCloseListener). Ten detektor działa podobnie do detektora kliknięć i będzie powiadamiany o zdarzeniach długiego kliknięcia za pomocą wywołania zwrotnego onInfoWindowClose(Marker).

Aby otrzymywać powiadomienia o zamknięciu okna informacyjnego, użyj OnInfoWindowCloseListener, który możesz ustawić, wywołując GoogleMap.setOnInfoWindowCloseListener(OnInfoWindowCloseListener). Otrzymasz wywołanie zwrotne onInfoWindowClose(Marker).

Uwaga dotycząca odświeżania okna informacyjnego: zdarzenie onInfoWindowClose() jest wywoływane, gdy użytkownik odświeża okno informacyjne, klikając znacznik, który ma już otwarte okno informacyjne. Jeśli jednak wywołasz metodę Marker.showInfoWindow() w otwartym oknie informacyjnym, zdarzenie onInfoWindowClose() nie zostanie wywołane. To drugie zachowanie opiera się na założeniu, że wiesz, że okno informacyjne zostanie zamknięte i ponownie otwarte.

Jak wspomnieliśmy w poprzedniej sekcji dotyczącej okien informacyjnych, okno informacyjne nie jest widokiem na żywo. Zamiast tego widok jest renderowany jako obraz na mapie. W rezultacie wszystkie detektory ustawione w widoku są ignorowane i nie można odróżnić zdarzeń kliknięcia w różnych częściach widoku. Zalecamy, aby w niestandardowym oknie informacyjnym nie umieszczać komponentów interaktywnych, takich jak przyciski, pola wyboru czy pola tekstowe.