ListView WPF

Un control ListView en WPF contiene la infraestructura necearía para presentar de forma organizada información en distintos tipos de vistas, el uso común que le damos al control ListView es el de mostrar información en diferentes columnas.

Agregar elementos a un ListView


Lo primero que haremos será crear nuestra aplicación WPF, en la ventana agregamos un control ListView que podemos arrastrar del cuadro de herramientas, lo llamaremos listView.

Para el ejemplo usaremos la clase persona y la enum País que representa los datos que vamos a mostrar en el ListView y se definen como sigue:

 class Persona
 {
     public int Edad { get; set; }
     public string Nombre { get; set; }
     public Pais Residencia { get; set; }
 }
 
 enum Pais
 {
     Panama,
     España,
     Argentina
 }

Para agregar elementos de la clase persona el ListView la forma más sencilla es atreves  de su propiedad Items, veamos un ejemplo de como agregar 3 objetos de la clase persona:

 listView.Items.Add(new Persona()
 {
     Edad = 10,
     Nombre = "Juan",
     Residencia = Pais.Panama
 });
 
 listView.Items.Add(new Persona()
 {
     Edad = 20,
     Nombre = "Miguel",
     Residencia = Pais.España
 });
 
 listView.Items.Add(new Persona()
 {
     Edad = 28,
     Nombre = "Andrez",
     Residencia = Pais.Argentina
 });

Si en este momento ejecutamos la aplicación veremos algo como esto:

1. listview

En este momento el ListView esta en modo GridView pero no hemos definido como deben mostrarse los datos, por lo que el control está mostrando los que devuelve el método toString() de la clase persona como no lo hemos sobrescrito muestra lo que vemos arriba, podríamos sobrescribir este método para que devolviera el nombre de la persona o cualquier otro dato, pero no es la más practico.


Definir las columnas de un GridView


Un control GridView en un modo  de vista para los controles ListView estos muestran los datos en forma de columna, vemos como hacer para que muetre los datos deseados en nuestro ejemplo.

Vamos al código xaml localizamos el ListView y agregamos los correspondientes <GridViewColumn />, definimos la propiedad Header con lo que queremos que muestre la pestaña, hecho esto se debería ver de este modo:

 <ListView x:Name="listView">
     <ListView.View>
         <GridView>
             <GridViewColumn Header="Nombre" />
             <GridViewColumn Header="Edad" />
             <GridViewColumn Header="Pais de Recidencia" />
         </GridView>
     </ListView.View>
 </ListView>

Con esto definimos tres columnas para el ListView pero aun no se muestra nada, seguimos viendo lo mismo que antes solo que en tres columnas.


Enlazar datos a un GridViewColumn


Lo que haremos ahora será enlazar cada columna a la correspondiente propiedad de la clase persona para que muestre su valor en la fila que le corresponda, usaremos DisplayMemberBinding="{Binding PersonProperty}" para hacer el enlace de la columna con una determinada propiedad de la clase.

Los GridViewColumn con los correspondientes enlaces se verán de este modo:
 <GridViewColumn Header="Nombre"
                 DisplayMemberBinding="{Binding Nombre}" />
 <GridViewColumn Header="Edad"
                 DisplayMemberBinding="{Binding Edad}" />
 <GridViewColumn Header="Pais de Recidencia"
           DisplayMemberBinding="{Binding Residencia}" />

2. listView

Lo próximo que veremos será como personalizar el GridView.

Descargar WPF-ListView

Comentarios

  1. Por fin alguien que lo explica de una manera clara. Muchas gracias

    ResponderEliminar
  2. Grácias, muy bien explicado. Algun ejemplo para windows forms?

    ResponderEliminar

Publicar un comentario

Temas relacionados

Entradas populares de este blog

tkinter Grid

tkinter Canvas

Histogramas OpenCV Python

Conectar SQL Server con Java