martes, 11 de marzo de 2014

Android - Primeros Pasos - Mostrando listados

Para mostrar una lista en nuestra aplicación Android debemos usar el componente ListView.

Lo primero que debemos hacer es añadir  un elemento ListView al layout donde se desea que aparezca el listado. Si estamos trabajando con el editor gráfico de eclipse podemos encontrar el componente en el apartado Composite de la paleta, tal y como se ve en la siguiente imagen.


En código nuestro layout quedará algo como lo siguiente:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <ListView
        android:id="@+id/listView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true" >

    </ListView>
</RelativeLayout>

Ahora lo siguiente es añadir contenido al componente, el código sería el siguiente:


    ListView listView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // listView definido en el layout
        listView = (ListView) findViewById(R.id.listView1);

        // Definir lista de valores a mostrar
        String[] valores = new String[] { "Android - Primeros Pasos",
                "Android - Depurando", "Android - Botones",
                "Android - Layouts", "Android - ListView" };

        // Adaptador
        ArrayAdapter<String> adaptador = new ArrayAdapter<String>(this,
                android.R.layout.simple_list_item_1, android.R.id.text1,
                valores);

        // Asignar el adaptador al listview
        listView.setAdapter(adaptador);
      
        // Añadir evento
        addOnClickView();

    }

    private void addOnClickView() {
        listView.setOnItemClickListener( new OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adview, View v,
                    int posicion, long id) {
                // Mostrar texto
                Toast.makeText(
                        getApplicationContext(),
                        "Valor :"
                                + (String) listView.getItemAtPosition(posicion),
                        Toast.LENGTH_LONG).show();
            }});
    }



El código es bastante sencillo, aunque es necesario explicar que es el adaptador y cuáles son los parámetros que se le pasan. El adaptador se encarga de pasar a la lista cada una de la filas con el formato indicado en un layout (en este caso se trata de un layout ya predefinido android.R.layout.simple_list_item_1). Podemos crear nuestro propio adaptador, que muestre varios elementos por fila, por ejemplo podríamos tener un adaptador que en cada fila mostrará los datos de una persona, incluyendo su foto, su nombre, etc. Como veremos en un futuro artículo que añadiré.

Para este ejemplo se ha usado un adaptador ya existe que permite mostrar una lista de valores. A su constructor se le pasan los siguientes parámetros:
  • Context.
  • Layout a aplicar para mostrar cada fila.
  • Lista de valores.
Con esto ya podemos mostrar nuestra lista. Ahora fijémonos en la función addOnClickView. En esta función se está registrando un escuchador sobre los ítems del listView de modo que cuando se pulse sobre uno de ellos podremos acceder a la información del mismo y realizar el tratamiento que queramos, para el ejemplo se muestra un mensaje.

No hay comentarios:

Publicar un comentario