RSS

Pull to refresh en Android. Cargar los datos en un ListView nunca será igual después de esto.

09 Jul

Siguiendo los pasos de otros artículos, hoy os presento una funcionalidad que cuanto menos, es vistosa a la hora de recargar datos en un ListView. Sí, hablo del pull to refresh. 

Pull to refresh, tal y como su nombre indica, nos permite tirar para refrescar, o lo que es lo mismo, tirar hacia abajo la parte superior de un ListView para recargar su contenido. Esta funcionalidad es utilizada por aplicaciones como Twitter.

Pero bueno, vamos al lío, que es para lo que estamos.

¡¡DAME CÓDIGO!!

1. Importando la librería

Lo primero que tenemos que hacer es descargarnos la librería desde el repositorio de GitHub del autor. Una vez hecho esto, importamos la carpeta libraryproject en nuestro Workspace como si de un proyecto normal se tratase, para ello, situamos el cursor en la zona del Package Explorer, pulsamos el botón derecho > Import > Existing Projects into Workspace y en la opciónSelect Root directory ponemos la ruta de la carpeta que contiene la librería, en este caso libraryproject .

NOTA: Es aconsejable poner la carpeta libraryproject en nuestro Workspace, ya que así la tendremos localizada.

2. Usando la librería en nuestro proyecto

El segundo paso es añadirla a nuestro proyecto, para lo cual debemos pulsar el botón secundario sobre la carpeta de nuestro proyecto en Eclipse > Properties , se nos abrirá una ventana con unas opciones en el lateral derecho, debemos seleccionar Android, bajar hasta el final, y en Library > Add > libraryproject > Ok.

Ya habremos añadido la librería a nuestro proyecto, así que es el momento de empezar a usarla.

3. ¡Dame más, dame más!

Ahora que lo tenemos todo preparado, podemos ponernos manos a la obra. Para ello, lo primero que tenemos que hacer es crear nuestro layout para asignarlo en nuestra activity con el ListView. Pero no tenemos que usar un ListView normal, nuestro ListView quedaría así:

<eu.erikw.PullToRefreshListView
        android:id="@+id/listView"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

Ahora en nuesto Activity tendremos que declarar el ListView, pero tampoco lo podemos hacer como si fuese un ListView por defecto:

PullToRefreshListView lView = (PullToRefreshListView) findViewById(R.id.listView);

Y ya podremos usar nuestro ListView normalmente, y asignarles los datos que deseemos tal y como se hace en los ListView por defecto.

4. Actualizando los datos

Para actualizar los datos simplemente tenemos que implementar el siguiente método.

listView.setOnRefreshListener(new OnRefreshListener() {

    @Override
    public void onRefresh() {
        // Tu código para recargar los datos

        // ...

        // Asegurate de llamar a listView.onRefreshComplete()

        listView.onRefreshComplete();
    }
});

Y ya está, ya tendremos el pull to refresh implementado en nuestra aplicación.

Si tienes alguna duda, pregunta 🙂

Anuncios
 
5 comentarios

Publicado por en 09/07/2012 en Programando con Alexrs95

 

Etiquetas: , , , , ,

5 Respuestas a “Pull to refresh en Android. Cargar los datos en un ListView nunca será igual después de esto.

  1. Angie Milena Vega Leon

    10/10/2012 at 18:18

    Sip, efectivamente al descargar el proyecto baja sin el archivo properties, por lo que, para arreglarlo hice lo siguiente:
    1. Descargar e paquete zip de Github
    2. Importar la libreria a eclipse
    2.1 En la libreria agregar en la carpeta general del proyecto un archivo llamado project.properties con el siguiente texto (Crear New File, le pones el nombre project.properties y agregas el texto abajo)

    # This file is automatically generated by Android Tools.
    # Do not modify this file — YOUR CHANGES WILL BE ERASED!
    #
    # This file must be checked in Version Control Systems.
    #
    # To customize properties used by the Ant build system edit
    # “ant.properties”, and override values to adapt the script to your
    # project structure.
    #
    # To enable ProGuard to shrink and obfuscate your code, uncomment this (available properties: sdk.dir, user.home):
    #proguard.config=${sdk.dir}\tools\proguard\proguard-android.txt:proguard-project.txt

    # Project target.
    target=android-7
    android.library=true

    3. Importar a eclipse el proyecto de Ejemplo
    3.1 Al igual que el anterior, agregamos en la carpeta principal un nuevo archivo llamado project.properties con el texto a continuacion

    # This file is automatically generated by Android Tools.
    # Do not modify this file — YOUR CHANGES WILL BE ERASED!
    #
    # This file must be checked in Version Control Systems.
    #
    # To customize properties used by the Ant build system edit
    # “ant.properties”, and override values to adapt the script to your
    # project structure.
    #
    # To enable ProGuard to shrink and obfuscate your code, uncomment this (available properties: sdk.dir, user.home):
    #proguard.config=${sdk.dir}\tools\proguard\proguard-android.txt:proguard-project.txt

    # Project target.
    target=android-7
    android.library.reference.1=../PullToRefreshListView

    4. Por Ultimo en el proyecto de prueba apareceran errores entonces, ingresa a cada clase y oprime Ctrl + Shift + O (para limpiar imports y agregar imports)

    Por si acaso refresquen los proyectos despues de cada cambio y den en el eclipse Project -> Clean… y limpien el proyecto

    Asi me funciono espero sirva de algo!

     
  2. Erick Hernandez (@takashius)

    05/10/2012 at 19:55

    Excelente tutorial, me funciono perfecto, hay algunos detalles pero funciona bien

     
  3. neon2004

    04/10/2012 at 16:30

    Hola.

    He intentado implementar este codigo pero al importar el libraryproject a mi workspace como indicas se importas con errores, en concreto me pone esto:

    – Project ‘PullToRefreshListView’ is missing required source folder: ‘gen’ PullToRefreshListView Build path Build Path Problem

    – Project has no project.properties file! Edit the project properties to set one. PullToRefreshListView Unknown Android Target Problem

    – The project cannot be built until build path errors are resolved PullToRefreshListView Unknown Java Problem

    y luego al intenar importarlo a mi proyecto pues no aparece.

     
    • alexrs95

      08/10/2012 at 15:44

      No sé cual puede ser la causa del problema, nunca me ha pasado. Lo siento, y gracias por comentar. Si encuentras la solución, te agradecería que la pusieses para que, si alguna vez yo u otra persona se encuentra con ese error, sea capaz de solucionarlo 🙂

       
  4. kekoyde

    25/09/2012 at 16:53

    lo importe pero no me muestra la imagen que tiene a la izquierda

     

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: