Menampilkan Banyak Data Mysql Ke Aplikasi Android Dengan Volley Dan Recyclerview

Oleh Pojok Guru

Selasa, 21 Februari 2017

Bagikan :

Tweet

Hai sobat blog setya aji, kembali lagi dengan aku di tutorial android. Pada tutorial sebelumnya yang berjudul Menampilkan Data dari Database MySQL ke Aplikasi Android dengan Volley, aku telah jelaskan bagaimana menciptakan database server data dan mengambil data tersebut kemudian menampilkannya di aplikasi android memakai librari volley. Dan pada aritikel kali ini aku akan meneruskan tutorial kemarin, masih memakai librari volley sebagai pengambil data, nah bedanya nanti data akan aku tampilkan banyak data mysql di komponen RecyclerView. Oke sob, berikut tutorialnya 😁

Untuk menciptakan aplikasi android, kadang aplikasi membutuhkan data yang di simpan di server clound biar dapat diakses oleh banyak pengguna. Data tersebut biasanya disimpan di dalam database MySQL dan diakses dengan file WEB PHP. Untuk dapat mengakses data pada server ke dalam aplikasi android, aplikasi harus mengunakan layanan web (Web Service). Untuk klarifikasi lanjut wacana Web Service dapat sobat baca di artikel sebelumnya.

Nah, untuk memakai Web Service, kita dapat memakai beberapa librari menyerupai asyntask, Android Query, Volley, maupun Retrofit. Librari-librari tersebut mempunyai kelebihan dan kekurangan masing-masing, dan untuk kecepatan mengambil data Retrofit yang paling unggul.

Baca juga "Cara Menampilkan Kecepatan Internet Android di Statusbar"

Pada artikel kali ini masih memakai librari volley untuk mengambil data. Dan tambahanya adalah, data yang diambil akan ditampilan pada komponen RecyclerView berbentuk list. Oke berikut angkah pembuatanya.

Pada artikel ini aku memakai server dan project dari artikel sebelumnya. Jika sobat belum membuatnya, silahkan dapat sobat buka pada link di bawah ini

Menampilkan Data Dari MySql ke Aplikasi Android

Membuat Server

Server yang aku gunakan sama dengan tutorial sebelumnya, yaitu dengan database MySQL dengan nama database app_blogvolley di table hape

Membuat Project Baru

Untuk project yang dibentuk aku ambil dari artikel sebelumnya, yaitu project volley

Menginstal Librari

Librari yang dipakai masih sama dengan artikel sebelumnya, yaitu campuran antara volley dan glide

Membuat Tampilan

Untuk nanti kita akan tampilkan data pada komponen RecyclerView, untuk menambahkan komponen RecyclerView, silahkan sobat dapat membaca pada postingan aku sebelumnya di link berikut

Membuat Aplikasi Android RecyclerView dan Menampilkan Gambar dengan Glide

Untuk menambah komponen RecyclerView, kini sobat buka file activity_main.xml dan tambahkan komponen RecyclerView, kodenya menyerupai berikut ini :

 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:app="http://schemas.android.com/apk/res-auto"     xmlns:tools="http://schemas.android.com/tools"     android:id="@+id/activity_main"     android:layout_width="match_parent"     android:layout_height="match_parent"     tools:context="com.aji.voley1.MainActivity">       <android.support.v7.widget.RecyclerView         android:id="@+id/lvhape"         android:layout_width="match_parent"         android:layout_height="match_parent"         android:layout_alignParentLeft="true"         android:layout_alignParentStart="true"         android:layout_alignParentTop="true" /> </RelativeLayout>  

Kemudian jikalau kita ingin menampilkan data pada RecyclerView dengan tampilan yang kita inginkan, maka kita membutuhkan layout gres biar kita dapat menampilkan data pada komponen yang kita butuhkan. Pada komponen RecyclerView kita akan menampilkan data gambar dan satu teks sebagai judul data. Untuk tampilan silakan dapat sobat ubah sesuai impian sobat (gak harus kaya gini hehe)

Baca juga "Menyimpan Data ke Database MySQL memakai Library Volley Andoroid"

Kita menampilkan gambar memakai komponen ImageView dan untuk menampilkan teks memakai komponen TextView. Silahkan buat layout gres kemudian beri nama dengan list_item.xml, kodenya sebagai berikut

 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:paddingTop="5dp">      <android.support.v7.widget.CardView         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:layout_marginLeft="10dp"         android:layout_marginRight="10dp"         android:padding="5dp">          <LinearLayout             android:layout_width="match_parent"             android:layout_height="wrap_content"             android:orientation="horizontal"             android:padding="5dp">              <ImageView                 android:id="@+id/imghp"                 android:layout_width="100dp"                 android:layout_height="100dp"                 android:src="@mipmap/ic_launcher" />              <TextView                 android:id="@+id/txthape"                 android:layout_width="match_parent"                 android:layout_height="match_parent"                 android:layout_marginLeft="10dp"                 android:gravity="center_vertical"                 android:text="Merk"                 android:textSize="25sp" />         </LinearLayout>     </android.support.v7.widget.CardView>  </RelativeLayout> 

Membuat Logika Java

Jika tampilanya sudah dibuat, kini masukkan budi java pada file MainActivity.java. Untuk kali ini kita akan ubah beberapa isyarat yang ada pada artikel sebelumnya, silahkan sobat cek isyarat pada file MainActivity.java dan rubah menyerupai berikut ini :

 package com.aji.voley1;  import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.RecyclerView; import android.util.Log; import android.widget.ImageView; import android.widget.TextView; import android.widget.Toast;  import com.android.volley.Request; import com.android.volley.RequestQueue; import com.android.volley.Response; import com.android.volley.VolleyError; import com.android.volley.toolbox.StringRequest; import com.android.volley.toolbox.Volley; import com.bumptech.glide.Glide;  import org.json.JSONArray; import org.json.JSONException; import org.json.JSONObject;  import java.util.ArrayList; import java.util.HashMap;  public class MainActivity extends AppCompatActivity {      private RecyclerView lvhape;      private RequestQueue requestQueue;     private StringRequest stringRequest;      ArrayList<HashMap<String, String>> list_data;      @Override     protected void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         setContentView(R.layout.activity_main);          String url = "http://192.168.95.77/app_blogvolley/getdata.php";          lvhape = (RecyclerView) findViewById(R.id.lvhape);         LinearLayoutManager llm = new LinearLayoutManager(this);         llm.setOrientation(LinearLayoutManager.VERTICAL);         lvhape.setLayoutManager(llm);          requestQueue = Volley.newRequestQueue(MainActivity.this);          list_data = new ArrayList<HashMap<String, String>>();          stringRequest = new StringRequest(Request.Method.GET, url, new Response.Listener<String>() {             @Override             public void onResponse(String response) {                 Log.d("response ", response);                 try {                     JSONObject jsonObject = new JSONObject(response);                     JSONArray jsonArray = jsonObject.getJSONArray("handphone");                     for (int a = 0; a < jsonArray.length(); a++) {                         JSONObject json = jsonArray.getJSONObject(a);                         HashMap<String, String> map = new HashMap<String, String>();                         map.put("id", json.getString("idhp"));                         map.put("merk", json.getString("merk"));                         map.put("tipe", json.getString("tipe"));                         map.put("gambar", json.getString("gambar"));                         map.put("keterangan", json.getString("keterangan"));                         list_data.add(map);                         AdapterList adapter = new AdapterList(MainActivity.this, list_data);                         lvhape.setAdapter(adapter);                     }                 } catch (JSONException e) {                     e.printStackTrace();                 }             }         }, new Response.ErrorListener() {             @Override             public void onErrorResponse(VolleyError error) {                 Toast.makeText(MainActivity.this, error.getMessage(), Toast.LENGTH_SHORT).show();             }         });          requestQueue.add(stringRequest);     } }  

Untuk menampilkan data ke dalam RecyclerView, kita membutuhkan adapter untuk memproses data. Adapter yang dipakai yakni adapter yang diubah sesuai impian kita biar data tampil di masing-masing komponen yang ada di layout list_item.xml. Oke, untuk menciptakan adapter, kita memakai sebuah class gres yang nanti kita beri nama AdapterList yang class ini mempunyai sifat dari RecyclerView.Adapter. Kemudian untuk penampung data, memakai ViewHolder yang kita masukan ke dalam AdapterList. Untuk kodenya menyerupai berikut

 package com.aji.voley1;  import android.content.Context; import android.support.v7.widget.RecyclerView; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.ImageView; import android.widget.TextView;  import com.bumptech.glide.Glide;  import java.util.ArrayList; import java.util.HashMap;  /**  * Created by AJISETYA.  */ public class AdapterList extends RecyclerView.Adapter<AdapterList.ViewHolder>{      Context context;     ArrayList<HashMap<String, String>> list_data;      public AdapterList(MainActivity mainActivity, ArrayList<HashMap<String, String>> list_data) {         this.context = mainActivity;         this.list_data = list_data;     }      @Override     public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {         View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.list_item, null);         return new ViewHolder(view);     }      @Override     public void onBindViewHolder(ViewHolder holder, int position) {         Glide.with(context)                 .load("http://192.168.95.77/app_blogvolley/img/" + list_data.get(position).get("gambar"))                 .crossFade()                 .placeholder(R.mipmap.ic_launcher)                 .into(holder.imghape);         holder.txthape.setText(list_data.get(position).get("merk"));     }      @Override     public int getItemCount() {         return list_data.size();     }      public class ViewHolder extends RecyclerView.ViewHolder {         TextView txthape;         ImageView imghape;          public ViewHolder(View itemView) {             super(itemView);              txthape = (TextView) itemView.findViewById(R.id.txthape);             imghape = (ImageView) itemView.findViewById(R.id.imghp);         }     } }  

Memberikan Izin Mengakses Internet

Karena aplikasi mengambil data dari server lewat internet, maka kita harus memperlihatkan izin internet di dalam AndroidManifest.xml, untuk kodenya di bawah ini kemudian letakkan di atas isyarat <application>

 <uses-permission android:name="android.permission.INTERNET"/> 

Menjalankan Aplikasi

Jika tampilan dan isyarat javanya sudah, kini aplikasi sudah dapat dijalankan dengan menentukan sajian Run-app, untuk tampilanya menyerupai berikut ini

Nah, konsepnya sama menyerupai kita menampikan data ke aplikasi memakai AQuery dan ListView. Makara data diambil dengan memanggil json dari server, kemudian diproses dan dimasukkan ke dalam RecyclerView untuk ditampilkan pada layar.

Oke sekian artikel tentang Menampilkan Data MySQL ke Aplikasi Android dengan Volley dan RecyclerView, semoga bermanfaat dan membantu sobat yang sedang berguru pemrograman android. Silahkan bagikan artike ini ke taman-teman sobat jikalau sobat bahagia dengan artikel ini. Silahkan isi kolom komentar di bawah jikalau sobat ada pertanyaan, kritik, dan saran. Oke, terimakasih hingga jumpa di artikel selanjutnya.. 😀

Artikel Selanjutnya "Menyimpan Data ke Database MySQL memakai Library Volley Andoroid"

Tag : Pemrograman, Pemrograman Android