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
1
2
3
4
5
6
7
8
9
10
<?xml version="1.0" encoding="utf-8"?>
    <!-- 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.
1
2
3
4
5
6
7
8
<?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.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
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
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
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.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
@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
1
2
3
4
5
6
7
8
9
10
Override
 public boolean onQueryTextChange(String newText) {
  ListView lv = getListView();
  if (TextUtils.isEmpty(newText)) {
   lv.clearTextFilter();
  } else {
   lv.setFilterText(newText);
  }
  return false;
 }
pada onActivityResult
1
2
3
4
5
6
7
8
9
10
11
12
@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
1
2
3
4
5
6
7
8
9
10
11
12
13
14
public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  // 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.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
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);
  // 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