Pushpin personalizado para Bing maps en Windows Phone

Estándar

Siguiendo los tutoriales que e hecho sobre Bing Maps y localizacion en WP hoy voy a mostrar distintas formas de implementar los pushpin personalizados ya que la mayoría de los desarrolladores encuentran feo o poco estético el pushpin que trae por defecto WP entonces seguimos trabajando con nuestro demo anterior que se encuentra en este articulo.

Mostrar ubicacion actual en el mapa de bing de WP

vamos a modificar nuestro pushpin de ubicacion. esto no tiene mucha explicacion ya que crearemos un estilo en xaml donde remplazara el pushpin anterior por una imagen PNG.(en image source ponemos la direccion de nuestra imagen que vamos a poner como pushpin) tambien cabe señalar que la imagen del pushpin en sus propiedades debe estar como contenido.

<phone:PhoneApplicationPage.Resources>
<Style TargetType=”my:Pushpin” x:Key=”PushpinStyle”>
<Setter Property=”Template”>
<Setter.Value>
<ControlTemplate TargetType=”my:Pushpin”>
<Image Source=”/marker.png” Stretch=”None”/>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property=”Background” Value=”Black” />
<Setter Property=”Foreground” Value=”White” />
<Setter Property=”FontSize” Value=”18″ />
</Style>
</phone:PhoneApplicationPage.Resources>

en MainPage.xaml.cs  vamos a modificar el “ubicacion_lugar ” para que el puhspin se cambie a la ubicación actual cada vez que el dispositivo cambie de lugar en el mapa.

tambien vamos a implementar this.map1.SetView(ubicacion.Position.Location, 18.0); donde nos hace un zoom en nuestro mapa en la ubicacion actual donde 18 el zomm y ubicacion.location es el lugar donde nos encontramos .Y por último se crea una instancia de la clase Pushpin. nos quedaria haci nuestro codigo:

this.map1.Center = new GeoCoordinate(e.Position.Location.Latitude, e.Position.Location.Longitude);
if (this.map1.Children.Count != 0)
{
var pushpin = map1.Children.FirstOrDefault(p => (p.GetType() == typeof(Pushpin) && ((Pushpin)p).Tag == “locationPushpin”));

if (pushpin != null)
{
this.map1.Children.Remove(pushpin);
}
}

Pushpin locationPushpin = new Pushpin();
locationPushpin.Style = this.Resources[“PushpinStyle”] as Style;

locationPushpin.Tag = “locationPushpin”;
locationPushpin.Location = ubicacion.Position.Location;
this.map1.Children.Add(locationPushpin);
this.map1.SetView(ubicacion.Position.Location, 18.0);
}

y ya tenemos nuestro pushpin modificado nos queda como resultado esto:

también les dejo el codigo de ejemplo! saludos a todos y hasta la proxima  recuerden seguirme en twitter @carlosariash

Un comentario en “Pushpin personalizado para Bing maps en Windows Phone

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s