Tire para actualizar con ListView en Android con ejemplo

El widget SwipeRefreshLayout se usa para implementar un patrón de diseño de interfaz de usuario de deslizar para actualizar. Utiliza un gesto de deslizamiento vertical para actualizar el contenido de las vistas. El widget SwipeRefreshLayout detecta el deslizamiento vertical y muestra distintas barras de progreso y activa los métodos de devolución de llamada en la aplicación. Para usar este comportamiento, el widget SwipeRefreshLayout debe ser el padre de ListView o GridView . Este comportamiento del widget SwipeRefreshLayout le permite al usuario actualizar el diseño manualmente. La clase SwipeRefreshLayout contiene un oyente llamado OnRefreshListener . Las clases que quieran usar este oyente deben implementar SwipeRefreshLayout.OnRefreshListenerinterfaz. En el gesto de deslizamiento vertical hacia abajo, este oyente se activa y se llama al método onRefresh() y se puede anular según las necesidades. 

Swipe-to-Refresh ListView es muy similar a Swipe-to-Refresh RecyclerView. En lugar de ListView, usamos RecyclerView. Consulte Pull to Refresh con RecyclerView en Android con un ejemplo .

Ejemplo

En este ejemplo, almacenaríamos datos de tipo string en ArrayList , que se usa para completar ListView. Cada vez que se llama al método OnRefresh() , los datos de ArrayList se barajan. A continuación se proporciona un GIF de muestra para tener una idea de lo que vamos a hacer en este artículo. Tenga en cuenta que vamos a implementar este proyecto utilizando el lenguaje Java . 

Implementación paso a paso

Paso 1: Crear un nuevo proyecto

Para crear un nuevo proyecto en Android Studio, consulte Cómo crear/iniciar un nuevo proyecto en Android Studio . Tenga en cuenta que seleccione Java como lenguaje de programación.

Paso 2: Agregar dependencias

Estamos usando SwipeRefreshLayout. Entonces, necesitamos agregar la dependencia para ello. Para agregar la dependencia, vaya a Gradle Scripts > build.gradle(Module: app) y agregue la siguiente dependencia. Después de agregar la dependencia, debe hacer clic en Sincronizar ahora .

dependencias { 

implementación ‘androidx.swiperefreshlayout:swiperefreshlayout:1.1.0’ 

}

Antes de continuar, agreguemos algunos atributos de color para mejorar la barra de la aplicación. Vaya a aplicación > res > valores > colores.xml y agregue los siguientes atributos de color.

<resources> 
    <color name="colorPrimary">#0F9D58</color> 
    <color name="colorPrimaryDark">#16E37F</color> 
    <color name="colorAccent">#03DAC5</color> 
</resources> 

Paso 3: trabajar con el archivo activity_main.xml

En este paso, crearemos SwipeRefreshLayout y le agregaremos ListView. Vaya a aplicación > res > diseño > actividad_principal.xml y agregue el siguiente fragmento de código.

<?xml version="1.0" encoding="utf-8"?>
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/swipeRefreshLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
  
    <!--ListView to store list items-->
    <ListView
        android:id="@+id/listView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
  
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>

Paso 4: trabajar con el archivo MainActivity.java

En este paso, obtenemos la referencia de SwipeRefreshLayout y ListView que definimos en nuestro archivo de diseño activiy_main.xml . Crearemos una ArrayList de elementos de string e implementaremos ArrayAdapter para establecer datos en la lista. Y luego, implementamos el evento setOnRefreshListener en SwipeRefreshLayout y llamamos al método OnRefresh() para mezclar los elementos de la lista.

import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import androidx.appcompat.app.AppCompatActivity;
import androidx.swiperefreshlayout.widget.SwipeRefreshLayout;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Collections;
import java.util.Random;
  
public class MainActivity extends AppCompatActivity {
  
    SwipeRefreshLayout swipeRefreshLayout;
    ListView listView;
    ArrayList<String> arrayList = new ArrayList<>(Arrays.asList("C-Language", "Java", "Data Structure",
            "Networking", "Operating System", "Compiler Design", "Theory Of Computation",
            "Software Engineering", "Web Engineering"));
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        // Getting the reference of SwipeRefreshLayout and ListView
        swipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.swipeRefreshLayout);
        listView = (ListView) findViewById(R.id.listView);
  
        // simple_list_item_1 is a built in layout. It is part of Android OS, instead of creating our own
        // xml layout we are using built-in layout
        ArrayAdapter arrayAdapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, arrayList);
        listView.setAdapter(arrayAdapter);
  
        // Implementing setOnRefreshListener on SwipeRefreshLayout
        swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
            @Override
            public void onRefresh() {
                swipeRefreshLayout.setRefreshing(false);
                // User defined method to shuffle the array list items
                shuffleListItems();
            }
        });
    }
  
    public void shuffleListItems() {
        // Shuffling the arraylist items on the basis of system time
        Collections.shuffle(arrayList, new Random(System.currentTimeMillis()));
        ArrayAdapter arrayAdapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, arrayList);
        listView.setAdapter(arrayAdapter);
    }
}

Salida: ejecutar en el emulador