Está en la página 1de 4

Centro de Comercio y Servicios

Regional Cauca

GUIA #2. SPINNER y LISTVIEW

1. Creación del proyecto


Si no se tiene claro cómo crear el proyecto, revisamos la GUIA 0 (PARTE 2). En este caso la mínima versión de sdk que
seleccionamos es el API 8.

2. Diseño de layout
El diseño que vamos a trabajar nos debe permitir ver el funcionamiento de un Spinner como un ListView, por tal
razón en el layout que se crea con el proyecto vamos a realizar el siguiente diseño:

Los textos Spinner y ListView deben estar definidos dentro del fichero strings.xml:

Como ya hemos visto, existen diferentes formas de diseñar la interfaz de usuario anterior, aquí mostramos solo una
de ellas usando un RelativeLayout:

Oscar Viveros Egas. ohviveros@misena.edu.co


Centro de Comercio y Servicios
Regional Cauca

Con el diseño creado, podemos continuar con el desarrollo de nuestra aplicación.

3. Adaptadores en Android
El manejo de ListView y de Spinner en android supone el uso de adaptadores. Todos los controles de selección (como
un Spinner o un ListView) accederán a los datos que contienen a través de un adaptador. Es este adaptador quien
define lo que se muestra en el contenido de un control de selección.

Existen dos opciones para definir el contenido de lo que se quiere mostrar de forma estática, la primera es mediante
código java definiendo un arreglo con los datos y la segunda es definiéndolos en un fichero xml. Para efectos de la
guía vamos a ver las dos formas, pero se recomiendo el uso del fichero xml.

a. Datos contenidos en java


Dentro del código de la actividad que se creó con el proyecto, MainActivity.java, vamos a agregar un arreglo
de String que contenga la información que queremos mostrar:

b. Datos contenidos en fichero xml


Dentro de la carpeta /res/values creamos un nuevo archivo xml de android al que llamaremos
valores_array.xml

Dentro de este fichero definimos los valores seleccionables, así:

Oscar Viveros Egas. ohviveros@misena.edu.co


Centro de Comercio y Servicios
Regional Cauca

4. Mostrar los datos


Con lo anterior, para poder mostrar los elementos seleccionables vamos a definir los componentes Spinner y
ListView al interior de la actividad MainActivity.java y, haciendo uso de un adaptador, asignarle dichos elementos.

a. Spinner
Lo primero que debemos hacer es definir el objeto spinner e inicializarlo de acuerdo al componente del
layout. Adicionalmente creamos un adaptador que contenga los datos que se quieren mostrar y se lo
asignamos al spinner recién creado:

i. En caso en que los datos estén definidos por código java en un arreglo:

ii. En caso en que los datos estén definidos en el fichero xml, lo único que cambia es la forma
en que se crea el adaptador, al cual se le pasa el ID del recurso que contiene los ítems. El
resto del código se mantiene intacto:

b. ListView
En caso en que se quiera poner los elementos dentro de una lista (no desplegable) se procede de igual forma
que el caso del Spinner, y solo agregamos las líneas correspondientes a la definición del ListView y la asignación
del adaptador. Veamos el caso del fichero xml:

Al ejecutar nuestro proyecto, el resultado será como se muestra:

Oscar Viveros Egas. ohviveros@misena.edu.co


Centro de Comercio y Servicios
Regional Cauca

5. Seleccionar un ítem
Para seleccionar un ítem tanto de la lista como de un spinner, tenemos dos opciones: asignar al elemento Spinner o
ListView un Listener para cuando se selecciones un ítem o cambiar la herencia de la actividad de Activity a
ListActivity e implementar el método onListItemClick. En ambos casos, el objeto adaptador se declara de forma
global y le agregamos un código para que muestre un mensaje con el ítem seleccionado):

a. Asignar un Listener:
En este caso, al interior del método onCreate de la actividad agregamos el siguiente código

Los dós métodos que se muestran al interior del Listener se agregan al implementar la clase
OnItemSelectedListener.

b. Cambiar la herencia:
Lo primero que hacemos es cambiar la herencia en la actividad, y declarar el adaptador como una variable
global. De igual forma el id del ListView en el layout deberá cambiarse a @android:id/list. EL inconveniente
en este caso es que el método no logra diferenciar si la selección es sobre el Spinner o sobre el ListView.

Con lo anterior, ahora implementamos el método onListItemClick y le agregamos el código para mostrar el
mensaje:

De esta forma podemos ejecutar nuestra aplicación y probar su funcionamiento.

GRACIAS!!!
Oscar Viveros Egas. ohviveros@misena.edu.co