El elemento ListView está representado por una lista de opciones con scroll automático. Al igual que en el caso del Spinner, un listview tiene una parte gráfica y una parte de datos representada por un objeto de tipo Adapter.

ListView

El control listview es una lista de selección única donde se representan datos con un scroll automático. Para poder representar un objeto de tipo listview:

<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/list_view"
android:divider="@color/colorAccent"
android:dividerHeight="2dp"/>

De las opciones del elemento gráfico destacan las propiedades:

  • divider: color o drawable que se pondrá entra cada uno de los elementos de la lista
  • dividerHeight: tamaño del elemento que actuará como separador de elementos

Si llevamos el elemento a código java, los principales métodos son:

//asocia datos al elemento gráfico
listView.setAdapter(new ArrayAdapter<>());
//obtiene la posición del elemento seleccionado
listView.getSelectedItemPosition();
//obtiene el elemento seleccionado
listView.getSelectedItem();
//obtiene el número de elemento de la lista
listView.getCount();
//obtiene el número de elementos seleccionados en caso de selección méltiple
listView.getCheckedItemCount();
//obtiene la posición de los elementos seleccionados en caso de selección múltiple
listView.getCheckedItemPositions();
//selecciona el elemento de la posición 0
listView.setSelection(0);
//cambia el tipo de seleccion de la lista
listView.setChoiceMode(AbsListView.CHOICE_MODE_SINGLE);

Muchos de los métodos que se pueden utilizar son parecidos al elemento spinner ya que la funcionalidad base es la misma. De este modo si se quiere acceder al elemento seleccionado de forma puntual se podría hacer mediante el método getSelectedItem()

Asociar datos a un listView – Adaptadores

El adaptador simple como ya se explicó está formado por contexto, layout que representará el elemento de la lista y datos. En este caso el layout que se utiliza es el que android provee por defecto ubicado en R.layout.simple_list_item_1.

ArrayList listaDatos = new ArrayList();
   for (int i = 1; i<11;i++){
      listaDatos.add("Opción "+String.valueOf(i));    
   }
ArrayAdapter adapter = new ArrayAdapter(this,android.R.layout.simple_list_item_1,listaDatos);
listView.setAdapter(adapter);

[ezcol_2third] En este caso la lista quedaría rellena con los datos del adaptador, pudiendo seleccionarse un elemento de la misma. En el caso que la cantidad de datos no se pudiese representar en la pantalla del dispositivo, el componente listview asocia un scroll automático para que al arrastrar la lista aparezcan el resto de elementos [/ezcol_2third] [ezcol_1third_end][/ezcol_1third_end]

Si se lleva el elemento adaptar a código java, los métodos más utilizados serían los siguientes:

//obtiene el elemento de la posición 0
adapter.getItem(0);
//obtiene el número de elementos del adeptador
adapter.getCount();
//obtiene el id del elemento de la posición 0
adapter.getItemId(0);
//método que notifica al adaptador que algo ha cambiado en la parte de datos
//este método siempre se tienen que ejecuatra cuando se añade/borra/modifican datos
adapter.notifyDataSetChanged();

Manejo de eventos en un ListView

Para poder evaluar el elemento seleccionado de forma automática en el momento de la selección, se utiliza el listener OnItemClickListener con el método asociado onItemClick:

listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
        //Ejecutado cuando una de las opciones sea pulsada
    }
});

El método se ejecutará en el momento que una de las opciones de la lista se pulse. Los argumentos del método son los siguientes:

  • parent: la vista donde se llevo a cabo la selección
  • view: la vista completa que generó el evento
  • position: la posición del elemento seleccionado
  • id: el id de la fila donde está el elemento seleccionado

De esta forma, si se quisiese acceder al elemento seleccionado de forma inmediata tras las selección se utilizaría el siguiente código:

[ezcol_2third]

listView = (ListView) findViewById(R.id.list_view);
ArrayList listaDatos = new ArrayList();
        for (int i = 1; i < 11; i++) {
            listaDatos.add("Opción " + String.valueOf(i));
        }
ArrayAdapter adapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, listaDatos);
listView.setAdapter(adapter);

listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                Toast.makeText(getApplicationContext(),parent.getAdapter().getItem(position).toString(),Toast.LENGTH_SHORT).show();
            }
});

 

[/ezcol_2third] [ezcol_1third_end][/ezcol_1third_end]

Documentación oficial de OnItemClickListener

GridView

El elemento gridview representa una lista de datos colocada en forma de cuadricula, donde se puede configurar el número de columnas existentes. Por el resto, su funcionalidad es totalmente idéntica al elemento listview. Para poder representar gráficamente el elemento:

<GridView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/grid_view"
android:divider="@color/colorAccent"
android:dividerHeight="2dp"
android:numColumns="3"/>

donde la propiedad numColum marca el número de columnas en las que se representarán los elementos. Si lo llevamos a código java tan solo habría que añadir el método setNumColum() que modifica el número de columnas. Al igual que en el resto de elementos con datos, se necesita un adaptador para poder representarlos.

[ezcol_2third]

gridView = (GridView) findViewById(R.id.grid_view);
ArrayList listaDatos = new ArrayList();
   for (int i = 1; i < 11; i++) {
      listaDatos.add("Opción " + String.valueOf(i));
   }
ArrayAdapter adapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, listaDatos);
gridView.setAdapter(adapter);
gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
   @Override
   public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
          Toast.makeText(getApplicationContext(),parent.getAdapter().getItem(position).toString(),Toast.LENGTH_SHORT).show();
          }
});

[/ezcol_2third] [ezcol_1third_end][/ezcol_1third_end]