RSS

ListView ampliable en Android.

08 Abr

¡Nueva entrega de Programando con Alexrs95! Hoy… ListView.

Uno de los elementos básicos en cualquier aplicación para Android es un ListView. Un ListView es simplemente una lista, en la que podemos interactuar con los elementos que contiene cuando pulsamos sobre ellos, lanzando Intents, o muchas otras cosas.

Hoy vamos a aprender a crear un ListView que podamos ir rellenando nosotros mismos con los datos que vayamos introduciendo en un EditText en nuestra aplicación, así que… ¡al lío!

Requisitos

  • Eclipse u otro IDE similar.
  • Android SDK.
  • Conocimientos básicos de Java.
  • Conocimientos básicos de programación para Android.
  • Ganas de aprender.

1. main.xml

Lo primero que tenemos que hacer es crear un nuevo proyecto Android, algo que, si has llegado hasta aquí, supongo que sabrás. Yo lo he llamado ListViewAmpliable.

A continuación, en nuestro main.xml añadimos un EditText, para introducir los daros que queramos mostrar en nuestro ListView, un Button, y, por supuesto, un ListView.

Mi main ha quedado de la siguiente manera, aunque vosotros podréis ponerlo a vuestro gusto.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:padding="10dp" >

    <EditText
        android:id="@+id/etDatos"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="Introduce los datos" />
    <Button 
        android:text="¡Agregar!"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/btAgregar"/>

    <ListView
        android:id="@+id/lvDatos"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" >
    </ListView>
</LinearLayout>
 

Hasta aquí sencillo, ¿verdad?.

2. Activity principal.

Comenzamos declarando los elementos del Layout, de la siguiente manera:

public class ListViewAmpliableActivity extends Activity {
    Button btAdd;
    ListView lvDatos;
    EditText etDatos;

    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        btAdd = (Button) findViewById(R.id.btAgregar);
        lvDatos = (ListView) findViewById(R.id.lvDatos);
        etDatos = (EditText) findViewById(R.id.etDatos);

Vosotros podéis darle el nombre que queráis a vuestros elementos, claro está.
A continuación, tenemos que crear un objeto ArrayList que va a ir almacenando los datos que vayamos introduciendo en nuestro EditText.

final ArrayList mLista = new ArrayList();

Después, vamos a crear un Adapter y se lo asignamos a nuestro ListView, como indico a continuación:

 final ArrayAdapter mAdapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, mLista);
 lvDatos.setAdapter(mAdapter);

Por último, asignamos una función al botón, cuando lo presionamos, que va a ser el mostrar el String que introducimos en el EditText:

 btAdd.setOnClickListener(new View.OnClickListener() {

			@Override
			public void onClick(View v) {
				mLista.add(etDatos.getText().toString());
             //Aquí le decimos al adapter que notifique los cambios
				mAdapter.notifyDataSetChanged();
             //Borramos el contenido del EditText
				etDatos.setText("");

			}
		});

Podéis descargar el proyecto desde aquí.
Y ya está, ya lo tenemos. Ahora podemos ejecutar la aplicación y comprobar el resultado.
Si tenéis alguna duda, preguntad.

Anuncios
 
3 comentarios

Publicado por en 08/04/2012 en Programando con Alexrs95

 

3 Respuestas a “ListView ampliable en Android.

  1. Rapska

    22/02/2013 at 23:25

    Buenas, muchas gracias por el tuto, estuve buscando durante harto rato y no encontré nada, con ése pude terminar una tarea fácilmente, tuve que editar un poco el código claro, y sumar varios EditText, pero l resultado final fue excelente. MUCHAS GRACIAS!!

     
  2. David

    23/09/2012 at 12:38

    Hola! Gracias por el tutorial, a mi me ha tocado hacer una aplicación en Android, y voy un poco perdido.
    Me gustaría adaptar este ejemplo pero incluyendo checkbox’s en el ListView, sabes si sería muy complicado?

     
    • alexrs95

      23/09/2012 at 22:29

      No es complicado, esta librería lo único que hace es añadir el efecto de “pull to refresh”, pero por lo demás, se comporta como un ListView normal, así que puedes fácilmente crear un XML con el Layout que quieres que muestre cada fila de la lista, y luego crear tu propio Adapter. Si googleas un poco hay mucha información acerca de como crear ListViews personalizadas 🙂

       

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s

 
A %d blogueros les gusta esto: