Tag Archive ListView

Uso de un ListView en Android para mostrar una lista de datos

Un ListView en Android es un objeto que nos permite mostrar una lista de elementos desplazables. Veamos ejemplo de cómo construirlo paso a paso.

En el siguiente ejemplo deseamos mostrar una lista compuesta por  5 estados de México utilizando un ListView en Android.

ListView que muestra una lista de datos estáticos

Paso 1. Crea un proyecto nuevo.

Paso 2. Coloca un ListView usando la vista Diseño.

ListView en Android

ListView en Android

Paso 3.  Crea las variables a utilizar

Entre ellas, una variable de tipo ListView (en MainActivity)

Paso 4. Enlazar

Enlaza la variable anterior con el elemento ListView de la vista Diseño. 

Paso 5. Coloca los datos que quieras mostrar en un Array de Strings

 

Paso 6. Crea un adaptador y agrégale la variable de Strings.

Paso 7. Indica que el listview utilizará ese adaptador.

El resultado hasta aquí es el siguiente:

ListView en Android

ListView en Android

 

 

Agregar un evento Click a un ListView en Android

Paso 1. Creamos un evento ClickListener.

Paso 2. Sobreescribimos la función onItemClick

Pasamos la vista a mostrar, la posición del arreglo de nombres de estado. Si el usuario da clic se mostrará una pequeña ventana de texto mostrando el valor de esa determianda posición.

El resultado hasta aquí es el siguiente

ListView en Android

ListView en Android

Personalizar un ListView en Android

Vamos a Crear un Layout personalizado. 

Paso 1. Da clic derecho en layout (está en la rama de app->res->layot), y selecciona New->Layout resource file.

Paso 2. En la ventana que se abre, escribre como File name: list_item, y como Root element: LinearLayout. Pulse Ok.

Ventana New Resource File

Ventana New Resource File

Paso 3. Coloca un ImageView y un TextView en ese layout.

Paso 4. Personaliza los componentes para ajustar la imagen a la izquierda del texto, viéndose así:

Layout list_item

Layout list_item

El código XML utilizado fue el siguiente:

Paso 5. Crea una nueva clase de Java llamada MyAdapter. 

Ve al menú File->New->Java Class

Como nombre de clase usa MyAdapter.

Paso 6. Código de la clase MyAdapter.

Esta clase crea un Adapter personalizado basado en el layout que creamos.  El código es el siguiente:

 

Paso 7. Enlazar con nuestro adaptador personalizado.

En el MainActivity, agregamos las siguientes líneas:

Y listo!

ListView personalizado en Android

ListView personalizado en Android

Referencias:

1. Android (2018). Vista de lista. Disponible en [https://developer.android.com/guide/topics/ui/layout/listview?hl=es-419]

¿Qué te pareció este artículo?
  • Excelente 
  • Interesante 
  • Regular 
  • No era lo que buscaba 
  • Poco informativo 

Tags, ,