ListView Xamarin.Forms

Download SampleDescargar el ejemplo

ListView es una vista para presentar listas de datos, especialmente listas largas que necesitan desplazamiento.

Importante

CollectionView es una vista para presentar listas de datos con diferentes especificaciones de diseño. Su objetivo es proporcionar una alternativa a ListView más flexible y con mejor rendimiento. Para obtener más información, vea CollectionView de Xamarin.Forms.

Casos de uso

Un control ListView se puede usar en cualquier situación en la que se muestren listas de datos desplazables. La clase ListView admite acciones de contexto y enlace de datos.

El control ListView no debe confundirse con el control TableView. El control TableView es una opción mejor siempre que tenga una lista no enlazada de opciones o datos porque permite especificar opciones predefinidas en XAML. Por ejemplo, la aplicación de configuración de iOS, que principalmente tiene un conjunto de opciones predefinidas, es más adecuada para usar una instancia de TableView que de ListView.

La clase ListView no admite la definición de elementos de lista en XAML; debe usar la propiedad ItemsSource o el enlace de datos con ItemTemplate para definir elementos de la lista.

ListView resulta más adecuado para las colecciones que constan de un único tipo de datos. Este requisito se debe a que solo se puede usar un tipo de celda para cada fila de la lista. El control TableView puede admitir varios tipos de celda, por lo que es una mejor opción cuando se necesitan mostrar varios tipos de datos.

Para más información sobre el enlace de datos a una instancia de ListView, vea Orígenes de datos de ListView.

Componentes

El control ListView tiene una serie de componentes disponibles para ejercer la funcionalidad nativa de cada plataforma. Estos componentes se definen en las secciones siguientes.

Encabezados y pies de página

Los componentes de encabezado y pie de página se muestran al principio y al final de una lista, separados de los datos de la lista. Los encabezados y pies de página se pueden enlazar a un origen de datos independiente del origen de datos de ListView.

Grupos

Los datos de una instancia de ListView se pueden agrupar para facilitar la navegación. Los grupos suelen estar enlazados a datos. En la captura de pantalla siguiente se muestra un elemento ListView con datos agrupados:

Celdas

Los elementos de datos de una instancia de ListView se denominan celdas. Cada celda se corresponde a una fila de datos. Hay celdas integradas entre las que elegir, o bien puede definir una celda personalizada propia. Tanto las celdas integradas como las personalizadas se pueden usar o definir en XAML o código.

  • Las celdas integradas, como TextCell y ImageCell, se corresponden a controles nativos y son especialmente eficaces.
    • TextCell muestra una cadena de texto, opcionalmente con texto de detalle. El texto de detalle se representa como una segunda línea en una fuente más pequeña con un color de énfasis.
    • ImageCell muestra una imagen con texto. Aparece como una instancia de TextCell con una imagen a la izquierda.
  • Las celdas personalizadas se usan para presentar datos complejos. Por ejemplo, se podría usar una celda personalizada para presentar una lista de canciones que incluye el álbum y el intérprete.

En la captura de pantalla siguiente se muestra una instancia de ListView con elementos ImageCell:

Para más información sobre la personalización de celdas en ListView, vea Personalización de la apariencia de las celdas de ListView.

Funcionalidad

La clase ListView admite una serie de estilos de interacción.

  • La extracción para actualizar permite al usuario extraer ListView para actualizar el contenido.
  • Las acciones de contexto permiten al desarrollador especificar acciones personalizadas en elementos de lista individuales. Por ejemplo, puede implementar acciones de deslizamiento del dedo en iOS o acciones de pulsación larga en Android.
  • La selección permite que el desarrollador adjunte funcionalidad a los eventos de selección y anulación de la selección en elementos de lista.

En la captura de pantalla siguiente se muestra un elemento ListView con acciones de contexto:

Para más información sobre las características de interactividad de ListView, vea Acciones e interactividad con ListView.