Infofenster

In einem Infofenster können Sie Informationen für Nutzer präsentieren, die auf eine Markierung tippen.

Ein Infofenster wird am Bildschirm des Geräts ausgerichtet und über der zugehörigen Markierung zentriert. Das standardmäßige Infofenster enthält den fett formatierten Titel. Der Snippet-Text befindet sich unterhalb des Titels.

Der Inhalt des Infofensters wird durch die Eigenschaften title und snippet der Markierung definiert. Wenn auf die Markierung geklickt wird, wird kein Infofenster angezeigt, wenn die Attribute title und snippet leer oder nil sind.

Es wird immer nur ein Infofenster gleichzeitig eingeblendet. Wenn ein Nutzer auf eine andere Markierung tippt, wird das aktuelle Fenster ausgeblendet und das neue Infofenster wird geöffnet. Wenn der Nutzer auf eine Markierung klickt, für die derzeit ein Infofenster angezeigt wird, wird dieses Infofenster geschlossen und wieder geöffnet.

Erstellen Sie ein benutzerdefiniertes Infofenster, um zusätzlichen Text oder Bilder hinzuzufügen. In diesem Fall können Sie die Darstellung des Pop-ups vollständig steuern.

Infofenster hinzufügen

Mit dem folgenden Snippet wird eine einfache Markierung mit einem Titel für den Text des Infofensters erstellt.

let position = CLLocationCoordinate2D(latitude: 51.5, longitude: -0.127)
let london = GMSMarker(position: position)
london.title = "London"
london.map = mapView
      

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.title = @"London";
london.map = mapView;
      

Mit dem Attribut snippet kannst du zusätzlichen Text in kleinerer Schrift unter dem Titel hinzufügen. Strings, die länger als die Breite des Infofensters sind, werden automatisch auf mehrere Zeilen umgebrochen. Sehr lange Nachrichten werden möglicherweise gekürzt.

london.title = "London"
london.snippet = "Population: 8,174,100"
london.map = mapView
      

london.title = @"London";
london.snippet = @"Population: 8,174,100";
london.map = mapView;
      

Infofenster anzeigen/ausblenden

Infofenster sind so konzipiert, dass sie auf Touch-Ereignisse des Nutzers auf der Markierung reagieren. Sie können ein Infofenster programmatisch einblenden oder ausblenden. Dazu legen Sie das Attribut selectedMarker von GMSMapView fest:

• Setzen Sie selectedMarker auf den Namen der Markierung, um sie anzuzeigen.
• Setzen Sie selectedMarker auf nil, um sie auszublenden.

london.title = "London"
london.snippet = "Population: 8,174,100"
london.map = mapView
// Show marker
mapView.selectedMarker = london
// Hide marker
mapView.selectedMarker = nil
      

london.title = @"London";
london.snippet = @"Population: 8,174,100";
london.map = mapView;
// Show marker
mapView.selectedMarker = london;
// Hide marker
mapView.selectedMarker = nil;
      

Ein automatisches Fenster für die Aktualisierung festlegen

Setzen Sie tracksInfoWindowChanges für die Markierung auf YES oder true, wenn neue Eigenschaften oder der Inhalt des Infofensters sofort nach dem Ändern angezeigt werden sollen, anstatt darauf warten zu müssen, dass das Infofenster ausgeblendet und dann wieder angezeigt wird. Der Standardwert ist NO oder false.

london.tracksInfoWindowChanges = true
      

london.tracksInfoWindowChanges = YES;
      

Berücksichtigen Sie bei der Entscheidung, wann die Property tracksInfoWindowChanges festgelegt werden soll, die Leistungsvorteile und die Vorteile, die das automatische Neuziehen des Infofensters mit sich bringt. Beispiel:

• Wenn Sie eine Reihe von Änderungen vornehmen möchten, können Sie das Attribut zu YES und dann wieder zu NO ändern.
• Wenn eine Animation ausgeführt wird oder die Inhalte asynchron geladen werden, sollten Sie das Attribut auf YES gesetzt lassen, bis die Aktionen abgeschlossen sind.

Weitere Informationen finden Sie in den Hinweisen zur Verwendung des Attributs iconView der Markierung.

Position eines Infofensters ändern

Infofenster werden am Gerätebildschirm ausgerichtet und über der zugehörigen Markierung zentriert. Sie können die Position des Infofensters relativ zur Markierung ändern, indem Sie die Eigenschaft infoWindowAnchor festlegen. Für dieses Attribut ist ein CGPoint zulässig, definiert als (x,y) Offset, wobei x und y zwischen 0,0 und 1,0 liegen. Der Standardversatz ist (0,5, 0,0), also die Mitte oben. Mit dem infoWindowAnchor-Offset lässt sich das Infofenster an einem benutzerdefinierten Symbol ausrichten.

london.infoWindowAnchor = CGPoint(x: 0.5, y: 0.5)
london.icon = UIImage(named: "house")
london.map = mapView
      

london.infoWindowAnchor = CGPointMake(0.5, 0.5);
london.icon = [UIImage imageNamed:@"house"];
london.map = mapView;
      

Ereignisse in Infofenstern verarbeiten

Sie können die folgenden Ereignisse im Infofenster erfassen:

• mapView:markerInfoWindow:: Wird aufgerufen, wenn eine Markierung ausgewählt wird. Optional kann ein benutzerdefiniertes Infofenster als UIView-Element zurückgegeben werden, das für die Markierung verwendet wird. Weitere Informationen finden Sie unter Benutzerdefinierte Infofenster.

• mapView:markerInfoContents: – Wird aufgerufen, wenn mapView:markerInfoWindow null zurückgibt.

• mapView:didCloseInfoWindowOfMarker:: Wird aufgerufen, wenn das Infofenster der Markierung geschlossen ist.

• mapView:didLongPressInfoWindowOfMarker:: Wird aufgerufen, nachdem das Infofenster der Markierung lange gedrückt wurde.

Wenn Sie Ereignisse beobachten möchten, müssen Sie das Protokoll GMSMapViewDelegate implementieren. Weitere Informationen finden Sie im Leitfaden zu Ereignissen und in der Liste der Methoden in GMSMapViewDelegate.

GitHub enthält Beispiele zur Verarbeitung von Infofensterereignissen:

• Ziel C
• Swift

Benutzerdefinierte Infofenster

Passen Sie den Inhalt von Infofenstern an, indem Sie eine Unterklasse von UIView erstellen, die das Layout des benutzerdefinierten Infofensters definiert. Definieren Sie in dieser Unterklasse die Ansicht, die Sie möchten. Sie können beispielsweise benutzerdefinierte UILabel-Instanzen verwenden, um Titel- und Snippet-Text und andere Ansichten wie UIImageView-Instanzen anzuzeigen, um im Infofenster angezeigte Bilder hinzuzufügen.

Achten Sie darauf, dass ViewController das GMSIndoorDisplayDelegate-Protokoll implementiert und einen Listener für das Ereignis mapView:markerInfoWindow: definiert. Dieser Event-Listener wird aufgerufen, wenn eine Markierung ausgewählt wird. Damit können Sie eine Instanz der benutzerdefinierten UIView-Klasse zurückgeben, um das von der Markierung verwendete benutzerdefinierte Infofenster zu definieren.

Die folgenden Bilder zeigen ein Standardinfofenster, ein Infofenster mit angepasstem Inhalt und ein Infofenster mit angepasstem Rahmen und Hintergrund.

Die mit dem Maps SDK for iOS gelieferten Codebeispiele auf GitHub enthalten Beispiele für benutzerdefinierte Infofenster. Beispiel: Definition von MarkerInfoWindowViewController.m (Objective-C) oder MarkerInfoWindowViewController.swift (Swift)

Informationen zum Herunterladen und Ausführen dieser Beispiele finden Sie unter Codebeispiele.