domingo, 23 de diciembre de 2012

Pull to refresh en Android. Cargar los datos en un ListView.

Actualizar un ListView halando desde la parte superior.

URL ORIGEN: http://alexrs95.wordpress.com/2012/07/09/pull-to-refresh-en-android-cargar-los-datos-en-un-listview-nunca-sera-igual-despues-de-esto/


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

09JUL
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í:
1<eu.erikw.PullToRefreshListView
2        android:id="@+id/listView"
3        android:layout_width="fill_parent"
4        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:
1PullToRefreshListView 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.
01listView.setOnRefreshListener(new OnRefreshListener() {
02
03    @Override
04    public void onRefresh() {
05        // Tu código para recargar los datos
06
07        // ...
08
09        // Asegurate de llamar a listView.onRefreshComplete()
10
11        listView.onRefreshComplete();
12    }
13});
Y ya está, ya tendremos el pull to refresh implementado en nuestra aplicación.
Si tienes alguna duda, pregunta :)



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)
# 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
target=android-7
android.library=true
3.1 Al igual que el anterior, agregamos en la carpeta principal un nuevo archivo llamado project.properties con el texto a continuacion
# 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
target=android-7
android.library.reference.1=../PullToRefreshListView


# This file is automatically generated by Android Tools.
# Project target.
3. Importar a eclipse el proyecto de Ejemplo
# This file is automatically generated by Android Tools.
# Project target.
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!

No hay comentarios:

Publicar un comentario