Condividi tramite


Visualizzare informazioni sulle funzionalità

Nota

Ritiro di Android SDK di Mappe di Azure

Azure Maps Native SDK per Android è ora deprecato e verrà ritirato il 3/31/25. Per evitare interruzioni del servizio, eseguire la migrazione al Web SDK di Mappe di Azure entro il 31/3/25. Per altre informazioni, vedere La guida alla migrazione di Android SDK di Mappe di Azure.

I dati spaziali sono spesso rappresentati usando punti, linee e poligoni. Questi dati contengono spesso informazioni sui metadati associate. Ad esempio, un punto può rappresentare la posizione di un ristorante e i metadati relativi a tale ristorante possono essere il nome, l'indirizzo e il tipo di cibo servito. Questi metadati possono essere aggiunti come proprietà di un Feature GeoJSON. Il codice seguente crea una funzionalità punto semplice con una proprietà title con valore "Hello World!"

//Create a data source and add it to the map.
DataSource source = new DataSource();
map.sources.add(source);

//Create a point feature.
Feature feature = Feature.fromGeometry(Point.fromLngLat(-122.33, 47.64));

//Add a property to the feature.
feature.addStringProperty("title", "Hello World!");

//Create a point feature, pass in the metadata properties, and add it to the data source.
source.add(feature);
//Create a data source and add it to the map.
val source = DataSource()
map.sources.add(source)

//Create a point feature.
val feature = Feature.fromGeometry(Point.fromLngLat(-122.33, 47.64))

//Add a property to the feature.
feature.addStringProperty("title", "Hello World!")

//Create a point feature, pass in the metadata properties, and add it to the data source.
source.add(feature)

Per altre informazioni su come creare e aggiungere dati alla mappa, vedere Creare un'origine dati.

Quando un utente interagisce con un elemento della mappa, è possibile utilizzare gli eventi per reagire a tali azioni. Uno scenario comune consiste nel visualizzare un messaggio costituito dalle proprietà dei metadati di una funzionalità con cui l'utente ha interagito. L'evento OnFeatureClick è l'evento principale usato per rilevare quando l'utente ha toccato una funzionalità sulla mappa. C'è anche un evento OnLongFeatureClick. Quando l'evento OnFeatureClick viene aggiunto alla mappa, può essere limitato a un singolo livello passando l'ID di un livello a cui limitarlo. Se non viene passato alcun ID livello, toccando qualsiasi caratteristica sulla mappa, indipendentemente dal livello in cui si trova, verrà generato questo evento. Il codice seguente crea un livello simbolo per il rendering dei dati dei punti sulla mappa, quindi aggiunge un evento OnFeatureClick e lo limita a questo livello simbolo.

//Create a symbol and add it to the map.
SymbolLayer layer = new SymbolLayer(source);
map.layers.add(layer);

//Add a feature click event to the map.
map.events.add((OnFeatureClick) (features) -> {
    //Retrieve the title property of the feature as a string.
    String msg = features.get(0).getStringProperty("title");

    //Do something with the message.

    //Return a boolean indicating if event should be consumed or continue bubble up.
    return false;
}, layer.getId());    //Limit this event to the symbol layer.
//Create a symbol and add it to the map.
val layer = SymbolLayer(source)
map.layers.add(layer)

//Add a feature click event to the map.
map.events.add(OnFeatureClick { features: List<Feature> ->
    //Retrieve the title property of the feature as a string.
    val msg = features[0].getStringProperty("title")

    //Do something with the message.

    //Return a boolean indicating if event should be consumed or continue bubble up.
    return false
}, layer.getId()) //Limit this event to the symbol layer.

Visualizzare un messaggio di avviso popup

Un messaggio di avviso popup è uno dei modi più semplici per visualizzare informazioni all'utente ed è disponibile in tutte le versioni di Android. Non supporta alcun tipo di input dell'utente e viene visualizzato solo per un breve periodo di tempo. Se si vuole informare rapidamente l'utente di cosa ha toccato, un messaggio di avviso popup potrebbe essere una buona opzione. Nel codice seguente viene illustrato come usare un messaggio di avviso popup con evento OnFeatureClick.

//Add a feature click event to the map.
map.events.add((OnFeatureClick) (features) -> {
    //Retrieve the title property of the feature as a string.
    String msg = features.get(0).getStringProperty("title");

    //Display a toast message with the title information.
    Toast.makeText(this, msg, Toast.LENGTH_SHORT).show();

    //Return a boolean indicating if event should be consumed or continue bubble up.
    return false;
}, layer.getId());    //Limit this event to the symbol layer.
//Add a feature click event to the map.
map.events.add(OnFeatureClick { features: List<Feature> ->
    //Retrieve the title property of the feature as a string.
    val msg = features[0].getStringProperty("title")

    //Display a toast message with the title information.
    Toast.makeText(this, msg, Toast.LENGTH_SHORT).show()

    //Return a boolean indicating if event should be consumed or continue bubble up.
    return false
}, layer.getId()) //Limit this event to the symbol layer.

Animazione di una funzionalità toccata e visualizzazione di un messaggio di avviso popup

Oltre ai messaggi di avviso popup, esistono molti altri modi per presentare le proprietà dei metadati di una funzionalità, ad esempio:

  • Widget Snackbar - Snackbars fornire feedback leggero su un'operazione. Vengono visualizzati un breve messaggio nella parte inferiore dello schermo su dispositivi mobili e in basso a sinistra su dispositivi più grandi. Snackbars appaiono sopra tutti gli altri elementi sullo schermo e può essere visualizzato solo uno alla volta.
  • Dialogo: una finestra di dialogo è una finestra di piccole dimensioni che richiede all'utente di prendere una decisione o immettere informazioni aggiuntive. Una finestra di dialogo non riempie la schermata e viene in genere usata per gli eventi modali che richiedono agli utenti di eseguire un'azione prima di poter continuare.
  • Aggiungere un frammento all'attività corrente.
  • Passare a un'altra attività o visualizzazione.

Visualizzare un popup

Android SDK di Mappe di Azure offre una classe Popup che semplifica la creazione di elementi di annotazione dell'interfaccia utente ancorati a una posizione sulla mappa. Per i popup, è necessario passare una visualizzazione con un layout relativo nell'opzione content del popup. Ecco un semplice esempio di layout che visualizza il testo scuro sopra uno sfondo.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:background="#ffffff"
    android:layout_margin="8dp"
    android:padding="10dp"

    android:layout_height="match_parent">

    <TextView
        android:id="@+id/message"
        android:layout_width="wrap_content"
        android:text=""
        android:textSize="18dp"
        android:textColor="#222"
        android:layout_height="wrap_content"
        android:width="200dp"/>

</RelativeLayout>

Supponendo che il layout precedente sia archiviato in un file denominato popup_text.xml nella cartella res -> layout di un'app, il codice seguente crea un popup, lo aggiunge alla mappa. Quando si fa clic su una funzionalità, la proprietà title viene visualizzata utilizzando il layout popup_text.xml, con il centro inferiore del layout ancorato alla posizione specificata sulla mappa.

//Create a popup and add it to the map.
Popup popup = new Popup();
map.popups.add(popup);

map.events.add((OnFeatureClick)(feature) -> {
    //Get the first feature and it's properties.
    Feature f = feature.get(0);
    JsonObject props = f.properties();

    //Retrieve the custom layout for the popup.
    View customView = LayoutInflater.from(this).inflate(R.layout.popup_text, null);

    //Access the text view within the custom view and set the text to the title property of the feature.
    TextView tv = customView.findViewById(R.id.message);
    tv.setText(props.get("title").getAsString());

    //Get the position of the clicked feature.
    Position pos = MapMath.getPosition((Point)cluster.geometry());

    //Set the options on the popup.
    popup.setOptions(
        //Set the popups position.
        position(pos),

        //Set the anchor point of the popup content.
        anchor(AnchorType.BOTTOM),

        //Set the content of the popup.
        content(customView)

        //Optionally, hide the close button of the popup.
        //, closeButton(false)

        //Optionally offset the popup by a specified number of pixels.
        //pixelOffset(new Pixel(10, 10))
    );

    //Open the popup.
    popup.open();

    //Return a boolean indicating if event should be consumed or continue bubble up.
    return false;
});
//Create a popup and add it to the map.
val popup = Popup()
map.popups.add(popup)

map.events.add(OnFeatureClick { feature: List<Feature> ->
    //Get the first feature and it's properties.
    val f = feature[0]
    val props = f.properties()

    //Retrieve the custom layout for the popup.
    val customView: View = LayoutInflater.from(this).inflate(R.layout.popup_text, null)

    //Access the text view within the custom view and set the text to the title property of the feature.
    val tv: TextView = customView.findViewById(R.id.message)
    tv.text = props!!["title"].asString

    //Get the position of the clicked feature.
    val pos = MapMath.getPosition(f.geometry() as Point?);

    //Set the options on the popup.
    popup.setOptions( 
        //Set the popups position.
        position(pos),  

        //Set the anchor point of the popup content.
        anchor(AnchorType.BOTTOM),  

        //Set the content of the popup.
        content(customView) 

        //Optionally, hide the close button of the popup.
        //, closeButton(false)

        //Optionally offset the popup by a specified number of pixels.
        //pixelOffset(Pixel(10, 10))
    )

    //Open the popup.
    popup.open()

    //Return a boolean indicating if event should be consumed or continue bubble up.
    false
})

Il ritaglio di schermata seguente mostra i popup visualizzati quando vengono selezionate le funzionalità e rimangono ancorate alla posizione specificata sulla mappa mentre si sposta.

Animazione di un popup visualizzato e spostamento della mappa con il popup ancorato a una posizione sulla mappa

Passaggi successivi

Per aggiungere altri dati alla mappa: