Xamarin Forms : Ejemplo ListView

Hoy vengo a compartirles un sencillo ejemplo de como crear diversos ListView con Xamarin Forms, también tengo otro post donde muestro distintos ejemplos de RecyclerView para Android. 

 

 

 

 


 

La estructura de nuestro proyecto es la siguiente :

Donde : 

Carpeta Model : Tenemos clases genéricas(MenuEjemplo1.cs, MenuPrincipal.cs y Alumnos.cs) donde las llamaremos en las clases llamadas MainPageModel.cs, EjemploListView1Model.cs, EjemploListView2Model.cs y EjemploListView3Model.cs por medio de un objeto ObservableCollection y así poder serializar nuestra información para invocarla desde la vista, a continuación anexo un ejemplo de alguno de nuestros model.

Carpeta Vista : Tenemos nuestros archivos XAML con su respectivo .CS , en los XAML tenemos el esqueleto de nuestros listview a los cuales les asignamos un x:name para así manipularlo desde su respectivo .cs (en la ilustración no se alcanza a persivir los archivos .cs pertenecientes a los .xaml).

En los archivos .cs de las vistas .xaml tenemos la invocación de nuestros model donde simplemente asignamos dicho model al ListView de nuestra vista el objeto ObservableCollection, aparte de otra lógica que nos ayudara para manipular el evento OnClick de cada elemento de nuestro ListView.

Anexo un ejemplo de nuestro .xaml y .cs pertenecientes al model anexado arriba.

XAML

.CS

 

Para finalizar, en nuestro ejemplo estamos haciendo uso de la barra de navegación ( NavigationPage ) para su uso correcto tener contemplato que en nuestro App.xaml.cs declaramos un objeto de tipo NavigationPage donde le pasamos como parametro nuestra vista principal que es la que se ejecuta al inicio de nuestra App.

App.cs

Y para darle estilo a nuestro NavigationPage , color de texto, etc… se agregarón propiedades en nuestro XAML principal al cual pertenece nuestro App.xaml.cs

App.xaml

 

 

 


 

Leave a Reply

Your email address will not be published. Required fields are marked *

*