¿Cómo guardar ArrayList en SharedPreferences en Android?

SharedPreferences en Android es un almacenamiento local que se usa para almacenar strings, números enteros y variables en el almacenamiento del teléfono para que podamos administrar el estado de la aplicación. Hemos visto almacenar variables simples en preferencias compartidas con pares de clave y valor. En este artículo, veremos cómo podemos almacenar ArrayList en preferencias compartidas en nuestra aplicación de Android.  

¿Qué vamos a construir en este artículo?

Construiremos una aplicación simple en la que mostraremos los nombres de los cursos con su descripción en un RecyclerView simple y almacenaremos todos estos datos en nuestras preferencias compartidas. Entonces, cuando cerramos nuestra aplicación y la volvemos a abrir, todos los datos se guardarán en las preferencias compartidas y se mantendrá el estado de nuestra vista de reciclado. qué

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 dependencia para gson en build.gradle

Vaya a la aplicación > Gradle Scripts > build.gradle(app) y agregue la siguiente dependencia en la sección de dependencias.

implementación ‘com.google.code.gson:gson:2.8.5’

Después de agregar esta dependencia, sincronice su proyecto. 

Paso 3: Crear una clase modal para almacenar nuestros datos

Vaya a la aplicación > java > el nombre del paquete de su aplicación > haga clic con el botón derecho en él > Nuevo > clase Java y nombre su clase como CourseModal y agréguele el siguiente código. 

public class CourseModal {
  
    // variables for our course 
    // name and description.
    private String courseName;
    private String courseDescription;
  
    // creating constructor for our variables.
    public CourseModal(String courseName, String courseDescription) {
        this.courseName = courseName;
        this.courseDescription = courseDescription;
    }
  
    // creating getter and setter methods.
    public String getCourseName() {
        return courseName;
    }
  
    public void setCourseName(String courseName) {
        this.courseName = courseName;
    }
  
    public String getCourseDescription() {
        return courseDescription;
    }
  
    public void setCourseDescription(String courseDescription) {
        this.courseDescription = courseDescription;
    }
}

Paso 4: crear un archivo de diseño para nuestro elemento de RecyclerView

Vaya a la aplicación > res > diseño > haga clic con el botón derecho en él > Nuevo > archivo de recursos de diseño y nombre su diseño como curso_rv_elemento y agréguele el siguiente código. 

<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    android:elevation="8dp"
    app:cardCornerRadius="8dp">
  
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
  
        <!--text view for our course name-->
        <TextView
            android:id="@+id/idTVCourseName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="8dp"
            android:text="Course Name"
            android:textColor="@color/black"
            android:textSize="18sp" />
  
        <!--text view for our course description-->
        <TextView
            android:id="@+id/idTVCourseDescription"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/idTVCourseName"
            android:padding="5dp"
            android:text="COurse Description"
            android:textColor="@color/black" />
  
    </RelativeLayout>
      
</androidx.cardview.widget.CardView>

Paso 5: crear una clase de adaptador para configurar datos en elementos de nuestro RecyclerView 

Vaya a la aplicación > java > el nombre del paquete de su aplicación > haga clic con el botón derecho en él > Nuevo > clase Java y asígnele el nombre CourseAdapter y agréguele el siguiente código. 

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
  
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
  
import java.util.ArrayList;
  
public class CourseAdapter extends RecyclerView.Adapter<CourseAdapter.ViewHolder> {
      
    // creating a variable for array list and context.
    private ArrayList<CourseModal> courseModalArrayList;
    private Context context;
  
    // creating a constructor for our variables.
    public CourseAdapter(ArrayList<CourseModal> courseModalArrayList, Context context) {
        this.courseModalArrayList = courseModalArrayList;
        this.context = context;
    }
  
    @NonNull
    @Override
    public CourseAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        // below line is to inflate our layout.
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.course_rv_item, parent, false);
        return new ViewHolder(view);
    }
  
    @Override
    public void onBindViewHolder(@NonNull CourseAdapter.ViewHolder holder, int position) {
        // setting data to our views of recycler view.
        CourseModal modal = courseModalArrayList.get(position);
        holder.courseNameTV.setText(modal.getCourseName());
        holder.courseDescTV.setText(modal.getCourseDescription());
    }
  
    @Override
    public int getItemCount() {
        // returning the size of array list.
        return courseModalArrayList.size();
    }
  
    public class ViewHolder extends RecyclerView.ViewHolder {
          
        // creating variables for our views.
        private TextView courseNameTV, courseDescTV;
  
        public ViewHolder(@NonNull View itemView) {
            super(itemView);
              
            // initializing our views with their ids.
            courseNameTV = itemView.findViewById(R.id.idTVCourseName);
            courseDescTV = itemView.findViewById(R.id.idTVCourseDescription);
        }
    }
}

Paso 6: trabajar con el archivo activity_main.xml

Vaya a la aplicación > res > diseño > actividad_principal.xml y agregue el siguiente código a ese archivo. A continuación se muestra el código para el archivo  activity_main.xml .

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context=".MainActivity">
  
    <!--edit text for adding course name-->
    <EditText
        android:id="@+id/idEdtCourseName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_toStartOf="@id/idBtnSave"
        android:layout_toLeftOf="@id/idBtnSave"
        android:hint="Enter course Name" />
  
    <!--edit text for adding course description-->
    <EditText
        android:id="@+id/idEdtCourseDescription"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/idEdtCourseName"
        android:layout_marginEnd="4dp"
        android:layout_marginRight="4dp"
        android:layout_toLeftOf="@id/idBtnAdd"
        android:hint="Enter Course Description" />
      
    <!--button for adding data to recycler view-->
    <Button
        android:id="@+id/idBtnAdd"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/idEdtCourseName"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_margin="10dp"
        android:text="Add " />
  
    <!--button for saving data to shared prefs-->
    <Button
        android:id="@+id/idBtnSave"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_margin="10dp"
        android:text="Save " />
      
    <!--recycler view to display our data-->
    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/idRVCourses"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/idEdtCourseDescription" />
  
</RelativeLayout>

Paso 7: trabajar con el archivo MainActivity.java

Vaya al archivo MainActivity.java y consulte el siguiente código. A continuación se muestra el código del archivo MainActivity.java . Se agregan comentarios dentro del código para comprender el código con más detalle.

import android.content.SharedPreferences;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
  
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
  
import com.google.gson.Gson;
import com.google.gson.reflect.TypeToken;
  
import java.lang.reflect.Type;
import java.util.ArrayList;
  
public class MainActivity extends AppCompatActivity {
  
    // creating variables for our ui components.
    private EditText courseNameEdt, courseDescEdt;
    private Button addBtn, saveBtn;
    private RecyclerView courseRV;
      
    // variable for our adapter class and array list
    private CourseAdapter adapter;
    private ArrayList<CourseModal> courseModalArrayList;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
          
        // initializing our variables.
        courseNameEdt = findViewById(R.id.idEdtCourseName);
        courseDescEdt = findViewById(R.id.idEdtCourseDescription);
        addBtn = findViewById(R.id.idBtnAdd);
        saveBtn = findViewById(R.id.idBtnSave);
        courseRV = findViewById(R.id.idRVCourses);
          
        // calling method to load data
        // from shared prefs.
        loadData();
          
        // calling method to build
        // recycler view.
        buildRecyclerView();
          
        // on click listener for adding data to array list.
        addBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // below line is use to add data to array list.
                courseModalArrayList.add(new CourseModal(courseNameEdt.getText().toString(), courseDescEdt.getText().toString()));
                // notifying adapter when new data added.
                adapter.notifyItemInserted(courseModalArrayList.size());
            }
        });
        // on click listener for saving data in shared preferences.
        saveBtn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                // calling method to save data in shared prefs.
                saveData();
            }
        });
    }
  
    private void buildRecyclerView() {
        // initializing our adapter class.
        adapter = new CourseAdapter(courseModalArrayList, MainActivity.this);
          
        // adding layout manager to our recycler view.
        LinearLayoutManager manager = new LinearLayoutManager(this);
        courseRV.setHasFixedSize(true);
          
        // setting layout manager to our recycler view.
        courseRV.setLayoutManager(manager);
          
        // setting adapter to our recycler view.
        courseRV.setAdapter(adapter);
    }
  
    private void loadData() {
        // method to load arraylist from shared prefs
        // initializing our shared prefs with name as 
        // shared preferences.
        SharedPreferences sharedPreferences = getSharedPreferences("shared preferences", MODE_PRIVATE);
         
        // creating a variable for gson.
        Gson gson = new Gson();
          
        // below line is to get to string present from our 
        // shared prefs if not present setting it as null.
        String json = sharedPreferences.getString("courses", null);
          
        // below line is to get the type of our array list.
        Type type = new TypeToken<ArrayList<CourseModal>>() {}.getType();
          
        // in below line we are getting data from gson 
        // and saving it to our array list
        courseModalArrayList = gson.fromJson(json, type);
          
        // checking below if the array list is empty or not
        if (courseModalArrayList == null) {
            // if the array list is empty
            // creating a new array list.
            courseModalArrayList = new ArrayList<>();
        }
    }
  
    private void saveData() {
        // method for saving the data in array list.
        // creating a variable for storing data in
        // shared preferences.
        SharedPreferences sharedPreferences = getSharedPreferences("shared preferences", MODE_PRIVATE);
          
        // creating a variable for editor to 
        // store data in shared preferences.
        SharedPreferences.Editor editor = sharedPreferences.edit();
          
        // creating a new variable for gson.
        Gson gson = new Gson();
         
        // getting data from gson and storing it in a string.
        String json = gson.toJson(courseModalArrayList);
          
        // below line is to save data in shared 
        // prefs in the form of string.
        editor.putString("courses", json);
         
        // below line is to apply changes 
        // and save data in shared prefs.
        editor.apply();
          
        // after saving data we are displaying a toast message.
        Toast.makeText(this, "Saved Array List to Shared preferences. ", Toast.LENGTH_SHORT).show();
    }
}

Ahora ejecute su aplicación y vea el resultado de la aplicación. 

Producción: