¿Cómo recuperar datos de Firebase Realtime Database en Android ListView?

Firebase Realtime Database nos brinda una función para brindar actualizaciones en tiempo real a sus datos dentro de su aplicación en milisegundos. Con la ayuda de Firebase , puede proporcionar actualizaciones en tiempo real a sus usuarios. En este artículo, veremos la implementación de Firebase Realtime Database para nuestro ListView en Android. En este ListView, podremos agregar y eliminar los elementos de la lista en tiempo real. Entonces, avancemos hacia la implementación de nuestra base de datos en tiempo real de Firebase en ListView. 

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

Crearemos una aplicación simple en la que crearemos un ListView y, dentro de ese ListView, obtendremos los datos de nuestra base de datos Firebase Realtime. Desde Firebase podemos actualizar o eliminar los elementos de nuestra lista según nuestros requisitos y los datos se actualizarán en tiempo real. 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: conecta tu aplicación a Firebase

Después de crear un nuevo proyecto. Navegue a la opción Herramientas en la barra superior. Dentro de eso, haga clic en Firebase. Después de hacer clic en Firebase, puede ver la columna de la derecha que se menciona a continuación en la captura de pantalla.  

Dentro de esa columna, navegue hasta Firebase Realtime Database. Haga clic en esa opción y verá dos opciones en Conectar la aplicación a Firebase y Agregar Firebase Realtime Database a su aplicación. Haga clic en Conectar ahora y su aplicación se conectará a Firebase. Después de eso, haga clic en la segunda opción y ahora su aplicación está conectada a Firebase.  

Después de completar este proceso, verá la siguiente pantalla.  

Ahora verifique que su aplicación esté conectada a Firebase o no. Vaya a su archivo build.gradle. Navegue a la aplicación > Gradle Scripts > archivo build.gradle y asegúrese de que la dependencia a continuación se agregue en su sección de dependencias.  

implementación ‘com.google.firebase:firebase-database:19.6.0’

Si la dependencia anterior no se agrega en su sección de dependencias. Agregue esta dependencia y sincronice su proyecto. Ahora nos moveremos hacia la parte XML de nuestra aplicación. 

Paso 3: trabajar con el archivo activity_main.xml

Vaya al archivo activity_main.xml y consulte el siguiente código. A continuación se muestra el código para el archivo activity_main.xml .

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">
  
    <!--ListView for displaying 
        our list of courses-->
    <ListView
        android:id="@+id/idLVCourses"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
  
</RelativeLayout>

Paso 4: agregue permiso de Internet en su archivo AndroidManifest.xml

Agregue el permiso para Internet en el archivo AndroidManifest.xml. 

XML

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

Paso 5: 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.

Java

import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.ListView;
  
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
  
import com.google.firebase.database.ChildEventListener;
import com.google.firebase.database.DataSnapshot;
import com.google.firebase.database.DatabaseError;
import com.google.firebase.database.DatabaseReference;
import com.google.firebase.database.FirebaseDatabase;
  
import java.util.ArrayList;
  
public class MainActivity extends AppCompatActivity {
  
    // creating variables for our list view.
    private ListView coursesLV;
      
    // creating a new array list.
    ArrayList<String> coursesArrayList;
      
    // creating a variable for database reference.
    DatabaseReference reference;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
          
        // initializing variables for listviews.
        coursesLV = findViewById(R.id.idLVCourses);
          
        // initializing our array list
        coursesArrayList = new ArrayList<String>();
          
        // calling a method to get data from
        // Firebase and set data to list view
        initializeListView();
    }
  
    private void initializeListView() {
        // creating a new array adapter for our list view.
        final ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, coursesArrayList);
  
        // below line is used for getting reference
        // of our Firebase Database.
        reference = FirebaseDatabase.getInstance().getReference();
         
        // in below line we are calling method for add child event 
        // listener to get the child of our database.
        reference.addChildEventListener(new ChildEventListener() {
            @Override
            public void onChildAdded(@NonNull DataSnapshot snapshot, @Nullable String previousChildName) {
                // this method is called when new child is added to 
                // our data base and after adding new child
                // we are adding that item inside our array list and
                // notifying our adapter that the data in adapter is changed.
                coursesArrayList.add(snapshot.getValue(String.class));
                adapter.notifyDataSetChanged();
            }
  
            @Override
            public void onChildChanged(@NonNull DataSnapshot snapshot, @Nullable String previousChildName) {
                // this method is called when the new child is added.
                // when the new child is added to our list we will be 
                // notifying our adapter that data has changed.
                adapter.notifyDataSetChanged();
            }
  
            @Override
            public void onChildRemoved(@NonNull DataSnapshot snapshot) {
                // below method is called when we remove a child from our database.
                // inside this method we are removing the child from our array list 
                // by comparing with it's value.
                // after removing the data we are notifying our adapter that the 
                // data has been changed.
                coursesArrayList.remove(snapshot.getValue(String.class));
                adapter.notifyDataSetChanged();
            }
  
            @Override
            public void onChildMoved(@NonNull DataSnapshot snapshot, @Nullable String previousChildName) {
                // this method is called when we move our 
                // child in our database.
                // in our code we are note moving any child.
            }
  
            @Override
            public void onCancelled(@NonNull DatabaseError error) {
                // this method is called when we get any 
                // error from Firebase with error.
            }
        });
        // below line is used for setting 
        // an adapter to our list view.
        coursesLV.setAdapter(adapter);
    }
}

Después de agregar este código a su aplicación. Ahora vaya a Firebase y haga clic en la opción Ir a la consola que se encuentra en la esquina superior derecha.  

Después de hacer clic en esta pantalla, verá la pantalla a continuación con todo su proyecto dentro que selecciona su proyecto.  

Dentro de esa pantalla, haga clic en n Base de datos en tiempo real en la ventana izquierda.  

Después de hacer clic en esta opción, verá la pantalla en el lado derecho. En esta página, haga clic en la opción Reglas que se encuentra en la barra superior. Verá la siguiente pantalla.  

En este proyecto, estamos agregando nuestras reglas como verdaderas tanto para lectura como para escritura porque no estamos usando ninguna autenticación para verificar a nuestro usuario. Por lo tanto, actualmente lo estamos configurando como verdadero para probar nuestra aplicación. Después de cambiar sus reglas. Haga clic en el botón publicar en la esquina superior derecha y sus reglas se guardarán allí. Ahora vuelva de nuevo a la pestaña Datos. Ahora agregaremos nuestros datos a Firebase manualmente desde el propio Firebase.

Paso 6: Agregar datos en Firebase Console

Dentro de Firebase Database, el Node principal que veremos es un padre. Dentro de este padre, tenemos que agregar elementos secundarios. Este elemento secundario se mostrará dentro de nuestro ListView. Agregaremos nuevos elementos secundarios dentro de nuestra base de datos. Para agregar los datos para nuestra vista de lista. Simplemente tenemos que agregar un elemento haciendo clic en la opción «+» en el lado derecho y luego agregar el elemento dentro de nuestra base de datos. De manera similar, agregue varios elementos a su base de datos. Estos elementos se mostrarán dentro de nuestro ListView. 

Lo mencionado anteriormente es la imagen en la que conocerá cómo agregar un solo elemento en su vista de lista. De manera similar, agregue varios elementos en su base de datos y podrá ver la pantalla a continuación. 

Después de agregar estos datos, ejecute su aplicación y vea el resultado de la aplicación. Después de ejecutar su aplicación, actualice los datos en su Firebase. Puede agregar, eliminar a cualquier niño o actualizar cualquier niño, podrá ver Actualizaciones en tiempo real en su ListView. 

Producción:

Publicación traducida automáticamente

Artículo escrito por chaitanyamunje y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *