Nuestro primer ListView en Android con Java

Este es el tercer tutorial de la serie Fundamentos de Android con Java. En este tutorial vamos a aprender algunos conceptos de un activity y como crear un ListView simple para realizar una lista de compras estática.

Índice

  1. Crear, abrir y enviar datos a un activity
  2. ListView
  3. Gestión de click en un ListView
  4. Tu turno
  5. El código

1. Crear, abrir y enviar datos a un activity

Para poder crear un activity en un proyecto ya iniciado de Android Studio seguimos los pasos que se muestran a continuación. Como puedes ver podemos escoger de entre varios tipos de activities, el que comúnmente usaremos aquí es el Empty Activity ya que nos crea un activity vacío para nosotros comenzar a desarrollar y crear la lógica en su interior.

Lo común luego de crear un activity nuevo en un proyecto es hacer que este activity se abra al presionar un botón o después de algún evento. Para hacer esto tenemos a los Intents. Un Intent es como un mensajero que usamos en Android para solicitar una acción a otro componente del proyecto. En este caso usaremos al Intent para solicitar que un Activity se cree.

Entonces para abrir un Activity debemos comenzar creando un Intent donde enviemos el activity que deseamos abrir como parámetro para finalmente activiar el Intent dentro de alguna función o evento. Entonces para abrir un Activity llamado Page2 usamos el siguiente código.

// Declaramos el intet
Intent intentPage2 = new Intent(MainActivity.this, Page2.class);

// Activamos el intent para abrir el Activity Page2
startActivity(intentPage2);

Si lo que queremos es enviar datos a un activity debemos usar el método putExtra() con el que podremos enviar datos primitivos de un activity a otro. Entonces veamos el siguiente ejemplo de código.

// Creamos el mensaje debe ser de tipo primitivo
String message = "Shopping List";

// Creamos el intent
Intent goActivity = new Intent(MainActivity.this, ListActivity.class);

// Utilizamos el método putExtra del intent para darle un identificador o nombre al mensaje y el mensaje a enviar
goActivity.putExtra("miMessage", message);

// Activamos el intent que abrirá el activity y enviará el mensaje
startActivity(goActivity);

Ahora para recibir el mensaje en el activity abierto usamos el objeto Bundle junto con los métodos getIntent() para obtener la referencia al intent que lo abrió y getExtras() para obtener la referencia al Extra que enviamos en el intent. Usaremos estos métodos como en el siguiente ejemplo podremos obtener y almacenar el mensaje que fue enviado al Activity.

// Bundle es el tipo de dato que recibirá nuestro mensaje
Bundle extras = getIntent().getExtras();

// Obtenemos el mensaje dentro de una variable usando el nombre o identificador que le dimos al mensaje
String name = extras.getString("miMessage");

Ahora si lo que queremos es mostrar ese String en un TextView usamos el método setText(name) del TextView donde deseamos mostrar el mensaje.

2. ListView

Un ListView es un widget de Android que nos permite mostrar una lista de algún Layout que a su vez puede contener otros Widgets. En este tutorial aprenderemos a crear la forma más básica de este Widget el cual solo tendrá TextViews en su interior. El XML de este widget es bastante simple, la magia ocurre en el código Java para rellenar este ListView.

<ListView
    android:id="@+id/lst_Shopping"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

Ahora como hacemos para mostrar el siguiente arreglo dentro de un ListView.

// Variables de la clase
List<String> miLista;

// Dentro del onCreate
miLista = new ArrayList<String>();
miLista.add("Apple");
miLista.add("Orange");
miLista.add("Tomatoe");
miLista.add("Patata");

Lo primero que tenemos que hacer es convertir estos datos en elementos visuales. Para eso usamos el concepto de Adaptador o Adapter. Este es un objetoal que entregaremos una lista de datos como un arrayList y además un layout para que nos devuelva una lista de elementos visuales, con esos datos, que luego podremos entregarle al ListView para que lo muestre en nuestro Activity.

Entonces, ya tengo el arreglo con los datos, ahora como creo el layout. En futuros tutoriales veremos como crear nuestro propio layout y usar un adaptador creado por nosotros mismo para ordenar los valores que queremos colocar. Sin embargo, en este tutorial usaremos un layout listo que nos proporciona Android Studio, de nombre android.R.layout.simple_list_item_1 y un adaptador que a partir del objeto ArrayAdapter que nos proporciona también Android Studio. Veámoslo en el siguiente ejemplo.

// Creamos el adaptador al cual tenemos que pasarle tres parametros
// 1. El View donde se ejecutará en este caso this, osea este Activity
// 2. El layout para la lista
// 3. La lista de elementos
ArrayAdapter adapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, miLista);

// Entrego el adaptador al ListView usando el método setAdapter
lista.setAdapter(adapter);

3. Gestión de click en un ListView

Ahora aprenderemos a gestionar el evento click dentro de un ListView. Para gestionar el evento click del ListView debemos de hacer uso de su método llamado setOnItemClickListener.

lista.setOnItemClickListener();

Este al igual que el listener de un botón necesita como parámetro un objeto que implemente una interface, en este caso la interface que necesita es AdapterView.OnItemClickListener y su clase debe sobreescribir el método onItemClick. Pero como ya sabemos podemos definir esta clase dentro de los paréntesis del parámetro como en el siguiente ejemplo.

lista.setOnItemClickListener(new AdapterView.OnItemClickListener() {
    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
        // Position es el indice del elemento del ListView donde hacemos click
    }
});

Como vemos este método tiene varios parámetros, por ahora el más importante es el parámetro position que nos proporciona la posición o índice del elemento de la lista donde se hizo tap. Usando este índice podemos saber a que ítem de la lista se hizo click o tap.

4. Tu turno

Usando estos conceptos que acabamos de aprender de Android te animo a realizar el siguiente proyecto. Una aplicación que abre un activity y muestra una lista estática usando un ListView.

Cuando quieras puedes ver el código del proyecto terminado. Pero ándale inténtalo tu mismo!!

5. El código

El código de este proyecto está en el siguiente repositorio de GitHub: github.com/andygeek/ShoppingListJava