Aplikasi CRUD Android MySql, Menggunakan Retrofit dan Laravel

Cara Membuat Aplikasi Android

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://softgain-technology.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://softgain-technology.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.

Materi

Pertama-tama kita akan menambahkan end point api kita pada file Interface.java, buka file tersebut dan tambahkan code dibawah ini :

@FormUrlEncoded
@PUT("barang/store")
Call<GetReponseSuccess> postBarangStore(@Header("Authorization") String Authorization,
                                            @Field("nama_barang") String nama_barang,
                                            @Field("jumlah_barang") String jumlah_barang,
                                            @Field("keterangan") String keterangan);

@POST("barang/edit/{id}")
Call<SingleDataBarang> postBarangEdit(@Header("Authorization") String Authorization,
                                          @Path(value = "id", encoded = true) String id);

@FormUrlEncoded
@POST("barang/update/{id}")
Call<GetReponseSuccess> postBarangUpdate(@Header("Authorization") String Authorization,
                                            @Field("nama_barang") String nama_barang,
                                            @Field("jumlah_barang") String jumlah_barang,
                                            @Field("keterangan") String keterangan,
                                             @Path(value = "id", encoded = true) String id);

@DELETE("barang/delete/{id}")
Call<GetReponseSuccess> postBarangDelete(@Header("Authorization") String Authorization,
                                             @Path(value = "id", encoded = true) String id);

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<GetResponseSuccess>, 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.

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 :

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/action_logout"
        android:title="Logout"
        android:visible="true"
        android:showAsAction="never" />

    <item
        android:id="@+id/action_add"
        android:icon="@drawable/ic_add"
        app:showAsAction="ifRoom"
        android:title="Add"
        android:tint="#fbfff6">
    </item>
</menu>

Untuk asset @drawable/ic_add sendiri, silahkan klik kanan pada bagian drawable dan ikuti petunjuk dibawah ini :

Menambahkan Image Android Studio
Contoh Add Image Drawable 1.1

Lalu isikan seperti dibawah ini (silahkan sesuaikan nama dan gambar yang hendak dipakai sebagai asset) :

Menambahkan Image Android Studio
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 :

package com.soft_gain.myinventory.Barang;

import android.app.ProgressDialog;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.support.v4.app.Fragment;
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 android.widget.Toast;
import com.soft_gain.myinventory.Api.Client;
import com.soft_gain.myinventory.Api.Interface;
import com.soft_gain.myinventory.Model.GetReponseSuccess;
import com.soft_gain.myinventory.R;
import retrofit2.Call;
import retrofit2.Callback;
import retrofit2.Response;

public class BarangFragmentFormAdd extends Fragment {
    ProgressDialog progressDoalog;
    SharedPreferences myPrefs;
    EditText nama_barang,jumlah_barang,keterangan;

    public BarangFragmentFormAdd() {}

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        final View rootView = inflater.inflate(R.layout.fragment_barang_form, container, false);

        nama_barang = (EditText)rootView.findViewById(R.id.nama_barang);
        jumlah_barang = (EditText)rootView.findViewById(R.id.jumlah_barang);
        keterangan = (EditText)rootView.findViewById(R.id.keterangan);

        Button button = (Button) rootView.findViewById(R.id.submit);
        button.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {
                progressDoalog = new ProgressDialog(getActivity());
                progressDoalog.setMessage("Loading....");
                progressDoalog.show();

                myPrefs = getActivity().getSharedPreferences("sg_shared_pref", getActivity().MODE_PRIVATE);
                String token = myPrefs.getString("token", "");

                Interface service = Client.getClient().create(Interface.class);
                Call<GetReponseSuccess> call = service.postBarangStore("Bearer "+token, nama_barang.getText().toString(), jumlah_barang.getText().toString(), keterangan.getText().toString());
                call.enqueue(new Callback<GetReponseSuccess>() {
                    @Override
                    public void onResponse(Call<GetReponseSuccess> call, Response<GetReponseSuccess> response) {
                        if(response.isSuccessful()){
                            progressDoalog.dismiss();
                            Toast.makeText(getActivity(), "Submit data berhasil!", Toast.LENGTH_SHORT).show();

                            BarangFragmentList nextFrag= new BarangFragmentList();
                            getActivity().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(getActivity() ,"Submit data gagal!",Toast.LENGTH_SHORT).show();
                        }
                    }

                    @Override
                    public void onFailure(Call<GetReponseSuccess> call, Throwable t) {
                        /*Log.v("log softgain : ", String.valueOf(t));*/
                        progressDoalog.dismiss();
                        Toast.makeText(getActivity(), "Something went wrong...Please try later!", Toast.LENGTH_SHORT).show();
                    }
                });
            }
        });

        return rootView;
    }
}

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<GetReponseSuccess> 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 :

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

    <TextView
        android:text = "Form Barang"
        android:layout_width="wrap_content"
        android:layout_height = "wrap_content"
        android:id = "@+id/textview"
        android:textSize = "35dp"
        android:layout_alignParentTop = "true"
        android:layout_centerHorizontal = "true" />

    <TextView
        android:text = "Nama Barang"
        android:layout_width="wrap_content"
        android:layout_height = "wrap_content"
        android:id = "@+id/lable_nama_barang"
        android:textSize = "14dp"
        android:layout_below="@+id/textview"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="15dp" />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="10dip"
        android:background="@drawable/rounded_edittext"
        android:layout_below="@+id/lable_nama_barang"
        android:layout_margin="10dp"
        android:layout_marginTop="10dp"
        android:hint="Isi Disini"
        android:textColorHint="@color/cardview_shadow_start_color"
        android:id = "@+id/nama_barang"
        android:layout_centerHorizontal = "true" />

    <TextView
        android:text = "Jumlah Barang"
        android:layout_width="wrap_content"
        android:layout_height = "wrap_content"
        android:id = "@+id/lable_jumlah_barang"
        android:textSize = "14dp"
        android:layout_below="@+id/nama_barang"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="15dp"/>

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="10dip"
        android:background="@drawable/rounded_edittext"
        android:layout_below="@+id/lable_jumlah_barang"
        android:layout_margin="10dp"
        android:layout_marginTop="10dp"
        android:hint="Isi Disini"
        android:textColorHint="@color/cardview_shadow_start_color"
        android:id = "@+id/jumlah_barang"
        android:inputType = "number" />

    <TextView
        android:text = "Keterangan"
        android:layout_width="wrap_content"
        android:layout_height = "wrap_content"
        android:id = "@+id/lable_keterangan"
        android:textSize = "14dp"
        android:layout_below="@+id/jumlah_barang"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="15dp"/>

    <EditText
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:padding="10dip"
        android:background="@drawable/rounded_edittext"
        android:layout_below="@+id/lable_keterangan"
        android:layout_margin="10dp"
        android:layout_marginTop="10dp"
        android:hint="Isi Disini"
        android:textColorHint="@color/cardview_shadow_start_color"
        android:id = "@+id/keterangan"
        android:inputType = "text|textMultiLine" />

    <Button
        android:id="@+id/submit"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/keterangan"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:background="@android:color/holo_red_dark"
        android:text="Submit"
        android:textColor="@android:color/white" />

</RelativeLayout>

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 :

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" android:padding="10dp">
    <solid android:color="#fff"/>
    <stroke android:width="1dip" android:color="@color/cardview_shadow_start_color" />
    <corners
        android:bottomRightRadius="15dp"
        android:bottomLeftRadius="15dp"
        android:topLeftRadius="15dp"
        android:topRightRadius="15dp" />
</shape>

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 :

public void onBindViewHolder(CustomViewHolder holder, int position) { 
       holder.txtTitle.setText(dataList.get(position).getNamaBarang());
        final String idData = String.valueOf(dataList.get(position).getId());
        final String titleData = String.valueOf(dataList.get(position).getNamaBarang());

        holder.edit.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View view) {
                /*Log.v("log softgain : ", String.valueOf(idData));*/
                SharedPreferences sgSharedPref = context.getSharedPreferences("sg_shared_pref", context.MODE_PRIVATE);
                SharedPreferences.Editor editor = sgSharedPref.edit();
                editor.putString("editedIdBarang", idData);
                editor.apply();

                BarangFragmentFormEdit nextFrag= new BarangFragmentFormEdit();
                ((MainActivity)context).getSupportFragmentManager().beginTransaction()
                        .replace(R.id.content_frame, nextFrag, "findThisFragment")
                        .addToBackStack(null)
                        .commit();
            }
        });

        holder.delete.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View view) {
                try{
                    showDialog(String.valueOf(titleData), String.valueOf(idData));
                } catch (Exception e){
                    e.printStackTrace();
                }
                /*Log.v("log softgain : ", String.valueOf(idData));*/
            }
        });
}

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 :

package com.soft_gain.myinventory.Barang;

import android.app.ProgressDialog;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.support.v4.app.Fragment;
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 android.widget.Toast;
import com.soft_gain.myinventory.Api.Client;
import com.soft_gain.myinventory.Api.Interface;
import com.soft_gain.myinventory.Model.Barang.SingleDataBarang;
import com.soft_gain.myinventory.Model.GetReponseSuccess;
import com.soft_gain.myinventory.R;
import retrofit2.Call;
import retrofit2.Callback;
import retrofit2.Response;

public class BarangFragmentFormEdit extends Fragment {
    ProgressDialog progressDoalog;
    SharedPreferences myPrefs;
    EditText nama_barang,jumlah_barang,keterangan;

    public BarangFragmentFormEdit() {}

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        final View rootView = inflater.inflate(R.layout.fragment_barang_form, container, false);

        nama_barang = (EditText)rootView.findViewById(R.id.nama_barang);
        jumlah_barang = (EditText)rootView.findViewById(R.id.jumlah_barang);
        keterangan = (EditText)rootView.findViewById(R.id.keterangan);

        progressDoalog = new ProgressDialog(getActivity());
        progressDoalog.setMessage("Loading....");
        progressDoalog.show();

        myPrefs = getActivity().getSharedPreferences("sg_shared_pref", getActivity().MODE_PRIVATE);
        final String token = myPrefs.getString("token", "");
        final String editedIdBarang = myPrefs.getString("editedIdBarang", "");

        Interface service = Client.getClient().create(Interface.class);
        Call<SingleDataBarang> call = service.postBarangEdit("Bearer "+token, editedIdBarang);
        call.enqueue(new Callback<SingleDataBarang>() {
            @Override
            public void onResponse(Call<SingleDataBarang> call, Response<SingleDataBarang> response) {
                if(response.isSuccessful()){
                    progressDoalog.dismiss();
                    /*Log.v("log softgain : ", String.valueOf(response.body().getSuccess().getData().getNamaBarang()));*/
                    nama_barang.setText(String.valueOf(response.body().getSuccess().getData().getNamaBarang()));
                    jumlah_barang.setText(String.valueOf(response.body().getSuccess().getData().getJumlahBarang()));
                    keterangan.setText(String.valueOf(response.body().getSuccess().getData().getKeterangan()));
                }else{
                    /*Log.v("log softgain : ", String.valueOf(response.errorBody()));*/
                    progressDoalog.dismiss();
                    Toast.makeText(getActivity() ,"Ambil data gagal!",Toast.LENGTH_SHORT).show();
                }
            }

            @Override
            public void onFailure(Call<SingleDataBarang> call, Throwable t) {
                /*Log.v("log softgain : ", String.valueOf(t));*/
                progressDoalog.dismiss();
                Toast.makeText(getActivity(), "Something went wrong...Please try later!", Toast.LENGTH_SHORT).show();
            }
        });

        Button button = (Button) rootView.findViewById(R.id.submit);
        button.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {
                progressDoalog = new ProgressDialog(getActivity());
                progressDoalog.setMessage("Loading....");
                progressDoalog.show();

                Interface service = Client.getClient().create(Interface.class);
                Call<GetReponseSuccess> call = service.postBarangUpdate("Bearer "+token, nama_barang.getText().toString(), jumlah_barang.getText().toString(), keterangan.getText().toString(), editedIdBarang);
                call.enqueue(new Callback<GetReponseSuccess>() {
                    @Override
                    public void onResponse(Call<GetReponseSuccess> call, Response<GetReponseSuccess> response) {
                        if(response.isSuccessful()){
                            progressDoalog.dismiss();
                            Toast.makeText(getActivity(), "Submit data berhasil!", Toast.LENGTH_SHORT).show();

                            BarangFragmentList nextFrag= new BarangFragmentList();
                            getActivity().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(getActivity() ,"Submit data gagal!",Toast.LENGTH_SHORT).show();
                        }
                    }

                    @Override
                    public void onFailure(Call<GetReponseSuccess> call, Throwable t) {
                        /*Log.v("log softgain : ", String.valueOf(t));*/
                        progressDoalog.dismiss();
                        Toast.makeText(getActivity(), "Something went wrong...Please try later!", Toast.LENGTH_SHORT).show();
                    }
                });
            }
        });

        return rootView;
    }
}

Untuk proses pembacaan data, kita akan fokus pada metode onCreateView dibagian Call<SingleDataBarang> 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 :

nama_barang.setText(String.valueOf(response.body().getSuccess().getData().getNamaBarang()));
jumlah_barang.setText(String.valueOf(response.body().getSuccess().getData().getJumlahBarang()));
keterangan.setText(String.valueOf(response.body().getSuccess().getData().getKeterangan()));

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 :

Interface service = Client.getClient().create(Interface.class);
                Call<GetReponseSuccess> call = service.postBarangUpdate("Bearer "+token, nama_barang.getText().toString(), jumlah_barang.getText().toString(), keterangan.getText().toString(), editedIdBarang);
                call.enqueue(new Callback<GetReponseSuccess>() {
                    @Override
                    public void onResponse(Call<GetReponseSuccess> call, Response<GetReponseSuccess> response) {
                        if(response.isSuccessful()){
                            progressDoalog.dismiss();
                            Toast.makeText(getActivity(), "Submit data berhasil!", Toast.LENGTH_SHORT).show();

                            BarangFragmentList nextFrag= new BarangFragmentList();
                            getActivity().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(getActivity() ,"Submit data gagal!",Toast.LENGTH_SHORT).show();
                        }
                    }

                    @Override
                    public void onFailure(Call<GetReponseSuccess> call, Throwable t) {
                        /*Log.v("log softgain : ", String.valueOf(t));*/
                        progressDoalog.dismiss();
                        Toast.makeText(getActivity(), "Something went wrong...Please try later!", Toast.LENGTH_SHORT).show();
                    }
});

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 :

holder.delete.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View view) {
                try{
                    showDialog(String.valueOf(titleData), String.valueOf(idData));
                } catch (Exception e){
                    e.printStackTrace();
                }
                /*Log.v("log softgain : ", String.valueOf(idData));*/
            }
});

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<GetReponseSuccess> call = service.postBarangDelete("Bearer "+token, id);
                call.enqueue(new Callback<GetReponseSuccess>() {
                    @Override
                    public void onResponse(Call<GetReponseSuccess> call, Response<GetReponseSuccess> 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<GetReponseSuccess> 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.

Cara Membuat Android Navigation Drawer, Side Navigasi Menu

Cara Membuat Aplikasi Android

Membuat Android Navigation Drawer – Kali ini kita akan mencoba membuat navigation drawer pada aplikasi berbasis android. Navigation drawer adalah sebuah menu yang biasanya ditempatkan pada sisi kiri layar aplikasi (side menu navigation), hampir setiap aplikasi memiliki komponen ini sebagai navigasi pada tampilan antar muka nya, maka dari itu saya mencoba untuk menjabarkan bagaimana cara membuat android navigation drawer secara sederhana.

Goals – Mampu Membuat Android Navigation Drawer

Tujuan dari pembahasan ini adalah mampu dan pahamnya kita dalam pembuatan navigation browser pada android, kita akan membahasnya langkah demi langkah guna memudahkan kita untuk memahami bagaimana cara kerja dari navigation browser ini. Dan berikut ini adalah contoh hasil dari navigation browser yang kita buat :

Membuat Android Navigation Drawer
Navigation Browser

Materi Pembahasan

Untuk dapat menggunakan navigation drawer, kita akan memanfaatkan widget DrawerLayout sebagai layout utama, cara menggunakannya mudah tinggal kita tambahkan saja widget ini pada layout utama yang kita miliki (dalam case ini, acticity_main.xml adalah layout yang saya gunakan sebagai layout utama). Ubah activity_main menjadi seperti ini :

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <LinearLayout
            android:id="@+id/container_toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <include
                android:id="@+id/toolbar"
                layout="@layout/toolbar" />

        </LinearLayout>

        <FrameLayout
            android:id="@+id/content_frame"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </LinearLayout>

    <ListView
        android:id="@+id/left_drawer"
        android:layout_width="220dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="#ffffff"
        android:choiceMode="singleChoice"
        android:divider="@android:color/darker_gray"
        android:dividerHeight="1dp" />

</android.support.v4.widget.DrawerLayout>

Lalu berikutnya kita akan memanfaatkan Toolbar sebagai wadah untuk menempatkan elemen navigasi atau menu, buatlah sebuah layout dengan nama toolbar.xml, isi dari toolbar.xml seperti :

<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:local="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    local:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    local:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

Dikarenakan menu navigasi yang akan kita buat ditaruh pada komponen listView, maka kita juga perlu membuat layout untuk menampung masing-masing item pada menu navigasi. Buatlah layout list_view_item_row.xml dan isikan code berikut ini :

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?android:attr/activatedBackgroundIndicator"
    android:minHeight="?android:attr/listPreferredItemHeightSmall"
    android:padding="10dp">

    <ImageView
        android:id="@+id/imageViewIcon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:paddingRight="10dp" />

    <TextView
        android:id="@+id/textViewName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@+id/imageViewIcon"
        android:paddingRight="10dp"
        android:text="Item Name"
        android:textColor="@android:color/black"
        android:textAppearance="?android:attr/textAppearanceListItemSmall" />

</RelativeLayout>

Lalu untuk masing-masing nama menu akan kita taruh dalam file values/strings.xml, tambahkan code berikut ini :

<string-array name="navigation_drawer_items_array">
        <item>Barang</item>
        <item>Transaksi</item>
        <item>User</item>
</string-array>

Kita juga akan membuat model untuk men-definisikan masing-masing item pada list navigasi, buatlah sebuah class dengan nama SideMenu dan isikan code berikut ini :

package com.soft_gain.myinventory.Model;

public class SideMenu {
    public int icon;
    public String name;

    public SideMenu(int icon, String name) {
        this.icon = icon;
        this.name = name;
    }
}

Dikarenakan kita menggunakan model, kita juga membutuhkan adapter yang membantu kita mengelola data dari model dan men-presentasikan-nya pada listview. Buatlah sebuah class baru dengan nama SideMenuAdapter, lalu isikan code berikut ini :

package com.soft_gain.myinventory;

import android.app.Activity;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import com.soft_gain.myinventory.Model.SideMenu;

public class SideMenuAdapter extends ArrayAdapter<SideMenu> {
    Context mContext;
    int layoutResourceId;
    SideMenu data[] = null;

    public SideMenuAdapter(Context mContext, int layoutResourceId, SideMenu[] data) {
        super(mContext, layoutResourceId, data);
        this.layoutResourceId = layoutResourceId;
        this.mContext = mContext;
        this.data = data;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View listItem = convertView;

        LayoutInflater inflater = ((Activity) mContext).getLayoutInflater();
        listItem = inflater.inflate(layoutResourceId, parent, false);

        ImageView imageViewIcon = (ImageView) listItem.findViewById(R.id.imageViewIcon);
        TextView textViewName = (TextView) listItem.findViewById(R.id.textViewName);

        SideMenu folder = data[position];


        imageViewIcon.setImageResource(folder.icon);
        textViewName.setText(folder.name);

        return listItem;
    }
}

Berikutnya kita akan melakukan sedikit modifikasi pada MainActivity.java, pertama-tama deklarasi-kan attribute berikut pada class MainActivity :

private String[] mNavigationDrawerItemTitles;
private DrawerLayout mDrawerLayout;
private ListView mDrawerList;
Toolbar toolbar;
private CharSequence mDrawerTitle;
private CharSequence mTitle;
android.support.v7.app.ActionBarDrawerToggle mDrawerToggle;

Berikutnya lakukan modifikasi pada bagian onCreate :

protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mTitle = mDrawerTitle = getTitle();
        mNavigationDrawerItemTitles= getResources().getStringArray(R.array.navigation_drawer_items_array);
        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        mDrawerList = (ListView) findViewById(R.id.left_drawer);

        setupToolbar();

        DataModel[] drawerItem = new DataModel[3];

        drawerItem[0] = new DataModel(R.drawable.connect, "Barang");
        drawerItem[1] = new DataModel(R.drawable.fixtures, "Transaksi");
        drawerItem[2] = new DataModel(R.drawable.table, "User");
        getSupportActionBar().setDisplayHomeAsUpEnabled(false);
        getSupportActionBar().setHomeButtonEnabled(true);

        DrawerItemCustomAdapter adapter = new DrawerItemCustomAdapter(this, R.layout.list_view_item_row, drawerItem);
        mDrawerList.setAdapter(adapter);
        mDrawerList.setOnItemClickListener(new DrawerItemClickListener());
        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
        mDrawerLayout.setDrawerListener(mDrawerToggle);
        setupDrawerToggle();
}

Lalu tambahkan juga metode-metode berikut ini pada class MainActivity :

    private class DrawerItemClickListener implements ListView.OnItemClickListener {

        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
            selectItem(position);
        }

    }

    private void selectItem(int position) {

        switch (position) {
            case 0:
                Toast.makeText(getApplicationContext() ,"Barang  diclick",Toast.LENGTH_SHORT).show();
                break;
            case 1:
                Toast.makeText(getApplicationContext() ,"Transaksi diclick",Toast.LENGTH_SHORT).show();
                break;
            case 2:
                Toast.makeText(getApplicationContext() ,"User diclick",Toast.LENGTH_SHORT).show();
                break;

            default:
                break;
        }
    }    

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {

        if (mDrawerToggle.onOptionsItemSelected(item)) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }

    @Override
    public void setTitle(CharSequence title) {
        mTitle = title;
        getSupportActionBar().setTitle(mTitle);
    }

    @Override
    protected void onPostCreate(Bundle savedInstanceState) {
        super.onPostCreate(savedInstanceState);
        mDrawerToggle.syncState();
    }

    void setupToolbar(){
        toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        getSupportActionBar().setDisplayShowHomeEnabled(true);
    }

    void setupDrawerToggle(){
        mDrawerToggle = new android.support.v7.app.ActionBarDrawerToggle(this,mDrawerLayout,toolbar,R.string.app_name, R.string.app_name);
        mDrawerToggle.syncState();
    }

Bagian yang menurut saya paling penting adalah pada metode selectItem, dimana didalamnya terdapat switch statement yang kita gunakan untuk men-execute event berdasarkan menu navigasi mana yang user pilih, untuk contoh diatas kita hanya akan menampilkan informasi berupa popup menggunakan Toast, ke depannya bisa di-kombinasi-kan dengan pemanggilan sebuah activity baru atau pun fragment yang mengantarkan user pada tampilan interface yang berbeda (contoh menggunakan fragment bisa dilihat disini : https://soft-gain.com/2020/06/23/contoh-sederhana-recyclerview-cardview-dengan-implementasi-retrofit/).

Penutup

Demikianlah contoh pembuatan navigation browser pada aplikasi berbasis android, menurut saya konsep pembuatan navigasi seperti ini cukup penting untuk dapat dikuasai dan dipahami mengingat pentingnya komponen ini untuk pengembangan sebuah asplikasi, seperti biasa silahkan ambil source utuhnya pada repo saya (https://github.com/ImmanuelJL/myinventory.git), terima kasih.

Contoh Sederhana Recyclerview CardView, Dengan Implementasi Retrofit

Cara Membuat Aplikasi Android

Contoh Sederhana Recyclerview Retrofit – Untuk tutorial android kali ini, kita akan mencoba mengimplementasikan contoh sederhana menampilkan data dengan recyclerview dan menggunakan retrofit sebagai REST client HTTP. Setelah sebelumnya kita telah berhasil membuat fungsi untuk login dan logout user (https://soft-gain.com/2020/06/19/cara-membuat-aplikasi-android-rest-api-menggunakan-retrofit/), sekarang kita akan coba menampilkan data pada Recyclerview dengan memanfaatkan retrofit sebagai REST client HTTP. Tanpa berlama-lama lagi langsung saja kita masuk pada pembahasan Contoh Sederhana Recyclerview CardView.

Recyclerview sendiri sebenarnya adalah sebuah dependencies yang digunakan untuk menampilkan data dalam bentuk list, biasanya dikombinasikan dengan cardview sebagai pembungkus atau frame layout masing-masing data. Dikarenakan kita akan menggunakan dua
dependencies ini, silahkan tambahkan dua library ini pada file build.gradle :

implementation 'com.android.support:recyclerview-v7:27.1.1'
implementation 'com.android.support:cardview-v7:27.1.1'

Berikutnya kita akan membuat model, untuk pembuatan model saya menggunakan website ini (http://www.jsonschema2pojo.org/) yang membantu saya memudahkan untuk men-convert hasil json string saya ke dalam java class, caranya sangat mudah tinggal paste-kan saja string json kita kedalam text area sebelah kiri lalu tekan preview, kurang lebih seperti ini :

Contoh Sederhana Recyclerview CardView
Masukan json string
Contoh Sederhana Recyclerview CardView
Hasil dalam bentuk class

Kita tinggal copy paste saja hasil preview diatas ke dalam class java kita, atau bisa jika klik tombol zip untuk download java class kita dalam dalam bentuk file.

Berikutnya buatlah 4 buah model seperti gambar dibawah ini (yang mana hasil java class dari website jsonschema2pojo akan kita taruh dalam model ini) :

Contoh Sederhana Recyclerview CardView
Model Barang

Pertama didalam model barang kita memiliki fungsi getSuccess yang yang akan kita gunakan untuk mengambil object success dari json response yang kita terima :

package com.soft_gain.myinventory.Model.Barang;

import com.google.gson.annotations.Expose;
import com.google.gson.annotations.SerializedName;

public class Barang {
    @SerializedName("success")
    @Expose
    private Success success;

    public Success getSuccess() {
        return success;
    }

    public void setSuccess(Success success) {
        this.success = success;
    }
}

Lalu didalam model success, kita memiliki fungsi getData yang kita gunakan untuk mengambil object data dalam bentuk list :

package com.soft_gain.myinventory.Model.Barang;

import java.util.List;
import com.google.gson.annotations.Expose;
import com.google.gson.annotations.SerializedName;

public class Success {
    @SerializedName("data")
    @Expose
    private List<Datum> data = null;

    public List<Datum> getData() {
        return data;
    }

    public void setData(List<Datum> data) {
        this.data = data;
    }
}

Lalu didalam model datum atau model data, kita men-serialisasi-kan satu persatu attribute kedalam object java :

package com.soft_gain.myinventory.Model.Barang;

import com.google.gson.annotations.Expose;
import com.google.gson.annotations.SerializedName;

public class Datum {
    @SerializedName("id")
    @Expose
    private String id;
    @SerializedName("nama_barang")
    @Expose
    private String namaBarang;
    @SerializedName("jumlah_barang")
    @Expose
    private Integer jumlahBarang;
    @SerializedName("keterangan")
    @Expose
    private Object keterangan;
    @SerializedName("created_at")
    @Expose
    private String createdAt;
    @SerializedName("updated_at")
    @Expose
    private String updatedAt;
    @SerializedName("updated_by")
    @Expose
    private Integer updatedBy;
    @SerializedName("get_updated_by")
    @Expose
    private GetUpdatedBy getUpdatedBy;

    public String getId() {
        return id;
    }

    public void setId(String id) {
        this.id = id;
    }

    public String getNamaBarang() {
        return namaBarang;
    }

    public void setNamaBarang(String namaBarang) {
        this.namaBarang = namaBarang;
    }

    public Integer getJumlahBarang() {
        return jumlahBarang;
    }

    public void setJumlahBarang(Integer jumlahBarang) {
        this.jumlahBarang = jumlahBarang;
    }

    public Object getKeterangan() {
        return keterangan;
    }

    public void setKeterangan(Object keterangan) {
        this.keterangan = keterangan;
    }

    public String getCreatedAt() {
        return createdAt;
    }

    public void setCreatedAt(String createdAt) {
        this.createdAt = createdAt;
    }

    public String getUpdatedAt() {
        return updatedAt;
    }

    public void setUpdatedAt(String updatedAt) {
        this.updatedAt = updatedAt;
    }

    public Integer getUpdatedBy() {
        return updatedBy;
    }

    public void setUpdatedBy(Integer updatedBy) {
        this.updatedBy = updatedBy;
    }

    public GetUpdatedBy getGetUpdatedBy() {
        return getUpdatedBy;
    }

    public void setGetUpdatedBy(GetUpdatedBy getUpdatedBy) {
        this.getUpdatedBy = getUpdatedBy;
    }
}

Untuk model getUpdatedBy sementara ini tidak dipakai jadi kita skip saja. Berikutnya buka file Interface.java dan tambahkan code berikut ini sebagai end point api kita :

@POST("barang")
Call<Barang> postBarang(@Header("Authorization") String Authorization);

Perlu diperhatikan diatas, dimana kita memanggil model barang.java pada end point postBarang (dibagian ini : Call<Barang>), end point postBarang ini lah yang akan kita panggil pada bagian antar muka nantinya. Berikutnya kita akan menambahkan file BarangAdapter yang akan kita gunakan untuk data binding dengan RecyclerView :

package com.soft_gain.myinventory.Barang;

import android.content.Context;
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.TextView;
import com.soft_gain.myinventory.Barang.BarangFragmentList;
import com.soft_gain.myinventory.Model.Barang.Datum;
import com.soft_gain.myinventory.R;

import java.util.List;

public class BarangAdapter extends RecyclerView.Adapter<BarangAdapter.CustomViewHolder>{
    private List<Datum> dataList;
    private Context context;

    public BarangAdapter(List<Datum> dataList){
        this.dataList = dataList;
    }

    public BarangAdapter(BarangFragmentList connectFragment, List<Datum> dataList) {}

    class CustomViewHolder extends RecyclerView.ViewHolder {
        public final View mView;
        TextView txtTitle;

        CustomViewHolder(View itemView) {
            super(itemView);
            mView = itemView;

            txtTitle = mView.findViewById(R.id.title);
        }
    }

    @Override
    public CustomViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        LayoutInflater layoutInflater = LayoutInflater.from(parent.getContext());
        View view = layoutInflater.inflate(R.layout.adapter, parent, false);
        return new CustomViewHolder(view);
    }

    @Override
    public void onBindViewHolder(CustomViewHolder holder, int position) {
        holder.txtTitle.setText(dataList.get(position).getNamaBarang());
    }

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

Perlu diperhatikan pada BarangAdapter diatas, dimana kita memanggil model Datum atau model data sebagai list yang mana model inilah yang akan kita inisiasi-kan kedalam recyclerview nantinya. Lalu berikutnya kita akan membuat fragment sebagai implementasi antar muka yang akan kita gunakan untuk menampilkan list data pada user. Tambahkan file BarangFragmentList.java dan isinya kurang lebih seperti ini :

package com.soft_gain.myinventory.Barang;

import android.app.ProgressDialog;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.support.v4.app.Fragment;
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.Toast;
import com.soft_gain.myinventory.Api.Client;
import com.soft_gain.myinventory.Api.Interface;
import com.soft_gain.myinventory.Barang.BarangAdapter;
import com.soft_gain.myinventory.Model.Barang.Barang;
import com.soft_gain.myinventory.R;
import retrofit2.Call;
import retrofit2.Callback;
import retrofit2.Response;

public class BarangFragmentList extends Fragment {
    ProgressDialog progressDoalog;
    SharedPreferences myPrefs;

    public BarangFragmentList() {}

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        final View rootView = inflater.inflate(R.layout.fragment_barang_list, container, false);
        RecyclerView recyclerView = (RecyclerView) rootView.findViewById(R.id.recyclerView);
        recyclerView.setLayoutManager(new LinearLayoutManager(getActivity()));

        progressDoalog = new ProgressDialog(getActivity());
        progressDoalog.setMessage("Loading....");
        progressDoalog.show();

        myPrefs = getActivity().getSharedPreferences("sg_shared_pref", getActivity().MODE_PRIVATE);
        String token = myPrefs.getString("token", "");

        Interface service = Client.getClient().create(Interface.class);
        Call<Barang> call = service.postBarang("Bearer "+token);
        call.enqueue(new Callback<Barang>() {
            @Override
            public void onResponse(Call<Barang> call, Response<Barang> response) {
                /*Log.v("log softgain : ", String.valueOf(response.body().getSuccess().getData().get(0).getNamaBarang()));*/
                progressDoalog.dismiss();
                RecyclerView recyclerView = (RecyclerView) rootView.findViewById(R.id.recyclerView);
                recyclerView.setLayoutManager(new LinearLayoutManager(getActivity()));
                BarangAdapter mAdapter = new BarangAdapter(response.body().getSuccess().getData());
                recyclerView.setAdapter(mAdapter);
                recyclerView.setItemAnimator(new DefaultItemAnimator());
            }

            @Override
            public void onFailure(Call<Barang> call, Throwable t) {
                /*Log.v("log softgain : ", String.valueOf(t));*/
                progressDoalog.dismiss();
                Toast.makeText(getActivity(), "Something went wrong...Please try later!", Toast.LENGTH_SHORT).show();
            }
        });

        return rootView;
    }
}

Perhatikan pada fragment diatas, dimana kita memanggil end point postBarang yang sudah kita buat sebelumnya, perlu diperhatikan juga dimana model yang kita jadikan acuan untuk inisiasi data adalah model barang (model ini harus disesuaikan dengan model yang kita deklarasikan pada end point di interface). Barulah pada bagian onResponse, kita men-inisiasi-kan getData (pada bagian ini : BarangAdapter mAdapter = new BarangAdapter(response.body().getSuccess().getData())) kedalam barangAdapter (yang mana sudah kita sesuaikan dalam BarangAdapter.java yang juga didalamnya kita inisiasi-kan model Datum atau model data), sehingga attribute yang ada dalam model datum atau model data dapat kita inisiasi-kan kedalam recyclerview. Lalu berikutnya tambahkan class BarangFragmentList pada MainActivity.java dibagian method selectItem (disini kita menggunakan side navigation menu yang akan kita bahas pada artikel berbeda). Berikutnya tambahkan layout fragment_barang_list.xml, di file ini kita akan menggunakan RecyclerView :

<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"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"  />

</RelativeLayout>

Terakhir kita akan tambahkan layout adapter.xml, yang mana pada file inilah kita akan menggunakan CardView :

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/card_view_friend"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    card_view:cardUseCompatPadding="true" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/title"
            style="@style/TextAppearance.AppCompat.Medium"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="16dp"
            android:paddingTop="20dp"
            android:lines="2"
            android:text="title" />

    </RelativeLayout>

</android.support.v7.widget.CardView>

Berikut ini adalah contoh hasil dari apa yang sudah kita buat diatas :

Contoh Sederhana Recyclerview CardView
Contoh Recyclerview CardView

Demikian contoh sederhana dari implementasi recyclerview dan cardview menggunakan retrofit sebagai REST client HTTP, untuk full source-nya bisa diambil di repo saya (https://github.com/ImmanuelJL/myinventory.git), terima kasih.

Tutorial Splash Screen Android, Layar Pembuka Aplikasi Android

Cara Membuat Aplikasi Android

Pada kali ini kita akan membahas tentang bagaimana membuat splash screen pada aplikasi android, artikel ini adalah kelanjutan dari (https://soft-gain.com/2020/06/19/cara-membuat-aplikasi-android-rest-api-menggunakan-retrofit/). Splash screen itu sendiri adalah sebuah tampilan atau interface yang menjadi layar pembuka saat kita pertama kali menjalankan aplikasi android, biasanya pada layar disertakan nama aplikasi, logo dan warna dominan yang menjadi ciri khas dari aplikasi tersebut. Tanpa berbasa-basi lagi, langsung saja kita masuk pada pembahasan tutorial splash screen android.

Pertama, kita akan membuat sebuah layout baru dengan nama activity_splash.xml, layout ini lah yang akan menjadi tampilan antar muka yang di lihat oleh user. Isinya kurang lebih seperti ini :

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimaryDark"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="My Inventory"
        android:textColor="#fff"
        android:textSize="40sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

Pada interface di atas, kita hanya akan menampilkan nama dari aplikasi ini saja, silahkan dikembangkan sesuai kebutuhan apakah hendak menggunakan gambar dan lain sebagainya.

Berikutnya kita akan membuat satu activiy baru yaitu SplashActivity.java, dalam activity ini kita hanya memanggil layout activity_splash lalu kita memberikan jeda kira-kira 3 detik dan langsung membuka activity baru yaitu MainActivity.java. Isi dari SplashActivity seperti ini :

package com.soft_gain.myinventory;

import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.support.v7.app.AppCompatActivity;

public class SplashActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_splash);
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                Intent home = new Intent(SplashActivity.this, MainActivity.class);
                startActivity(home);
                finish();
            }
        },3000);
    }
}

Terakhir kita akan merubah sedikit file AndroidManifest.xmlm di dalamnya kita akan melakukan sedikit konfigurasi untuk menentukan SplashActivity lah yang akan kita jalankan terlebih dahulu saat aplikasi dijalankan. Tambahkan baris kode ini pada tag aplication :

<activity android:name=".SplashActivity" android:theme="@style/Theme.AppCompat.NoActionBar">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
</activity>

Selanjutnya kita tinggal coba menjalankan aplikasi pada emulator atau pada perangkat hp kita secara langsung. Seperti ini lah kurang lebih hasil dari splash screen yang sudah kita buat :

Tutorial Splash Screen Android
Splash Screen

Demikian lah tutorial membuat splash screen pada aplikasi android, menurut saya hal ini relatif mudah dan silahkan dimodifikasi atau di sesuaikan tampilan dari halaman splash-nya dengan aplikasi android yang sedang anda kembangkan.

Menurut saya secara pribadi, splash screen ini adalah salah satu elemen penting untuk menunjukan value atau nilai dari brand yang sedang coba kita kembangkan, karena splash screen ini menentukan first impression user saat pertama kali membuka aplikasi yang kita buat, saya sendiri suka menghabiskan banyak waktu hanya untuk geser-geser logo ganti warna sampai saya merasa telah menentukan formula yang tepat untuk tampilan dari splash screen saya (splash screen pada tutorial kali ini sederhana karena hanya contoh saja). Pepatah berkata jangan melihat buku dari cover-nya, tapi kenyataannya banyak orang yang menilai sesuatu dari penampilannya terlebih dahulu, barulah tertarik untuk melihat isinya. Untuk full source nya bisa di ambil di sini (https://github.com/ImmanuelJL/myinventory.git), terima kasih.

Cara Membuat Aplikasi Android, REST API menggunakan Retrofit

Cara Membuat Aplikasi Android

Cara Membuat Aplikasi Android – Melanjutkan artikel sebelumnya dimana kita sudah membuat web service atau api menggunakan framework laravel (https://soft-gain.com/2020/06/13/tutorial-laravel-membuat-aplikasi-web-service/), maka kali ini kita akan mencoba membahas cara membuat aplikasi berbasis android dengan maksud meng-implementasikan web service yang sudah dibuat sebelumnya. Sebelum masuk pada pembahasan, jika ingin membaca mengenai dasar pembuatan aplikasi berbasis android bisa di temukan pada artikel ini (https://soft-gain.com/2020/06/15/cara-membuat-aplikasi-android-hello-world-android-studio/).

Tujuan – Mampu Membuat Aplikasi Android Yang Terintegrasi Dengan Web Service

Artikel ini dibuat dengan harapan kita mampu membuat aplikasi berbasis android dan meng-integrasi-kan nya dengan sebuah web service, pembahasan pada tutorial ini akan dibagi menjadi beberapa artikel yang meliputi dasar-dasar dari pemrograman aplikasi android yang bersifat umum seperti membuat list data, membuat form berserta dengan metode olah datanya (CRUD), pengetahuan dasar tentang activity, fragment, manifest, gradle dan lain-lain.

Materi Pembahasan

Untuk membuat aplikasi kita dapat menggunakan web service yang sudah dibuat sebelumnya, kita perlu meng-install library bernama retrofit (https://square.github.io/retrofit/), retrofit sendiri adalah sebuah REST client HTTP untuk java atau android yang digunakan untuk membuat HTTP request dan memproses HTTP response dari web service sehingga dapat di gunakan pada aplikasi berbasis android. Untuk meng-install library ini pada aplikasi kita, buka file build.gradle dan tambahkan code di bawah ini pada bagian dependencies :

implementation 'com.google.code.gson:gson:2.6.2'
implementation 'com.squareup.retrofit2:converter-gson:2.0.2'
implementation 'com.squareup.retrofit2:retrofit:2.0.2'

Setelah ditambahkan jangan lupa untuk menekan tombol sync now dan pastikan anda terhubung dengan internet.

Selain retrofit, kita juga meng-install gson, gson sendiri adalah library buatan Google yang di gunakan untuk meng-konvert json menjadi java object atau pun sebaliknya.

Selanjutnya kita akan menambahkan package baru dengan nama Api, di dalamnya kita akan membuat dua file, client.java dan interface.java. Kurang lebih seperti ini tampilan dari struktur direktori nya :

Cara Membuat Aplikasi Android

Class client.java berisi koneksi antara client dengan server, di dalam file ini juga kita akan mendeklarasikan end point api kita, kita akan men-deklarasikannya dalam atribut BASE_URL, silahkan diganti dan di sesuaikan dengan end point api masing-masing (dalam case saya end point yang saya pakai adalah http://192.168.43.12:8080/belajar-laravel/public/api/, dimana 192.168.43.12 adalah ip local pc saya), isi dari client.java seperti ini :

package com.soft_gain.myinventory.Api;

import retrofit2.Retrofit;
import retrofit2.converter.gson.GsonConverterFactory;

public class Client {
    public static final String BASE_URL = "http://end-point-api-anda/";
    private static Retrofit retrofit = null;
    public static Retrofit getClient() {
        if (retrofit==null) {
            retrofit = new Retrofit.Builder()
                    .baseUrl(BASE_URL)
                    .addConverterFactory(GsonConverterFactory.create())
                    .build();
        }
        return retrofit;
    }
}

Class interface.java sendiri berisi metode yang akan di gunakan untuk melakukan pertukaran data antara client dan server, isi dari interface.java kurang lebih seperti ini :

package com.soft_gain.myinventory.Api;

import retrofit2.Call;
import retrofit2.http.Field;
import retrofit2.http.FormUrlEncoded;
import retrofit2.http.GET;
import retrofit2.http.HTTP;
import retrofit2.http.POST;
import retrofit2.http.PUT;

import com.soft_gain.myinventory.Model.Auth.Login;

public interface Interface {
    @FormUrlEncoded
    @POST("login")
    Call<Login> postLogin(@Field("email") String email,
                           @Field("password") String password);
}

Berikutnya kita akan membuat model, pertama buatlah package baru dengan nama Model, lalu buat lagi package baru di dalam Model dengan nama Auth, lalu di dalam package Auth tambahkan dua file Login.java dan Token.java, kurang lebih seperti ini strukturnya :

Cara Membuat Aplikasi Android

Isi dari Login.java seperti ini :

package com.soft_gain.myinventory.Model.Auth;

import com.google.gson.annotations.Expose;
import com.google.gson.annotations.SerializedName;

public class Login {
    @SerializedName("success")
    @Expose
    private Token success;

    public Token getSuccess() {
        return success;
    }
}

Dan Token.java seperti ini :

package com.soft_gain.myinventory.Model.Auth;

import com.google.gson.annotations.Expose;
import com.google.gson.annotations.SerializedName;

public class Token {
    @SerializedName("token")
    @Expose
    private String token;

    public String getToken() {
        return token;
    }
}

Berikutnya kita akan menambahkan LoginActivity.java, class ini berfungsi untuk menghandle otentikasi user yang akan kita implementasikan pada aplikasi kita, isinya kurang lebih seperti ini :

package com.soft_gain.myinventory;

import android.app.Activity;
import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;

import com.soft_gain.myinventory.Model.Auth.Login;
import com.soft_gain.myinventory.Api.Client;
import com.soft_gain.myinventory.Api.Interface;

import retrofit2.Call;
import retrofit2.Callback;
import retrofit2.Response;

public class LoginActivity extends Activity {
    Button b1,b2;
    EditText ed1,ed2;
    Interface mApiInterface;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_login);

        b1 = (Button)findViewById(R.id.button);
        b2 = (Button)findViewById(R.id.button2);
        ed1 = (EditText)findViewById(R.id.editText);
        ed2 = (EditText)findViewById(R.id.editText2);

        mApiInterface = Client.getClient().create(Interface.class);

        b1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Call<Login> postLoginExe = mApiInterface.postLogin(ed1.getText().toString(), ed2.getText().toString());
                postLoginExe.enqueue(new Callback<Login>() {
                    @Override
                    public void onResponse(Call<Login> call, Response<Login> response) {
                        if(response.isSuccessful()){
                            /*Log.v("log softgain : ", String.valueOf(response.body().getSuccess().getToken()));*/
                            Toast.makeText(getApplicationContext(),
                                    "Login berhasil",Toast.LENGTH_SHORT).show();

                            SharedPreferences sgSharedPref = getApplicationContext().getSharedPreferences("sg_shared_pref", getApplicationContext().MODE_PRIVATE);
                            SharedPreferences.Editor editor = sgSharedPref.edit();
                            String token = String.valueOf(response.body().getSuccess().getToken());
                            editor.putString("token", token);
                            editor.apply();

                            startActivity(new Intent(LoginActivity.this, MainActivity.class));
                        }else{
                            Toast.makeText(getApplicationContext() ,"Login gagal",Toast.LENGTH_SHORT).show();
                        }
                    }

                    @Override
                    public void onFailure(Call<Login> call, Throwable t) {
                        /*Log.v("log softgain : ", String.valueOf(t));*/
                        Toast.makeText(getApplicationContext(), "Error", Toast.LENGTH_LONG).show();
                    }
                });
            }
        });

        b2.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });
    }
}

Perhatikan di atas, kita menambahkan sebuah on click event pada button login atau yang saya deklarasikan sebagai b1, yang mana didalamnya kita memanggil api interface yang sudah kita buat sebelumnya. Kita akan mencoba meng-handle response yang kita terima melalui method onResponse, di dalam onResponse kita memiliki if statement response.isSuccessful() yang kita gunakan untuk do event berikutnya bila proses otentikasi user berhasil. Perlu di perhatikan jika proses otentikasi user berhasil maka kita akan menyimpan token yang kita peroleh dari response server ke dalam shared preferences, penyimpanan informasi token ke shared preferences ada pada bagian ini :

SharedPreferences sgSharedPref = getApplicationContext().getSharedPreferences("sg_shared_pref", getApplicationContext().MODE_PRIVATE);
                            SharedPreferences.Editor editor = sgSharedPref.edit();
                            String token = String.valueOf(response.body().getSuccess().getToken());
                            editor.putString("token", token);
                            editor.apply();

Untuk detail mengenai shared preferences akan di bahas pada artikel yang berbeda.

Lalu kita juga akan membuka activity baru yaitu MainActivity, proses untuk membuka activity baru ada pada bagian ini :

startActivity(new Intent(LoginActivity.this, MainActivity.class));

Berikutnya kita tambahkan layout baru yaitu activity_login.xml, ini adalah tampilan yang akan di lihat oleh user sebagai halaman login, isi nya kurang lebih seperti ini :

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

<TextView android:text = "Login" android:layout_width="wrap_content"
android:layout_height = "wrap_content"
android:id = "@+id/textview"
android:textSize = "35dp"
android:layout_alignParentTop = "true"
android:layout_centerHorizontal = "true" />

<TextView android:text = "@string/app_name" android:layout_width="wrap_content"
android:layout_height = "wrap_content"
android:id = "@+id/textview2"
android:textSize = "35dp"
android:layout_below="@+id/textview"
android:layout_centerHorizontal = "true" />

<EditText
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:id = "@+id/editText"
android:hint = "Email"
android:focusable = "true"
android:textColorHighlight = "#ff7eff15"
android:textColorHint = "#ff2937"
android:layout_alignParentLeft = "true"
android:layout_alignParentStart = "true"
android:layout_alignParentRight = "true"
android:layout_alignParentEnd = "true"
android:layout_centerInParent="true" />

<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="textPassword"
android:ems="10"
android:id="@+id/editText2"
android:layout_below="@+id/editText"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignRight="@+id/editText"
android:layout_alignEnd="@+id/editText"
android:textColorHint="#ff2937"
android:hint="Password" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="login"
android:id="@+id/button"
android:layout_alignParentBottom="true"
android:layout_toLeftOf="@+id/textview"
android:layout_toStartOf="@+id/textview"
style="@style/Widget.AppCompat.Button.Colored"/>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cancel"
android:id="@+id/button2"
android:layout_alignParentBottom="true"
android:layout_toRightOf="@+id/textview"
android:layout_toEndOf="@+id/textview"
style="@style/Widget.AppCompat.Button.Colored"/>

</RelativeLayout>

Selanjutnya kita juga akan melakukan sedikit modifikasi pada MainActivity.java, kurang lebih jadi seperti ini :

package com.soft_gain.myinventory;

import android.annotation.SuppressLint;
import android.content.Intent;
import android.content.SharedPreferences;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
SharedPreferences sharedPrefs = getSharedPreferences("sg_shared_pref", MODE_PRIVATE);
SharedPreferences.Editor ed;
if(!sharedPrefs.contains("token")){
startActivity(new Intent(MainActivity.this, LoginActivity.class));
}

super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}

@SuppressLint("ResourceType")
@Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.layout.top_menu, menu);
return super.onCreateOptionsMenu(menu);
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
if (id == R.id.action_logout) {
logout();
return true;
}
return super.onOptionsItemSelected(item);
}

private void logout() {
SharedPreferences sgSharedPref = getApplicationContext().getSharedPreferences("sg_shared_pref", getApplicationContext().MODE_PRIVATE);
sgSharedPref.edit().clear().commit();

startActivity(new Intent(MainActivity.this, LoginActivity.class));
}
}

Perhatikan di atas, dimana kita menambahkan method baru yaitu logout, yang berisikan penghapusan shared preferences berisi informasi token dan pemindahan user kembali ke activity LoginActivity, on click event dari method logout ini sendiri kita trigger melalui interface pada top menu yang di presentasikan melalui top_menu.xml (detail pembuatannya akan dibahas pada artikel yang berbeda). Pada bagian onCreate juga kita menambahkan if statement (pengecekan token pada shared preferences) untuk memastikan hanya user yang memiliki token saja yang bisa mengakses MainActivity.

Penutup

Demikian lah pembahasan kali ini, untuk full source nya bisa di ambil di repo saya (https://github.com/ImmanuelJL/myinventory.git), terima kasih.

Update :

Part 2 : https://soft-gain.com/2020/06/23/contoh-sederhana-recyclerview-cardview-dengan-implementasi-retrofit/

Part 3 : https://soft-gain.com/2020/06/28/aplikasi-crud-android-database-mysql-menggunakan-retrofit-dan-laravel/

Cara Membuat Aplikasi Android, Hello World Android Studio

Cara Membuat Aplikasi Android

Pada kesempatan kali ini saya hendak mencoba membagikan pengalaman saya membuat aplikasi android hello world menggunakan android studio, android studio bisa di download secara gratis di sini (https://developer.android.com/studio). Sebenarnya untuk membuat aplikasi berbasis android tidak lah harus menggunakan android studio, hanya saja android studio di rekomendasikan karena mendapat support penuh dari Google selaku pengembang dari OS berbasis android. Seperti awal dari semua pembuatan aplikasi, kita akan memulainya dengan membuat aplikasi hello world. Tanpa perlu berbasa-basi lagi langsung saja kita masuk pada pembahasan, pembuatan aplikasi android hello world menggunakan android studio.

Kita buka android studio nya, lalu pilih sesuai gambar di bawah ini untuk membuat project baru :

Hello World Android Studio

Di halaman berikutnya, kita di minta untuk mengisikan nama aplikasi, domain company dan dimana aplikasi project ingin kita tempatkan. Seperti gambar di bawah ini :

Hello World Android Studio

Selanjutnya kita akan memilih pada perangkat apa dan minimum versi OS berapa aplikasi yang hendak kita buat bisa berjalan. Seperti gambar ini :

Hello World Android Studio

Lalu berikutnya kita akan di tampilkan beberapa activity default yang bisa kita jadikan dasar pengembangan aplikasi kita, untuk saat ini kita pilih saja empty activity, seperti gambar di bawah ini :

Cara Membuat Aplikasi Android

Berikutnya kita akan di minta mengisikan nama pada activity dan layout utama pada aplikasi kita, seperti gambar di bawah ini :

Cara Membuat Aplikasi Android

Lalu tinggal klik finish, jika sudah selesai seperti ini lah tampilan dari source project yang baru kita buat :

Cara Membuat Aplikasi Android

Jika kita lihat gambar di atas, di sebelah kiri kita memiliki struktur folder yang akan kita gunakan jika mengembangkan aplikasi menggunakan android studio. Pertama kita memiliki folder manifest, di dalamnya terdapat file AndroidManifest.xml, file ini berisi komponen dasar dari aplikasi kita, seperti activity, services dan user permission, jangan lupa juga jika kita hendak menambahkan activity baru untuk di deklarasikan di dalam file ini.

Berikutnya ada folder java, di dalamnya berisi file-file ber-ekstensikan .java, folder ini berisi class-class yang di tulis dengan bahasa pemrograman java, biasanya file ini berisi activity, fragment, model, class helper kita dalam membuat aplikasi dan lain-lain, intinya di folder inilah kita akan menaruh semua source code kita nantinya.

Berikutnya ada folder res, folder res sendiri di bagi lagi menjadi 4 bagian yaitu drawable, layout, mipmap, dan values. Folder drawable sendiri berisikan asset berupa gambar yang hendak kita gunakan pada aplikasi, folder layout merupakan tempat di mana kita manruh source untuk membuat interface atau tampilan yang akan di lihat oleh user, folder mipmap biasanya di gunakan untuk menyimpan file atau icon launcher pada aplikasi, folder values berisikan file-file untuk menampung interface value yang bisa kita gunakan secara global pada aplikasi.

Terakhir ada gradle, yang berisikan informasi versi OS, SDK dan library apa saja yang kita gunakan dalam aplikasi, file ini jugalah yang menjadi build tool untuk menjalankan aplikasi kita pada andriod studio.

Terakhir kita akan coba jalankan aplikasi, untuk menjalankan aplikasi ada dua pilihan yaitu menggunakan emulator atau menggunakan perangkat asli, saya sendiri belum pernah menggunakan emulator karena membutuhkan ram dalam jumlah yang cukup besar, dan juga dengan pertimbangan testing aplikasi pada perangkat asli memiliki tingkat keakuratan QC yang lebih baik.

Saya sendiri menggunakan hp xiaomi redmi 3s untuk proses debug dan test aplikasi, pada hp xiaomi silahkan masuk ke setting -> about phone lalu ketuk miui version sampai keluar pop up “you are now a developer”. Berikutnya buka setting -> additional setting -> developer options enable kan usb debugging pada pengaturan ini. Selanjutnya sambung kan hp dengan PC menggunakan kabel usb, lalu klik run pada andriod studio, maka akan di munculkan beberapa pilihan debugging tools yang ter-install pada pc kita :

Cara Membuat Aplikasi Android

Jika sudah tampil maka tinggal klik ok saja dan tunggu proses installasi pada hp, perlu menjadi catatan mungkin terdapat perbedaan cara menghubungkan perangkat hp dengan andriod studio untuk dapat terbaca sebagai debugging tools. Demikianlah pembahasan pada kali ini, terima kasih.