Usar ListPicker en Windows Phone

Estándar

Bueno hoy terminando una aplicación con algunas opciones se me presento una gran duda de como integra un comboBox en WP. pero buscando material encontré algunos documentos que apuntaban como integrar un comboBox diseñando algunos temas para que se asemeje al Style UI, pero se iba la estética de nuestra aplicación, entonces encontré la mejor solución es ocupar ListPicker la función de este control es la misma que un ComboBox pero diseñado para WP.

Para tener acceso a este control debemos descargar el Silverlight ToolKit e instalar lo cual nos agrega varias funciones a nuestro Visual Studio el SDK 7.1.1 ya viene integrado con este toolkit

ya teniendo todo instalado creamos un nuevo proyecto para WP

En MainPage.xaml insertamos esto:

xmlns:toolkit=”clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit”
quedándonos como resultado esto:

si da un error al lado donde dice references agregen una referencia y busquen esta  Microsoft.Phone.Controls.Toolkit.dll si no la tienen no se preocupen la pueden descargar de aca 

ya teniendo esto sin errores. agregamos este code al xaml  para que se muestre en nuestra aplicacion

<toolkit:ListPicker x:Name=”LP” Header=”Opciones” FullModeHeader=”Opciones” CacheMode=”BitmapCache” Margin=”12,45,25,-71″>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<StackPanel Orientation=”Horizontal” Margin=”16 21 0 20″>
<Rectangle Fill=”{Binding}” Width=”43″ Height=”43″ />
<TextBlock Text=”{Binding}” Margin=”16 0 0 0″ FontSize=”43″ FontFamily=”{StaticResource PhoneFontFamilyLight}” />
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>

quedando como resultado esto.


ya teniendo el diseño de esto vamos a cargarlo con datos desde MainPage.xaml.cs

string[] lista = { “Busta Rhymes”, “50 Cent”, “BCC”, “OGC”, “Ludacris”, “D12”, “RAH DIGGA”,
“Mercy”, “Black Moon” };

estos son los datos que estaran cargados en nuesto LP,despues en el InitializeComponent(); agregamos:

LP.ItemsSource = lista;

esto direcciona nuestra lista al LP para que se muestren al momento de correr la aplicación, ListPicker tiene una característica que no se pueden agregar mas de 5 elementos por medio de xaml por eso cargamos los datos  por medio de code C#

entonces ya teniendo los datos cargados nuestro mainPage.xaml.cs queda de esta forma

y listo ahora podemos correr nuestra aplicación y ver como funciona de plano al iniciar nos queda de esta forma

ya al hacer click al listPicker nos aparece las demás opciones

también cabe señalar cuando son menos de 5 datos o opciones nos quedara de esta forma. ya no se habré la ventanilla mostrando los datos hacia abajo

Bueno y esto seria todo aca le dejo el codigo de ejemplo para que lo revisen ! saludos y hasta la proxima!🙂

2 comentarios en “Usar ListPicker en Windows Phone

  1. Buenas si yo quiero usar el listPicker como un manejador de eventos, por lo menos selecciono un elemento del LP y que me salga algo en un textblock o se active una como o que al seleccionarlo y darle a un button me salga algo????. muchas gracias por cierto tu explicacion es muy sencilla limpia y entendible deberias hacer tutos de los otros tools.

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