Selasa, 08 Januari 2019

Tutorial CRUD Firebase Realtime Database Android (I) : Membuat Fungsi Create Data

Sekarang kita akan belajar membuat fitur create/insert data yang berguna untuk memasukkan data baru ke Firebase Realtime DB. Karena database pada Firebase Realtime DB disimpan di cloud/online, maka kita membutuhkan koneksi internet saat ingin meng-create data baru. Dan karena tipe database pada Firebase Realtime DB adalah NoSQL, maka kita tidak perlu membuat susunan tabel seperti di SQLite. Karena pada database NoSQL data yang kita masukkan adalah berbentuk key-value pairs.
Pada tutorial Create Data ini, kita akan membuat formulir sederhana yang bisa diisi pada aplikasi kita, dan begitu kita tekan tombol submit, maka datanya akan langsung dikirimkan ke Firebase Realtime Database secara online.
Pertama-tama, kita akan membuat halaman menu aplikasi-nya terlebih dahulu. Buka layout activity_main.xmlkalian dan isikan kode di bawah ini :

activity_main.xml

Jika sudah, maka kita akan ganti isi dari MainActivity.java, menjadi seperti di bawah ini :
MainActivity.java

Oke, jadi pada menu aplikasi kita akan ada dua buah tombol, yaitu tombol “Tambah Data” dan tombol “Lihat Data”. Apabila tombol “Tambah Data” diklik, maka aplikasi akan berpindah ke activity Create Data. Karena activity Create Data tersebut belum ada, maka langkah selanjutnya kita akan membuat activity tersebut, namun kita akan membuat file xml layout-nya terlebih dahulu, yang bernama activity_db_create.xml :
activity_db_create.xml 

Oh iya, sebelumnya kita buat model Barang-nya terlebih dahulu ya, kelas ini bernama Barang.java. Fungsi kelas ini adalah untuk menyimpan atribut-atribut dari data Barang yang akan kita masukkan, dan juga beberapa method getter dan setter
Barang.java

Simpel bukan? Sekarang kita lanjut ke Activity Create Data, buat activity baru bernama FirebaseDBCreateActivity.java dan masukkan kode di bawah ini :
FirebaseDBCreateActivity.java


Yang terakhir adalah fungsi onSuccessListener yang akan dipanggil apabila data berhasil dimasukkan ke Firebase database. Jika proses create data baru berhasil, maka akan muncul snackbar dan field2 EditText akan dikosongkan kembali.
Finally, jangan lupa tambahkan FirebaseDBCreateActivity.java pada AndroidManifest.xml.



Tutorial CRUD Firebase Realtime  

Database Android (II) : Membuat  

Fungsi Read Data


Oke, langsung saja, pada tutorial kali ini kita akan menambahkan fitur lihat data barang pada aplikasi inventaris yang akan kita buat. Karena berbeda dengan database SQLite yang datanya disimpan di lokal, pada Firebase Realtime Database datanya disimpan secara online di cloud. Jadi pada tutorial ini kita akan belajar untuk mendownload semua data yang ada pada cloud Firebase Realtime DB, kemudian menampilkannya pada aplikasi inventaris kita menggunakan list RecyclerView.

Karena pada tutorial sebelumnya kita sudah memasukkan beberapa data, kita bisa melihat data yang sudah kita masukkan tersebut pada Firebase Console.


Bisa kita lihat pada screenshot console Firebase di atas, data yang kita masukkan sebenarnya sudah ada di dalam Firebase Realtime DB dalam bentuk JSON. Selanjutnya kita hanya perlu membuat fungsi untuk membaca data tersebut dan menampilkannya di aplikasi inventaris.

Karena nanti kita akan menampilkannya pada RecyclerView, maka kita akan membuat layout untuk tiap-tiap item pada daftar barang terlebih dahulu, buat sebuah file layout XML bernama item_barang dan isikan kode di bawah ini :

item_barang.xml


Jika sudah, selanjutnya kita akan membuat file XML layout untuk Activity Read Data, beri nama xml nya activity_db_read, dan isikan kode di bawah ini :

activity_db_read.xml


Selanjutnya, kita akan membuat kelas Adapter yang nanti akan digunakan di RecyclerView, adapter ini berguna untuk mengolah data yang kita download, dan menampilkannya pada RecyclerView. Buatlah sebuah file java bernama AdapterBarangRecyclerView, dan copy-pastekan kode di bawah ini :

AdapterBarangRecyclerView.java


Setelah itu, karena kita sudah membuat layout untuk Activity Read Data di atas, maka kita akan membuat kodingan pada Read Data Activity itu sendiri. Di activity itulah nantinya akan ada kode yang berfungsi untuk membaca data dari Firebase Realtime Database dan menampilkannya di RecyclerView. Buatlah sebuah file Android activity .java bernama FirebaseDBReadActivity, dan isikan kode di bawah ini :


Maka aplikasi akan berpindah ke Activity Read Data yang baru saja kita buat :

MainActivity.java


Setelah itu, jangan lupa juga untuk menambahkan FirebaseDBReadActivity ke dalam daftar activity di AndroidManifest.xml :




Demo

Kita sudah memasukkan beberapa barang di tutorial sebelumnya :
Tambahkan lagi beberapa data. Kemudian kembali ke Main Menu, dan pilih Lihat Data :
Dan voila, data-data barangnya sudah ada di sana :


Tutorial CRUD Firebase Realtime
Database Android (III) : Membuat
Fungsi Update Data

Oke, jadi sebagai gambaran saja, mari kita langsung lihat code yang digunakan untuk update data di Firebase Realtime Database. Gambaran kodenya adalah seperti di bawah ini :-codingKemudian, dimana kodingan update data di atas perlu ditambahkan? Kalian bisa membuka project aplikasi inventaris yang sudah kalian buat sesuai dengan tutorial-tutorial sebelumnya di Android Studio. Selanjutnya buka kelas FirebaseDBCreateActivity.java, dan copy-paste kan kode di bawah ini :
Karena Firebase Realtime DB bersifat NoSQL, maka hal ini termasuk lumayan tricky, tidak seperti database SQLite yang mempunyai index dan primary key, pada NoSQL datanya tidak mempunyai index sehingga satu2nya parameter yang bisa kita gunakan sebagai id adalah key tersebut.
Kemudian, dimana kodingan update data di atas perlu ditambahkan? Kalian bisa membuka project aplikasi inventaris yang sudah kalian buat sesuai dengan tutorial-tutorial sebelumnya di Android Studio. Selanjutnya buka kelas FirebaseDBCreateActivity.java, dan copy-paste kan kode di bawah ini :
FirebaseDBCreateActivity.java



Untuk fitur update data ini, kita akan menggunakan activity yang sudah ada, yaitu activity FirebaseDBCreateActivityyang juga digunakan untuk proses Insert/Create data. Bedanya, pada update data kita akan mengirim bundle berisi data barang yang akan diupdate, kemudian kita menggunakan form yang sama untuk mengganti data barang, seperti nama barang, harga dan sebagainya. Saat user mengklik tombol “Submit” itulah kode untuk update barang di atas akan dipanggil.

Membuat Interface Dialog untuk Akses Fitur Update Barang

Lantas bagaimana cara kita mengakses activity update barang? Di sini kita akan mengakses fitur update barang dari activity Read Data. Jadi pada activity Read Data yang sudah kita buat di tutorial sebelumnya, ada sebuah list RecyclerView yang berguna untuk menampilkan daftar barang. Di sana kita akan tambahkan OnLongClickListener pada item RecyclerView. Ketika kita melakukan long click pada item yang ingin kita update akan muncul sebuah dialog menu.
Oke, mari kita buat dialog menu-nya terlebih dahulu. Caranya cukup buat satu file xml layout baru bernama dialog_view.xml dan isikan kode berikut ini :
dialog_view.xml
Jika sudah, selanjutnya kita akan implement fungsi onLongClickListener pada RecyclerView di activity Read Data. Buka class adapter RecyclerView yang bernama AdapterBarangRecyclerView dan ganti kode pada fungsi onBindViewHolder() menjadi seperti di bawah ini :


Tutorial CRUD Firebase Realtime
Database di Android (IV) : Membuat
Fungsi Delete Data


Bagian tricky nya, karena kita memasang listener long click itu pada adapter yang tidak mempunyai reference ke FirebaseDatabase, maka di sini kita akan menggunakan sebuah interface, yang berfungsi untuk menyambungkan adapter dengan Read Data activity yang mempunyai reference ke FirebaseDatabase, sehingga aksi Delete data bisa dilakukan, dan sekaligus update view di Read Data activity.

Buka file AdapterBarangRecyclerView.java dan tambahkan interface berikut di bagian paling bawah source code, sebelum tanda “}” terakhir :



Kemudian masih di kelas AdapterBarangRecyclerView.java, tambahkan variabel untuk FirebaseDataListener, dan juga tambahkan kode untuk inisialisasi variabel tersebut pada constructor, kodenya seperti di bawah ini :


Masih di kelas adapter yang sama, pada bagian onBindViewHolder() tambahkan kode seperti di bawah ini yang berfungsi untuk melakukan pemanggilan interface saat tombol delete diklik, dan fungsi onDeleteData() akan dijalankan.

Selanjutnya, buka file activity Read Data (FirebaseDBReadActivity.java), di sana kita buat kelas nya mengimplement interface FirebaseDataListener yang kita buat di atas. Dan kemudian kita override method onDeleteData() dari interface tersebut. Di situlah kita akan melakukan operasi delete data. Kode lengkapnya seperti di bawah ini :
FirebaseDBReadActivity.java

 Aplikasi akan menggunakan key barang sebagai ID / penanda barang mana yang akan didelete. Jika pada database ada barang dengan key yang sama, maka aplikasi akan memanggil fungsi removeValue() pada Firebase Realtime DB. Dan menghapus data tersebut dari Firebase Realtime DB.

Demo

Buka aplikasinya, dan kemudian langsung masuk ke menu Lihat Data. Contoh di bawah sudah ada beberapa data di Firebase Realtime Data, jika belum ada data, bisa Tambah Data terlebih dahulu.

Kemudian pilih data yang ingin dihapus, contoh kita akan menghapus data “sepeda motor”, maka ketika kita lakukan long click akan muncul dialog seperti di bawah. Klik > “Delete”. Dan data “sepeda motor” pun akan langsung terhapus dari database Firebase, seperti flow di bawah :

Sekian Tutorailnya Semoga Bermanfaat.

Tidak ada komentar:

Posting Komentar