Aplikasi CRUD Android MySql – Kali ini kita akan membahas bagaimana pembuatan CRUD pada aplikasi berbasis android dengan menggunakan database mysql, kita juga akan memanfaatkan retrofit sebagai rest api client dan laravel sebagai platform web service. Tanpa berbasa-basi lagi, langsung saja kita masuk pada pembahasan bagaimana cara membuat aplikasi crud android menggunakan mysql sebagai database.
BACA JUGA : https://soft-gain.com/2020/06/13/tutorial-laravel-membuat-aplikasi-web-service/
Goals – Mampu membuat operasi CRUD pada aplikasi berbasis android
Diharapkan kita mampu membuat operasi crud pada aplikasi android, dengan memanfaatkan library retrofit dan frame work
php yaitu laravel. Untuk metode read data dalam bentuk list sudah pernah dibahas pada artikel ini (https://soft-gain.com/2020/06/23/contoh-sederhana-recyclerview-cardview-dengan-implementasi-retrofit/) dan diharapkan untuk membaca artikel sebelumnya yang membahas pembuatan list data karena artikel ini
merupakan kelanjutannya, kali ini kita akan melanjutkan pembuatan pada bagian create, update dan delete data. Contoh hasil aplikasi yang akan kita buat kurang lebih seperti ini :
Contoh List Data
Contoh Form Data
Contoh Hapus Data
Materi
Pertama-tama kita akan menambahkan end point api kita pada file Interface.java, buka file tersebut dan tambahkan code dibawah ini :
Sedikit penjelasan, kita menambahkan beberapa end point dengan metode request yang berbeda-beda, kita mendeklarasikan suatu metode pada end point dengan menggunakan annotation @ (contoh @PUT, berarti kita menggunakan metode PUT untuk end point yang satu ini).
Berikutnya didalam end point kita juga men-deklarasi-kan ke-url mana end point ini kita tujukan (contoh barang/store, berarti yang akan kita hit adalah end point http://root/barang/store, dimana http://root kita definisikan dari file Client.java). Next, setelahnya kita memanggil model yang akan menjadi re-presentasi response yang akan diterima oleh aplikasi kita (contoh Call, didalam class GetResponseSuccess telah terisi attribute, object dan serialisasi data yang sesuai dengan response yang kita terima).
Barulah kita membuat suatu interface baru yang didalamnya bisa kita sisipkan parameter-parameter yang hendak kita sertakan saat end point api kita hit (contoh postBarangDelete adalah nama service atau interface dan didalamnya kita sertakan attribute parameter seperti @Header, @Path, @Field dan lain-lain).
Berikutnya buatlah 3 class baru dalam model, class GetReponseSuccess, class
SingleDataSuccess dan class SingleDataBarang. Untuk struktur penempatan modelnya boleh disamakan seperti ini :
Struktur Model
Class
GetReponseSuccess akan digunakan berkali-kali untuk men-handle response standar ketika kita sukses melakukan operasi PUT, POST dan DELETE. Isi class-nya kurang lebih seperti ini :
package com.soft_gain.myinventory.Model;
import com.google.gson.annotations.Expose;
import com.google.gson.annotations.SerializedName;
public class GetReponseSuccess {
@SerializedName("success")
@Expose
private Boolean success;
public Boolean getSuccess() {
return success;
}
public void setSuccess(Boolean success) {
this.success = success;
}
}
Untuk class SingleDataBarang akan berisi object dari class SingleDataSuccess, dimana isi dari class SingleDataSuccess adalah attribute yang sudah di serialisasi dari class Datum.java (hal ini dilakukan karena response yang kita terima saat hendak melakukan edit data memiliki struktur object didalam object, sehingga mengharuskan kita untuk membuat beberapa model agar kita dapat men-serialisasi-kan object yang hendak kita pakai).
Isi dari class SingleDataBarang dan class SingleDataSuccess masing-masing seperti ini :
package com.soft_gain.myinventory.Model.Barang;
import com.google.gson.annotations.Expose;
import com.google.gson.annotations.SerializedName;
public class SingleDataSuccess {
@SerializedName("data")
@Expose
private Datum data;
public Datum getData() {
return data;
}
public void setData(Datum data) {
this.data = data;
}
}
package com.soft_gain.myinventory.Model.Barang;
import com.google.gson.annotations.Expose;
import com.google.gson.annotations.SerializedName;
public class SingleDataBarang {
@SerializedName("success")
@Expose
private SingleDataSuccess success;
public SingleDataSuccess getSuccess() {
return success;
}
public void SingleDataSuccess(SingleDataSuccess success) {
this.success = success;
}
}
Create atau Insert Data
Pertama buatlah sebuah layout baru, layout ini akan kita jadikan sebagai top menu yang berisi button “tambah data” saat kita membuka list view, silahkan beri nama top_menu_fragment_list.xml, isinya kurang lebih seperti ini :
Untuk asset @drawable/ic_add sendiri, silahkan klik kanan pada bagian drawable dan ikuti
petunjuk dibawah ini :
Contoh Add Image Drawable 1.1
Lalu isikan seperti dibawah ini (silahkan sesuaikan nama dan gambar yang hendak dipakai
sebagai asset) :
Contoh Add Image Drawable 1.2
Berikutnya kita akan modifikasi sedikit class MainActivity, ubah pada metode onOptionsItemSelected menjadi seperti dibawah ini :
public boolean onOptionsItemSelected(MenuItem item) {
Fragment fragment = null;
int id = item.getItemId();
if (id == R.id.action_logout) {
logout();
return true;
}else if (id == R.id.action_add) {
fragment = new BarangFragmentFormAdd();
if (fragment != null) {
FragmentManager fragmentManager = getSupportFragmentManager();
fragmentManager.beginTransaction().replace(R.id.content_frame, fragment).commit();
} else {
/*Log.e("log softgain : ", "Error in creating fragment");*/
}
return true;
}
if (mDrawerToggle.onOptionsItemSelected(item)) {
return true;
}
return super.onOptionsItemSelected(item);
}
Yang perlu diperhatikan diatas adalah penambahan statement else if (id == R.id.action_add), dimana id action_add adalah id pada layout yang sudah kita tambahkan sebelumnya, dan jika statement terpenuhi atau sama dengan true maka kita akan menjalankan sebuah fragment baru (ada pada baris ini
new BarangFragmentFormAdd()), yang mana fragment inilah yang memiliki fungsi untuk menampilkan form tambah data.
Berikutnya kita akan menambahkan sebuah class baru BarangFragmentFormAdd, didalam class ini kita akan mendefinisikan metode penyimpanan data kedalam database. Isi class BarangFragmentFormAdd seperti ini :
Yang perlu dipahami adalah, pada metode onClick kita telah menjalankan end point api yang sudah kita buat sebelumnya yaitu postBarangStore, berikut juga kita
definisikan semua parameter yang diperlukan oleh end point api tersebut (pada bagian ini Call call = service.postBarangStore(“Bearer “+token, nama_barang.getText().toString(), jumlah_barang.getText().toString(), keterangan.getText().toString());), perlu diingat untuk urutan parameter yang hendak kita kirim jangan sampai salah karena akan mempengaruhi proses yang terjadi disisi server. Lalu jika proses simpan data berhasil
(statement ini response.isSuccessful()), tampilan akan kita kembalikan pada bagian list data (ada pada bagian ini new BarangFragmentList()).
Berikutnya kita akan buat sebuah layout baru dengan nama fragment_barang_form.xml, layout inilah yang akan menjadi interface dari form yang akan kita gunakan. Isi dari file fragment_barang_form seperti ini :
Terakhir tambahkan sebuah file pada drawable
asset dengan nama rounded_edittext.xml yang akan kita gunakan sebagai design template dari editText yang kita gunakan pada form isi-an. Isi dari file rounded_edittext seperti ini :
Read data
Pada tampilan list data, terdapat dua buah button berbentuk pensil dan tempat sampah, ketika user men-klik button pensil kita hendak memanggil single data dan kita tampilkan pada form agar user dapat melakukan perubahan pada data tersebut.
Pertama kita akan melakukan
sedikit modifikasi pada class BarangAdapter, kita akan melakukan perubahan pada metode onBindViewHolder. Silahkan ubah bagian onBindViewHolder menjadi seperti dibawah ini :
Kita akan memberikan event on click pada button edit yang kita definisi-kan sebagai holder.edit, didalamnya kita akan menyimpan id yang akan menjadi acuan data mana yang akan diubah (kita definisi-kan sebagai idData). Id tadi akan kita simpan ke dalam shared preferences
(dibagian ini editor.putString(“editedIdBarang”, idData)), lalu kita akan membuka sebuah fragment baru yaitu BarangFragmentFormEdit (anyway, jika pembaca ada yang memiliki metode pemindahan id dari satu fragment ke fragment lainnya dengan cara yang lebih efisien silahkan disampaikan pada kolom komentar).
Lalu
kita akan membuat sebuah class baru dengan nama BarangFragmentFormEdit, isi dari class BarangFragmentFormEdit kurang lebih seperti ini :
Untuk proses pembacaan data, kita akan fokus pada metode onCreateView dibagian Call call = service.postBarangEdit(“Bearer “+token, editedIdBarang), dibagian ini kita akan menggunakan end point api kita untuk memanggil data yang hendak kita modifikasi. Jika berhasil, maka data yang kita terima akan kita
masukan pada editText untuk ditampilkan pada user :
Dan kita masih akan menggunakan layout fragment_barang_form sebagai interface form isi-an.
Update data
Untuk proses update data, kita masih akan melakukannya pada class BarangFragmentFormEdit, untuk update data itu sendiri kita akan melakukannya pada on click event dari button dengan id submit. Untuk detailnya ada pada bagian ini :
Pada bagian ini hampir mirip
dengan fungsi untuk menyimpan data, hanya saja kali ini end point api yang kita hit adalah postBarangUpdate.
Delete data
Untuk proses hapus data, kita akan kembali ke class BarangAdapter. Jika untuk edit data kita menggunakan holder.edit, maka untuk hapus data kita akan gunakan holder.delete :
Didalamnya, kita akan memanggil metode baru yaitu showDialog, metode ini adalah metode sederhana untuk memunculkan popup dialog yes/no yang akan kita manfaatkan
untuk men-konfirmasi user jika hendak men-hapus data. Detail metode-nya seperti ini :
public void showDialog(final String title, final String id) throws Exception {
AlertDialog.Builder builder = new AlertDialog.Builder(context);
builder.setMessage("Hapus : " + title + "?");
builder.setPositiveButton("Ya", new DialogInterface.OnClickListener(){
@Override
public void onClick(DialogInterface dialog, int which){
dialog.dismiss();
progressDoalog = new ProgressDialog(context);
progressDoalog.setMessage("Loading....");
progressDoalog.show();
myPrefs = context.getSharedPreferences("sg_shared_pref", context.MODE_PRIVATE);
String token = myPrefs.getString("token", "");
Interface service = Client.getClient().create(Interface.class);
Call call = service.postBarangDelete("Bearer "+token, id);
call.enqueue(new Callback() {
@Override
public void onResponse(Call call, Response response) {
if(response.isSuccessful()){
progressDoalog.dismiss();
Toast.makeText(context, "Hapus data berhasil!", Toast.LENGTH_SHORT).show();
BarangFragmentList nextFrag= new BarangFragmentList();
((MainActivity)context).getSupportFragmentManager().beginTransaction()
.replace(R.id.content_frame, nextFrag, "findThisFragment")
.addToBackStack(null)
.commit();
}else{
/*Log.v("log softgain : ", String.valueOf(response.errorBody()));*/
progressDoalog.dismiss();
Toast.makeText(context ,"Hapus data gagal!",Toast.LENGTH_SHORT).show();
}
}
@Override
public void onFailure(Call call, Throwable t) {
/*Log.v("log softgain : ", String.valueOf(t));*/
progressDoalog.dismiss();
Toast.makeText(context, "Something went wrong...Please try later!", Toast.LENGTH_SHORT).show();
}
});
}
});
builder.setNegativeButton("Tidak", new DialogInterface.OnClickListener(){
@Override
public void onClick(DialogInterface dialog, int which){
dialog.dismiss();
}
});
builder.show();
}
Jika user memilih yes, maka kita akan menjalankan end point api postBarangDelete agar data yang dimaksud dapat dihapus dari database.
Penutup
Demikian lah proses pembuatan CRUD pada aplikasi berbasis android menggunakan mysql sebagai database, retrofit sebagai rest api client dan frame work laravel sebagai platform serb service. Menurut saya pemahaman tentang crud ini
sendiri sangatlah penting, karena memang ini adalah dasar dan modal dari semua aplikasi yang akan kita buat di-kemudian hari. Semoga bermanfaat dan mohon maaf apabila terdapat kekeliruan penjelasan pada artikel ini, silahkan ambil full source-nya pada repo ini (https://github.com/ImmanuelJL/myinventory.git), terima kasih.
