Tutorial CRUD Firebase Realtime Database di Android (V) : Membuat Fungsi Lihat Detail Data

Last Updated on 7 years by Mas Herdi

Kali ini pada tutorial terakhir tentang Firebase Realtime Database di Android, kita akan belajar bagaimana melihat detail data pada aplikasi inventaris sederhana yang kita buat. Sebelumnya kita sudah belajar tentang bagaimana cara insert data, lihat data, edit data, dan juga delete data. Tutorial ini sebagai pelengkap dari fitur lihat data, dimana pada fitur lihat data kita sudah menampilkan datanya dalam bentuk list RecyclerView, yang akan kita tambahkan di sini adalah ketika item pada list tersebut diklik maka kita akan dibawa ke halaman baru untuk melihat detail data tersebut.

Pre-Requisites

Tutorial ini berhubungan dengan tutorial-tutorial tentang Firebase Realtime Database sebelumnya (Tutorial I – IV), karena itu silahkan kalian baca dulu tutorial-tutorial tersebut di sini, atau kalian bisa lihat pada link pre-requisites di bawah ini :

• Menambahkan Firebase Realtime DB ke aplikasi
• Membuat Fitur Insert Data
• Membuat Fitur Read Data
• Membuat Fitur Edit Data
• Membuat Fitur Delete Data

Menambahkan Fitur Get Detail Data pada Firebase Realtime Database

Sebenarnya tutorial terakhir ini cukup simpel, karena data yang kita perlukan sudah diambil semuanya pada saat kita membuat fitur Read Data. Sehingga kita sudah mempunyai data detail tersebut dan hanya perlu membuat satu activity baru untuk menampilkan detail data tersebut. Untuk xml layout activity detail data ini, kita ambil xml layout yang sudah ada dari activity Create Data, sehingga kita tidak perlu membuat layout baru lagi.

activity_db_create.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp"
    android:orientation="vertical">
 
    <TextView
        android:layout_margin="5dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TWOH.Co Realtime Database"/>
 
    <Button
        android:layout_margin="5dp"
        android:id="@+id/bt_createdata"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Tambah Data" />
 
    <Button
        android:layout_margin="5dp"
        android:id="@+id/bt_viewdata"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Lihat Data" />
 
</LinearLayout>

Sedangkan untuk activity read detail data nya, buat file java baru bernama FirebaseDBReadSingleActivity dan isikan kode berikut ini :

FirebaseDBReadSingleActivity.java

package id.web.twoh.twohfirebase;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;

import id.web.twoh.twohfirebase.model.Barang;

/**
 * Created by Hafizh Herdi on 10/15/2017.
 */

public class FirebaseDBReadSingleActivity extends AppCompatActivity {

    private Button btSubmit;
    private EditText etNama;
    private EditText etMerk;
    private EditText etHarga;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_db_create);
        etNama = (EditText) findViewById(R.id.et_namabarang);
        etMerk = (EditText) findViewById(R.id.et_merkbarang);
        etHarga = (EditText) findViewById(R.id.et_hargabarang);
        btSubmit = (Button) findViewById(R.id.bt_submit);

        etNama.setEnabled(false);
        etMerk.setEnabled(false);
        etHarga.setEnabled(false);
        btSubmit.setVisibility(View.GONE);

        Barang barang = (Barang) getIntent().getSerializableExtra("data");
        if(barang!=null){
            etNama.setText(barang.getNama());
            etMerk.setText(barang.getMerk());
            etHarga.setText(barang.getHarga());
        }
    }

    public static Intent getActIntent(Activity activity){
        return new Intent(activity, FirebaseDBReadSingleActivity.class);
    }
}

Fungsi kelas tersebut hanyalah untuk menampilkan data saja, sehingga kita menonaktifkan segala fitur untuk edit data dan juga menghilangkan “Submit” button dari view.

Setelah itu, kita akan melakukan perubahan pada activity Read Data, dimana kita akan menambahkan onClickListener pada item di RecyclerView. Sehingga apabila item di list RecyclerView diklik, maka aplikasi akan berpindah ke activity Read Detail Data dan menampilkan detail data dari item yang diklik.

Buka class AdapterBarangRecyclerView.java dan ganti kodingan pada method onBindViewHolder() menjadi seperti di bawah ini :

@Override
    public void onBindViewHolder(ViewHolder holder, final int position) {
        /**
         *  Menampilkan data pada view
         */
        final String name = daftarBarang.get(position).getNama();
        System.out.println("BARANG DATA one by one "+position+daftarBarang.size());
        holder.tvTitle.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                /**
                 *  Kodingan untuk tutorial <span data-mce-type="bookmark" style="display: inline-block; width: 0px; overflow: hidden; line-height: 0;" class="mce_SELRES_start"></span>Read detail data
                 */
                context.startActivity(FirebaseDBReadSingleActivity.getActIntent((Activity) context).putExtra("data", daftarBarang.get(position)));
            }
        });
        holder.tvTitle.setOnLongClickListener(new View.OnLongClickListener() {
            @Override
            public boolean onLongClick(View view) {
                /**
                 *  Kodingan untuk tutorial delete dan update data
                 */
                final Dialog dialog = new Dialog(context);
                dialog.setContentView(R.layout.dialog_view);
                dialog.setTitle("Pilih Aksi");
                dialog.show();

                Button editButton = (Button) dialog.findViewById(R.id.bt_edit_data);
                Button delButton = (Button) dialog.findViewById(R.id.bt_delete_data);

                //apabila tombol edit diklik
                editButton.setOnClickListener(
                        new View.OnClickListener() {
                            @Override
                            public void onClick(View view) {
                                dialog.dismiss();
                                context.startActivity(FirebaseDBCreateActivity.getActIntent((Activity) context).putExtra("data", daftarBarang.get(position)));
                            }
                        }
                );

                //apabila tombol delete diklik
                delButton.setOnClickListener(
                        new View.OnClickListener() {
                            @Override
                            public void onClick(View view) {
                                dialog.dismiss();
                                listener.onDeleteData(daftarBarang.get(position), position);
                            }
                        }
                );
                return true;
            }
        });
        holder.tvTitle.setText(name);
    }

Yang kita lakukan di atas hanyalah menambahkan onClickListener pada item RecyclerView, yang apabila diklik akan memanggil activity read detail data di atas, dan menampilkan data yang dipassingkan melalui bundle intent.

Kemudian, jangan lupa untuk meregister activity baru kita, FirebaseDBReadSingleActivity, di Android Manifest.

<activity android:name=".FirebaseDBReadSingleActivity"/>

That’s all, hanya itu saja yang perlu kita tambahkan, sekarang langsung ke demo nya. 🙂

Demo

Langsung saja buka menu Lihat Data, dan pilih data mana yang ingin kita lihat detailnya di RecyclerView.

View Data Detail Firebase Realtime Database

Oke, dengan berakhirnya tutorial ini, maka saya nyatakan juga bahwa series Tutorial CRUD Firebase Realtime Database di Android telah selesai. 😀 Aplikasinya nanti akan saya upload ke Play Store, namun secara konsep kerjanya tidak beda jauh dengan aplikasi AppInventory SQLite yang sudah ada di Google Play Store.

Semoga berguna, untuk source code-nya, kalian bisa download di GitHub saya. Jangan lupa untuk follow dan star juga ya. 😀

Dan jangan sungkan untuk bertanya apabila ada yang kurang mengerti, silahkan tulis lewat komentar di bawah. 😉