Personalizzare l'aspetto del PushPin di una mappa in Windows Phone

di Marco Leoncini, in Windows Phone 7.1, Windows Phone,

Il Controllo Map, mutuato dal controllo Bing Map per Silverlight, e distribuito per Windows Phone mediante l'SDK ufficiale, offre un elevato livello di pesonalizzazione dei PushPin.
I PushPin indicano l'esatta posizione di una coordinata ed il loro aspetto predefinito è semplice e non mostra molte informazioni.

Trattandosi di un controllo a tutti gli effetti, è posibile personalizzarne l'aspetto con un Style e poche righe di XAML.

<map:Pushpin Location="{Binding Coordinate}" 
                      Content="{Binding Position}" 
                      Template="{StaticResource MyPushpinControlTemplate}"/>

<ControlTemplate x:Key="MyPushpinControlTemplate" TargetType="map:Pushpin">
  <Grid>
    <Image HorizontalAlignment="Center" 
                 Source="/Images/pushpin_raw.png" 
                 Stretch="None" 
                 VerticalAlignment="Center"/>
    <ContentPresenter Content="{TemplateBinding Content}" 
                                 VerticalAlignment="Center" HorizontalAlignment="Center"
          ContentTemplate="{TemplateBinding ContentTemplate}"/>
   </Grid>
</ControlTemplate>

Il markup è molto semplice: il Content, impostato mediante data binding, mostra il proprio contenuto allineato centralmente rispetto ad un'immagine di sfondo.
Nel nostro caso, il markup è volutamente semplice, ma può diventare complesso per modellarsi perfettamente alle esigenze dell'applicazione.

Il risultato che si può ottenere è visibile in questa immagine:

Commenti

Visualizza/aggiungi commenti

| Condividi su: Twitter, Facebook, LinkedIn

Per inserire un commento, devi avere un account.

Fai il login e torna a questa pagina, oppure registrati alla nostra community.

Approfondimenti

I più letti di oggi