Realtime Database di Android. Firebase Realtime Databasemerupakan salah satu fitur yang ada di dalam Firebase. Fitur Realtime database ini sangat berguna jika anda ingin membuat live chat.

Firebase realtime database mendukung berbagai platform Android, iOS dan Web. Semua data disimpan dalam format JSON.

Gambar oleh Google

Pada artikel ini kami akan mencoba untuk memberitahukan dasar-dasar cara intergrasi dan penggunaan Realtime Database. Jika anda baru dengan firebase, kami menyarankan anda untuk membaca artikel kami tentang Integrasi Aplikasi Android dengan Firebase dan Login dan Registrasi di Android dengan Firebase.

Berikut adalah demo aplikasi android dalam penggunaan Firebase Realtime Database di Android yang akan kita buat pada artikel ini.

Firebase Realtime Database di Android

Cara penggunaan Firebase Realtime Database di Android

Sebelumnya kita memulai tentang cara penggunaan Firebase Realtime Database di android, kami akan memberitahukan kepada anda bahwa data yang tersimpan di Realtime Database berbentuk JSON. Contohnya seperti ini

{
  "users": [
    {
      "nama": "Boby",
      "email": "[email protected]"
    }
  ]
}

Firebase Realtime Database juga mendukung penyimpanan data secara offline. Jadi ketika anda menyimpan data didalam keadaan tidak terhubung dengan internet data akan tersimpan terlebih dahulu di ponsel anda, lalu akan ada proses singkronisasi otomatis jika anda sudah terhubung ke internet.

Input data ke Firebase Realtime Database di Android

Sebelum kita memulai, pertama silahkan anda menambahkan kode dibawah ini lalu pastekan kedalam gradle proyek anda.

implementation 'com.google.firebase:firebase-database:16.0.5'

Lalu, jalankan singkron gradle. Lalu, didalam activity anda tambahkan kode dibawah ini.

private DatabaseReference mDatabase;

dan bagian dibawah ini didalam onCreate

mDatabase = FirebaseDatabase.getInstance().getReference();

Kode diatas merupakan kode bawaan dari firebase, dimana kode diatas itu berguna untuk me-referensikan database.

Ini contoh penggunaan sederhana untuk menyimpan data baru.

 DatabaseReference mDatabase = FirebaseDatabase.getInstance().getReference("users");
 mDatabase.setValue("Tukangaplikasi.com");

dan contoh hasilnya seperti ini

Kita akan mencoba untuk melakukan input sederhana, kita akan menyimpan nama dan alamat email.

Jadi hal yang pertama kita lakukan adalah membuat class. Class ini akan berfungsi sebagai model. Berikut modelnya, kami menyimpannya dengan nama User

package com.tukangaplikasi.splashscreen;

public class User {

    public String nama;
    public String email,uid;


    public User() {

    }

    public User(String nama, String email,String  uid) {
        this.nama = nama;
        this.email = email;
        this.uid = uid;
    }

    public String getNama() {
        return nama;
    }

    public void setNama(String nama) {
        this.nama = nama;
    }

    public String getEmail() {
        return email;
    }

    public void setEmail(String email) {
        this.email = email;
    }

    public String getUid() {
        return uid;
    }

    public void setUid(String uid) {
        this.uid = uid;
    }
}

Kita akan mencobanya dengan menggunakan form. Buat activity terlebih dahulu dengan nama Realtimedatabase, berikut adalah xml layoutnya

<?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=".Login">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Buka List"
        android:id="@+id/bukaList"
        android:layout_centerHorizontal="true"
        />


    <EditText
        android:id="@+id/namaET"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerInParent="true"
        android:layout_marginTop="145dp"
        android:ems="10"
        android:inputType="text"
        android:hint="Nama  " />
    <EditText
        android:id="@+id/emailET"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignStart="@+id/namaET"
        android:layout_below="@+id/namaET"
        android:ems="10"
        android:hint="Email"
        android:inputType="text" />
    <Button
        android:id="@+id/btn_simpan"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignEnd="@+id/emailET"
        android:layout_below="@+id/emailET"
        android:layout_marginEnd="0dp"
        android:text="Simpan" />
</RelativeLayout>

dan ini file Realtimedatabase.class

public class Realtimedatabase extends AppCompatActivity {
    private DatabaseReference mDatabase;
    EditText emailET,namaET;
    Button btn_simpan;
    String email,nama;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_realtimedatabase);

        emailET = findViewById(R.id.emailET);
        namaET = findViewById(R.id.namaET);
        btn_simpan = findViewById(R.id.btn_simpan);

        btn_simpan.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                email = emailET.getText().toString();
                nama = namaET.getText().toString();

                mDatabase = FirebaseDatabase.getInstance().getReference("users");
                String userId = mDatabase.push().getKey(); //Berfungsi untuk membuat unique ID
                User user = new User(nama, email,"");
                mDatabase.child(userId).setValue(user);
            }
        });
    }
}

dan ini hasilnya

Input data ke Firebase Realtime Database di Android

Bagimana , mudahkan ? bagian untuk Input data ke Firebase Realtime Database di Android, sudah selesai.

Membaca data Firebase Realtime Database di Android

Tahap selanjutnya adalah kita akan membaca data dari Firebase Realtime Database. Jadi sekarang silahkan anda buat activiy baru lagi dan simpan dengan nama Listrealtimedatabase. Dan tambahkan ini kedalam class activity yang baru anda buat.

        mDatabase = FirebaseDatabase.getInstance().getReference("users");
        ValueEventListener valueEventListener = new ValueEventListener() {
            @Override
            public void onDataChange(DataSnapshot dataSnapshot) {
                Log.d("DataUser", dataSnapshot.getValue().toString());
            }

            @Override
            public void onCancelled(DatabaseError databaseError) {}
    };
        mDatabase.addListenerForSingleValueEvent(valueEventListener);

seharusnya anda sudah bisa melihat datanya di bagian Logcat, seperti ini

Sepertinya kalau hanya seperti itu kurang seru ya, mari kita coba untuk memunculkannya ke RecyclerView. Pertama anda buat terlebih dahulu class baru dengan nama Useradapter. Berikut isinya

public class Useradapter extends RecyclerView.Adapter<Useradapter.ViewHolder>{
    private Context context;
    private List<User> users;

    public Useradapter(Context context, List<User> users) {
        this.users = users;
        this.context = context;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View v = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.single_user_layout, parent, false);
        ViewHolder viewHolder = new ViewHolder(v);
        return viewHolder;
    }

    @Override
    public int getItemCount() {
        return users.size();
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        User user = users.get(position);
        holder.nama.setText(user.getNama());
        holder.email.setText(user.getEmail());
    }


    class ViewHolder extends RecyclerView.ViewHolder {

        public TextView nama,email;

        public ViewHolder(View itemView) {
            super(itemView);

            nama = (TextView) itemView.findViewById(R.id.nama);
            email = (TextView) itemView.findViewById(R.id.email);
        }
    }
}

kemudian buat satu layout , layout ini digunakan didalam adapter yang kita buat diatas, simpan dengan nama single_user_layout

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="10dp"
    >
    <TextView
        android:id="@+id/nama"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"

        android:text="TextView" />

    <TextView
        android:layout_marginStart="30dp"
        android:id="@+id/email"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toEndOf="@id/nama"
        android:text="TextView" />
</RelativeLayout>

kemudian, Listrealtimedatabase kita hanya terdapat script yang dibuat untuk memunculkan data via logcat saja. Maka kita akan ganti isi dari class tersebut menjadi seperti ini

public class Listrealtimedatabase extends AppCompatActivity {
Button backtoadd;

    private List<User> users = new ArrayList<>();
    Useradapter adapter;
    RecyclerView listuserRec;


    private DatabaseReference mDatabase;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_listrealtimedatabase);
        backtoadd = findViewById(R.id.backtoadd);
        listuserRec = findViewById(R.id.listuserRec);
        adapter = new Useradapter(this, users);
        RecyclerView.LayoutManager mLayoutManager = new LinearLayoutManager(getApplicationContext());
        listuserRec.setLayoutManager(mLayoutManager);
        listuserRec.setItemAnimator(new DefaultItemAnimator());
        listuserRec.setAdapter(adapter);
        backtoadd.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                startActivity(new Intent(Listrealtimedatabase.this, Realtimedatabase.class));
                finish();
            }
        });
        mDatabase = FirebaseDatabase.getInstance().getReference("users");
        mDatabase.addValueEventListener(new ValueEventListener() {
            @Override
            public void onDataChange(DataSnapshot dataSnapshot) {
                users.clear();
                for (DataSnapshot postSnapshot : dataSnapshot.getChildren()) {
                    User user = postSnapshot.getValue(User.class);
                    user.setUid(postSnapshot.getKey());
                    users.add(user);
                }
                adapter.notifyDataSetChanged();
            }

            @Override
            public void onCancelled(DatabaseError databaseError) {
            }
        });
    }
}

dan untuk file xml dari activitynya seperti ini

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout

    xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Listrealtimedatabase">

    <Button
        android:layout_centerHorizontal="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Kembali ke form tambah"
        android:id="@+id/backtoadd"
        />

    <android.support.v7.widget.RecyclerView
        android:layout_below="@id/backtoadd"
        android:id="@+id/listuserRec"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerInParent="true" />


</RelativeLayout>

mari kita liat sebentar kebagian Listrealtimedatabase , kami menambahkan addValueEventListener didalamnya, dimana itu berfungsi sebagai listener jika ada aktifitas hapus , edit atau tambah data baru.

Kita sudah berhasil membaca data dari Firebase Realtime Database di android dan memunculkannya ke RecylerView.

Edit data Firebase Realtime Database di Android

Dalam penginputan data sering sekali terjadi kesalahan, oleh karena itu dibutuhkan fitur edit data. Sekarang kita akan menambahkan edit data firebase realtime database di android.

Ada beberapa file yang harus diubah atau ditambahkan, seperti adapter dan recylerview nya. Pertama kita akan menambahkan OnClickListener dan OnLongClickListener di adapter kita dengan menggunakan interface.

Tanpa basa-base ubah useradapter, mejadi seperti ini

public class Useradapter extends RecyclerView.Adapter<Useradapter.ViewHolder>{


    private Context context;
    private List<User> users;
   // Declare Interface
    private static ClickListener clickListener;

    public Useradapter(Context context, List<User> users) {
        this.users = users;
        this.context = context;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View v = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.single_user_layout, parent, false);
        ViewHolder viewHolder = new ViewHolder(v);
        return viewHolder;
    }

    @Override
    public int getItemCount() {
        return users.size();
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        User user = users.get(position);

        holder.nama.setText(user.getNama());
        holder.email.setText(user.getEmail());

    }
    
    class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener, View.OnLongClickListener{
        public TextView nama,email;

        public ViewHolder(View itemView) {
            super(itemView);
            itemView.setOnClickListener(this);
            itemView.setOnLongClickListener(this);
            nama = (TextView) itemView.findViewById(R.id.nama);
            email = (TextView) itemView.findViewById(R.id.email);
        }
        // Untuk menghandle event onclick
        @Override
        public void onClick(View v) {
            clickListener.onItemClick(getAdapterPosition(), v);
        }
        // Untuk menghandle event onlongclick
        @Override
        public boolean onLongClick(View v) {
            clickListener.onItemLongClick(getAdapterPosition(), v);
            return false;
        }
    }

    public void setOnItemClickListener(ClickListener clickListener) {
        Useradapter.clickListener = clickListener;
    }
   // Interface
    public interface ClickListener {
        void onItemClick(int position, View v);
        void onItemLongClick(int position, View v);
    }
}

lalu, tambahkan kode dibawah ini kedalam onCreate, activity Listrealtimedatabase.

adapter.setOnItemClickListener(new Useradapter.ClickListener() {
            @Override
            public void onItemClick(int position, View v) {
                Log.d("asdf", "onItemClick position: " + position);
            }
            @Override
            public void onItemLongClick(int position, View v) {
                Log.d("asdf", "onItemLongClick pos = " + position);
            }
});

Kita akan menggunakan AlertDialog. Oke, kita akan memunculkan form sederhana di dalam popup. Pertama buat dulu xml layout dan simpan dengan nama edit_dialog_layout. Dan copy dan pastekan kode dibawah ini kedalamnya

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <EditText
        android:id="@+id/nama"
        android:inputType="text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:layout_marginLeft="4dp"
        android:layout_marginRight="4dp"
        android:layout_marginBottom="4dp"
        android:hint="Nama Lengkap" />
    <EditText
        android:id="@+id/email"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="4dp"
        android:layout_marginLeft="4dp"
        android:layout_marginRight="4dp"
        android:layout_marginBottom="16dp"
        android:fontFamily="sans-serif"
        android:hint="Alamat Email"/>
    <Button
        android:id="@+id/ubahdata"
        android:text="Ubah Data"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>

Lalu, ubah onclick listener adapter pada activity menjadi seperti ini :

    @Override
            public void onItemClick(final int position, View v) {
                // custom dialog
               dialog = new Dialog(Listrealtimedatabase.this);
                dialog.setContentView(R.layout.edit_dialog_layout);
                dialog.getWindow().setLayout(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.WRAP_CONTENT);


                final EditText nama =  dialog.findViewById(R.id.nama);
                nama.setText(users.get(position).getNama());

                final EditText email =  dialog.findViewById(R.id.email);
                email.setText(users.get(position).getEmail());

                Button updateButton = dialog.findViewById(R.id.ubahdata);

                updateButton.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {

                        userId =  users.get(position).getUid();
                        NamaBaru = nama.getText().toString();
                        EmailBaru = email.getText().toString();
                        Map<String, Object> updates = new HashMap<String,Object>();
                        updates.put("nama", NamaBaru);
                        updates.put("email", EmailBaru);
                        mDatabase.child(userId).updateChildren(updates);
                        dialog.dismiss();
                    }
                });

                dialog.show();
            }

Skrip diatas, kita menggunakan dialog dengan custom layout (edit_dialog_layout ). Dan ketika update, kami menggunakan kode dibawah ini.

Map<String, Object> updates = new HashMap<String,Object>();
                        updates.put("nama", NamaBaru);
                        updates.put("email", EmailBaru);
                        mDatabase.child(userId).updateChildren(updates);

Silahkan anda coba, pasti data di firebase realtime database sudah bisa berubah sesuai dengan isi form.

Hapus data Firebase Realtime Database di Android

Untuk menghapus kita akan menggunakan onItemLongClick, jadi ketikan item di tekan lama akan anda muncul alert konfirmasi. Jika ya, kita akan menghapus data dan jika tidak data tidak akan terhapus.

Untuk menghapus, kita hanya butuh kode dibawah ini

 mDatabase.child(userId).removeValue();

Mari kita mulai, kita akan mengubah onItemLongClick menjadi seperti ini

            @Override
            public void onItemLongClick(int position, View v) {
                AlertDialog.Builder builder = new AlertDialog.Builder(Listrealtimedatabase.this
                );

                builder.setTitle("Menghapus Data");
                builder.setMessage("Apakah anda yakin?");
                userId =  users.get(position).getUid();
                builder.setPositiveButton("YES", new DialogInterface.OnClickListener() {
                    public void onClick(DialogInterface dialog, int which) {
                        mDatabase.child(userId).removeValue();
                        dialog.dismiss();
                    }
                });

                builder.setNegativeButton("NO", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        dialog.dismiss();
                    }
                });

                AlertDialog alert = builder.create();
                alert.show();
            }

Jadi secara lengkap, Listrealtimedatabase adalah seperti ini

package com.tukangaplikasi.splashscreen;

import android.app.Dialog;
import android.content.DialogInterface;
import android.content.Intent;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.DefaultItemAnimator;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.EditText;


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 com.google.firebase.database.ValueEventListener;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

public class Listrealtimedatabase extends AppCompatActivity {
Button backtoadd;

    private List<User> users = new ArrayList<>();
    Useradapter adapter;
    RecyclerView listuserRec;
     String userId ,NamaBaru,EmailBaru;
    private DatabaseReference mDatabase;
    Dialog dialog;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_listrealtimedatabase);
        backtoadd = findViewById(R.id.backtoadd);
        listuserRec = findViewById(R.id.listuserRec);
        adapter = new Useradapter(this, users);
        RecyclerView.LayoutManager mLayoutManager = new LinearLayoutManager(getApplicationContext());
        listuserRec.setLayoutManager(mLayoutManager);
        listuserRec.setItemAnimator(new DefaultItemAnimator());
        listuserRec.setAdapter(adapter);
        mDatabase = FirebaseDatabase.getInstance().getReference("users");

        adapter.setOnItemClickListener(new Useradapter.ClickListener() {
            @Override
            public void onItemClick(final int position, View v) {
                // custom dialog
               dialog = new Dialog(Listrealtimedatabase.this);
                dialog.setContentView(R.layout.edit_dialog_layout);
                dialog.getWindow().setLayout(ViewGroup.LayoutParams.MATCH_PARENT,ViewGroup.LayoutParams.WRAP_CONTENT);


                final EditText nama =  dialog.findViewById(R.id.nama);
                nama.setText(users.get(position).getNama());

                final EditText email =  dialog.findViewById(R.id.email);
                email.setText(users.get(position).getEmail());

                Button updateButton = dialog.findViewById(R.id.ubahdata);


                updateButton.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        userId =  users.get(position).getUid();
                        NamaBaru = nama.getText().toString();
                        EmailBaru = email.getText().toString();
                        Map<String, Object> updates = new HashMap<String,Object>();
                        updates.put("nama", NamaBaru);
                        updates.put("email", EmailBaru);
                        mDatabase.child(userId).updateChildren(updates);
                        dialog.dismiss();
                    }
                });

                dialog.show();
            }

            @Override
            public void onItemLongClick(int position, View v) {
                AlertDialog.Builder builder = new AlertDialog.Builder(Listrealtimedatabase.this
                );

                builder.setTitle("Menghapus Data");
                builder.setMessage("Apakah anda yakin?");
                userId =  users.get(position).getUid();
                builder.setPositiveButton("YES", new DialogInterface.OnClickListener() {
                    public void onClick(DialogInterface dialog, int which) {
                        mDatabase.child(userId).removeValue();
                        dialog.dismiss();
                    }
                });

                builder.setNegativeButton("NO", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        dialog.dismiss();
                    }
                });

                AlertDialog alert = builder.create();
                alert.show();
            }
        });

        backtoadd.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                startActivity(new Intent(Listrealtimedatabase.this, Realtimedatabase.class));
                finish();
            }
        });
        mDatabase = FirebaseDatabase.getInstance().getReference("users");
        mDatabase.addValueEventListener(new ValueEventListener() {
            @Override
            public void onDataChange(DataSnapshot dataSnapshot) {
                users.clear();
                for (DataSnapshot postSnapshot : dataSnapshot.getChildren()) {
                    Log.d("SNAP" ,postSnapshot.getKey());
                    User user = postSnapshot.getValue(User.class);
                    user.setUid(postSnapshot.getKey());
                    users.add(user);
                }
                adapter.notifyDataSetChanged();
            }

            @Override
            public void onCancelled(DatabaseError databaseError) {
            }
        });
    }
}

Kita sudah membahas tentang Realtime Database di Android, khususnya cara Create Input data ke Firebase Realtime Database di Android , Read atau Membaca data Firebase Realtime Database di Android, Update atau ubah data Firebase Realtime Database di Android dan Delete atau hapus data Firebase Realtime Database di Android. Semoga bermanfaat.

Jika ada yang ingin anda tanyakan, silahkan tinggalkan pertanyaan anda di kolom komentar.

Subscribe To Our Newsletter

Subscribe To Our Newsletter

Kami memberikan tutorial baru tiap harinya !!!

You have Successfully Subscribed!