Pages

Thursday, December 1, 2016

Membuat Pencarian Data pada Listview dari MySQL Dengan SearchView pada ActionBar Android

Pada tutorial kali ini, saya akan membagi cara membuat aplikasi android pencarian menggunakan searchview di action bar. Caranya sederhana, asalkan data yang kita ambil dari server berupa data teks saja tidak ada image atau foto. Untuk pencarian listview yang data nya berisi image dari server bisa anda lihat disini. Sebelum mengikuti tutorial ini, anda terlebih dahulu harus mengikuti Tutorial Menampilkan Data dari MySQL ke ListView Android. Langsung aja kita pada caranya .heheehhhehhehh

Terlebih dahulu anda harus mengikuti Tutorial menampilkan data MySQL ke Listview Android. Jika sudah ada project tersebut di komputer anda dan berhasil berjalan dengan sempurna, selanjutnya ikuti langkah-langkah selanjutnya.
Di folder res/menu buat file baru dengan nama activity_main_actions.xml pastekan koding berikut.
activity_main_actions.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
    <!-- Search Widget -->
    <item android:id="@+id/action_search"
          android:icon="@drawable/ic_action_search"
          android:title="@string/action_search"
          android:showAsAction="ifRoom"
          android:actionViewClass="android.widget.SearchView"/>
    
</menu>

Pada folder res/values ganti kode strings.xml dengan kode berikut.
<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">Listview Andoid</string>
    <string name="hello_world">Hello world!</string>
    <string name="action_search">Search</string>

</resources>
Pada folder src/namapackage pada MainActivity.java tambahkan koding berikut.
public class MainActivity extends ListActivity implements SearchView.OnQueryTextListener {

 // Progress Dialog
 private ProgressDialog pDialog;
 SearchView searchView;
 JSONParser jParser = new JSONParser();

 ArrayList<HashMap<String, String>> semuaList;

 String url_semua = "";

 // JSON Node
 private static final String TAG_SUCCESS = "success";
 private static final String TAG_DATA = "data";
 private static final String TAG_MBL = "motor";
 private static final String TAG_HRG = "harga";

 // pendaftaran JSONArray
 JSONArray jmobil = null;
Buat class untuk me-load semua data dari database MySQL
class LoadSemua extends AsyncTask<String, String, String> {

  /**
   * sebelum melakukan thread di background maka jalankan progres dialog
   * */
  @Override
  protected void onPreExecute() {
   super.onPreExecute();
   pDialog = new ProgressDialog(MainActivity.this);
   pDialog.setMessage("Mohon tunggu, Loading Data...");
   pDialog.setIndeterminate(false);
   pDialog.setCancelable(false);
   pDialog.show();
  }

  /**
   * dapetkan semua produk dari get url di background
   * */
  protected String doInBackground(String... args) {
   // Buat Parameter
   List<NameValuePair> params = new ArrayList<NameValuePair>();
   // ambil json dari url
   JSONObject json = jParser.makeHttpRequest(url_semua, "GET", params);

   // cek logcat untuk response dari json
   Log.d("Semua  : ", json.toString());

   try {
    // cek jika tag success
    int success = json.getInt(TAG_SUCCESS);

    if (success == 1) {
     // data ditemukan
     jmobil = json.getJSONArray(TAG_DATA);

     // tampilkan perulangan semua produk
     for (int i = 0; i < jmobil.length(); i++) {
      JSONObject c = jmobil.getJSONObject(i);

      // simpan pada variabel
      String mb = c.getString(TAG_MBL);
      String hg = c.getString(TAG_HRG);

      // buat new hashmap
      HashMap<String, String> map = new HashMap<String, String>();

      // key => value
      map.put(TAG_MBL, mb);
      map.put(TAG_HRG, hg);

      // masukan HashList ke ArrayList
      semuaList.add(map);
     }
    } else {
     // jika tidak ada data
     // tutup semua proses sebelumnya
     
    }
   } catch (JSONException e) {
    e.printStackTrace();
   }

   return null;
  }

  
  protected void onPostExecute(String file_url) {
   // hentikan progress ketika semua data didapat
   pDialog.dismiss();
   // perbarui screen
   runOnUiThread(new Runnable() {
    public void run() {
     
     ListAdapter adapter = new SimpleAdapter(MainActivity.this,
       semuaList, R.layout.list, new String[] { TAG_MBL,
         TAG_HRG },
       new int[] { R.id.mb, R.id.hg });
     setListAdapter(adapter);
     ListView lv = getListView();
     lv.setTextFilterEnabled(true);
    }
   });

  }

 }
Pada onCreateOptionsMenu tambahkan seperti ini.
@Override
 public boolean onCreateOptionsMenu(Menu menu) {
  MenuInflater inflater = getMenuInflater();
  inflater.inflate(R.menu.activity_main_actions, menu);

  // Associate searchable configuration with the SearchView
  SearchManager searchManager = (SearchManager) getSystemService(Context.SEARCH_SERVICE);
  searchView = (SearchView) menu.findItem(R.id.action_search)
    .getActionView();
  searchView.setSearchableInfo(searchManager
    .getSearchableInfo(getComponentName()));
  searchView.setOnQueryTextListener(this);
  return super.onCreateOptionsMenu(menu);
 }
Query pencarian di searchview
Override
 public boolean onQueryTextChange(String newText) {
  ListView lv = getListView();
  if (TextUtils.isEmpty(newText)) {
   lv.clearTextFilter();
  } else {
   lv.setFilterText(newText);
  }
  return false;
 }
pada onActivityResult
@Override
 protected void onActivityResult(int requestCode, int resultCode, Intent data) {
  super.onActivityResult(requestCode, resultCode, data);
  // jika kode hasil sama dengan 100
  if (resultCode == 100) {
   
   Intent intent = getIntent();
   finish();
   startActivity(intent);
  }

 }
Terakhir pada onCreate
public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  url_semua = "http://10.0.2.2/test/test.php";
  // Hashmap untuk ListView
  semuaList = new ArrayList<HashMap<String, String>>();

  // Loading products in Background Thread
  new LoadSemua().execute();

  // Get listview
  ListView lv = getListView();

 }
Sehingga Koding lengkap MainActivity.java adalah sebagai berikut.
package com.codingers;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;

import org.apache.http.NameValuePair;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;

import android.app.ListActivity;
import android.app.ProgressDialog;
import android.app.SearchManager;
import android.content.Context;
import android.content.Intent;
import android.os.AsyncTask;
import android.os.Bundle;
import android.text.TextUtils;
import android.util.Log;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ListAdapter;
import android.widget.ListView;
import android.widget.SearchView;
import android.widget.SimpleAdapter;
import android.widget.TextView;

public class MainActivity extends ListActivity implements SearchView.OnQueryTextListener {

 // Progress Dialog
 private ProgressDialog pDialog;
 SearchView searchView;
 JSONParser jParser = new JSONParser();

 ArrayList<HashMap<String, String>> semuaList;

 String url_semua = "";

 // JSON Node
 private static final String TAG_SUCCESS = "success";
 private static final String TAG_DATA = "data";
 private static final String TAG_MBL = "motor";
 private static final String TAG_HRG = "harga";

 // pendaftaran JSONArray
 JSONArray jmobil = null;
 String isi;

 @Override
 public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  url_semua = "http://10.0.2.2/test/test.php";
  // Hashmap untuk ListView
  semuaList = new ArrayList<HashMap<String, String>>();

  // Loading products in Background Thread
  new LoadSemua().execute();

  // Get listview
  ListView lv = getListView();

 }

 @Override
 protected void onActivityResult(int requestCode, int resultCode, Intent data) {
  super.onActivityResult(requestCode, resultCode, data);
  // jika kode hasil sama dengan 100
  if (resultCode == 100) {
   
   Intent intent = getIntent();
   finish();
   startActivity(intent);
  }

 }

 

 class LoadSemua extends AsyncTask<String, String, String> {

  /**
   * sebelum melakukan thread di background maka jalankan progres dialog
   * */
  @Override
  protected void onPreExecute() {
   super.onPreExecute();
   pDialog = new ProgressDialog(MainActivity.this);
   pDialog.setMessage("Mohon tunggu, Loading Data...");
   pDialog.setIndeterminate(false);
   pDialog.setCancelable(false);
   pDialog.show();
  }

  /**
   * dapetkan semua produk dari get url di background
   * */
  protected String doInBackground(String... args) {
   // Buat Parameter
   List<NameValuePair> params = new ArrayList<NameValuePair>();
   // ambil json dari url
   JSONObject json = jParser.makeHttpRequest(url_semua, "GET", params);

   // cek logcat untuk response dari json
   Log.d("Semua  : ", json.toString());

   try {
    // cek jika tag success
    int success = json.getInt(TAG_SUCCESS);

    if (success == 1) {
     // data ditemukan
     jmobil = json.getJSONArray(TAG_DATA);

     // tampilkan perulangan semua produk
     for (int i = 0; i < jmobil.length(); i++) {
      JSONObject c = jmobil.getJSONObject(i);

      // simpan pada variabel
      String mb = c.getString(TAG_MBL);
      String hg = c.getString(TAG_HRG);

      // buat new hashmap
      HashMap<String, String> map = new HashMap<String, String>();

      // key => value
      map.put(TAG_MBL, mb);
      map.put(TAG_HRG, hg);

      // masukan HashList ke ArrayList
      semuaList.add(map);
     }
    } else {
     // jika tidak ada data
     // tutup semua proses sebelumnya
     
    }
   } catch (JSONException e) {
    e.printStackTrace();
   }

   return null;
  }

  
  protected void onPostExecute(String file_url) {
   // hentikan progress ketika semua data didapat
   pDialog.dismiss();
   // perbarui screen
   runOnUiThread(new Runnable() {
    public void run() {
     
     ListAdapter adapter = new SimpleAdapter(MainActivity.this,
       semuaList, R.layout.list, new String[] { TAG_MBL,
         TAG_HRG },
       new int[] { R.id.mb, R.id.hg });
     setListAdapter(adapter);
     ListView lv = getListView();
     lv.setTextFilterEnabled(true);
    }
   });

  }

 }
 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  MenuInflater inflater = getMenuInflater();
  inflater.inflate(R.menu.activity_main_actions, menu);

  // Associate searchable configuration with the SearchView
  SearchManager searchManager = (SearchManager) getSystemService(Context.SEARCH_SERVICE);
  searchView = (SearchView) menu.findItem(R.id.action_search)
    .getActionView();
  searchView.setSearchableInfo(searchManager
    .getSearchableInfo(getComponentName()));
  searchView.setOnQueryTextListener(this);
  return super.onCreateOptionsMenu(menu);
 }

 @Override
 public boolean onQueryTextSubmit(String query) {
  // TODO Auto-generated method stub
  return false;
 }

 @Override
 public boolean onQueryTextChange(String newText) {
  ListView lv = getListView();
  if (TextUtils.isEmpty(newText)) {
   lv.clearTextFilter();
  } else {
   lv.setFilterText(newText);
  }
  return false;
 }

}
Maka hasilnya adalah sebagai berikut, selamat mencoba...

2 comments:

  1. maaf mau tanya,untuk script php nya gimana ya ??

    terima kasih

    ReplyDelete
  2. mau tanya file xml activity_main nya tidak dipublish disini? jadi kan bisa lihat cara memunculkan menu nya di activity_main.xml

    ReplyDelete