Finestre informative

Seleziona piattaforma: Android iOS JavaScript

Finestra informativa visualizzata sopra un indicatore.

Una finestra informativa consente di mostrare informazioni all'utente quando tocca un indicatore.

Viene mostrata una finestra informativa orientata sullo schermo del dispositivo, centrata sull'indicatore associato. La finestra informativa predefinita contiene il titolo in grassetto e il testo dello snippet sotto il titolo.

I contenuti della finestra informativa sono definiti dalle proprietà title e snippet dell'indicatore. Se le proprietà title e snippet sono vuote o nil, non viene visualizzata una finestra informativa sull'indicatore.

Viene visualizzata una sola finestra informativa alla volta. Se un utente tocca un altro indicatore, la finestra corrente viene nascosta e si apre la nuova finestra informativa. Se l'utente fa clic su un indicatore che attualmente mostra una finestra informativa, la finestra informativa si chiude e riapre.

Crea una finestra informativa personalizzata per aggiungere testo o immagini aggiuntivi. Una finestra informativa personalizzata ti consente di avere il controllo completo dell'aspetto del popup.

Aggiungere una finestra informativa

Lo snippet che segue crea un indicatore semplice, con solo un titolo per il testo della finestra informativa.

Swift

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

Objective-C

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

Con la proprietà snippet puoi aggiungere del testo aggiuntivo che verrà visualizzato sotto il titolo in un carattere più piccolo. Le stringhe che superano la larghezza della finestra informativa vengono aggregate automaticamente su più righe. I messaggi molto lunghi potrebbero essere troncati.

Swift

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

Objective-C

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

Mostra/nascondi una finestra informativa

Le finestre informative sono progettate per rispondere agli eventi di tocco degli utenti sull'indicatore. Puoi mostrare o nascondere una finestra informativa in modo programmatico impostando la proprietà selectedMarker di GMSMapView:

  • Imposta selectedMarker sul nome dell'indicatore per visualizzarlo.
  • Imposta selectedMarker su nil per nasconderla.

Swift

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

Objective-C

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

Impostare l'aggiornamento automatico di una finestra informativa

Imposta tracksInfoWindowChanges sull'indicatore su YES o true se vuoi che le nuove proprietà o i contenuti della finestra informativa vengano visualizzati immediatamente quando vengono modificati, anziché dover aspettare che la finestra delle informazioni venga nascosta e poi mostrata di nuovo. Il valore predefinito è NO o false.

Swift

london.tracksInfoWindowChanges = true
      

Objective-C

london.tracksInfoWindowChanges = YES;
      

Per decidere quando impostare la proprietà tracksInfoWindowChanges, devi ponderare le prestazioni prestazionali rispetto ai vantaggi della finestra di disegno automatica della finestra informativa. Ad esempio:

  • Se devi apportare una serie di modifiche, puoi modificare la proprietà in YES e poi di nuovo in NO.
  • Quando un'animazione è in esecuzione o i contenuti vengono caricati in modo asincrono, devi mantenere la proprietà impostata su YES fino al completamento delle azioni.

Inoltre, consulta le note relative alla considerazione quando utilizzi la proprietà iconView dell'indicatore.

Modificare la posizione di una finestra informativa

Viene mostrata una finestra informativa orientata sullo schermo del dispositivo, centrata sopra l'indicatore associato. Puoi modificare la posizione della finestra informativa relativa all'indicatore impostando la proprietà infoWindowAnchor. Questa proprietà accetta un CGPoint, definito come un offset (x,y) dove sia x che y sono compresi tra 0,0 e 1,0. L'offset predefinito è (0,5, 0,0), ovvero il centro in alto. L'impostazione dell'offset infoWindowAnchor è utile per allineare la finestra informativa a un'icona personalizzata.

Swift

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

Objective-C

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

Gestire gli eventi nelle finestre informative

Puoi ascoltare i seguenti eventi della finestra informativa:

Per ascoltare gli eventi devi implementare il protocollo GMSMapViewDelegate. Consulta la guida agli eventi e l'elenco dei metodi nella GMSMapViewDelegate.

GitHub include esempi che mostrano come gestire gli eventi della finestra informativa:

Finestre informative personalizzate

Personalizza i contenuti delle finestre informative creando una sottoclasse di UIView che definisce il layout della finestra personalizzata. In quella sottoclasse, definisci la vista nel modo che preferisci. Ad esempio, puoi utilizzare le istanze UILabel personalizzate per visualizzare titolo e testo dello snippet e altre visualizzazioni, come le istanze UIImageView, per aggiungere immagini visualizzate nella finestra informativa.

Assicurati che ViewController implementi il protocollo GMSIndoorDisplayDelegate e definisca un listener per l'evento mapView:identifierInfoWindow:. Questo listener di eventi viene chiamato quando un indicatore sta per essere selezionato e ti consente di restituire un'istanza della classe UIView personalizzata per definire la finestra informativa personalizzata utilizzata dall'indicatore.

Le immagini seguenti mostrano una finestra informativa predefinita, una finestra con contenuti personalizzati e una finestra informativa con sfondo e cornice personalizzate.

Confronto delle finestre informative

Gli esempi di codice su GitHub forniti con l'SDK Maps per iOS includono esempi di finestre informative personalizzate. Ad esempio, consulta la definizione di MarkerInfoWindowViewController.m (Objective-C) o MarkerInfoWindowViewController.swift (Swift).

Consulta gli esempi di codice per informazioni su come scaricare ed eseguire questi esempi.