Halo readers…!
JSON (JavaScript Object Notation) merupakan sarana untuk saling bertukar data antara server dengan client atau pertukaran data antar web. Pada awalnya pertukaran data biasanya menggunakan XML (eXtensible Markup Language) namun seiringnya waktu XML kian di tinggalkan meskipun hingga saat ini masih ada beberapa menggunakan XML dalam hal RSS Feed. Format penulisan data menggunakan JSON sangatlah singkat karena menggunakan notasi-notasi javascript seperti kurung siku [] dan kurung kurawal {}.[1]
Karena kesederhanaan penulisan JSON maka ukuran file yang dihasilkan pun menjadi lebih ramping dibandingkan XML (karena terus mengulangi kata yang sama dalam tag-tag yang digunakan). Hal ini berimbas pada kecepatan loading transfer data, pertukaran data JSON lebih cepat jika dibandingkan dengan XML. Oleh karena itu banyak situs-situs besar yang menggunakan JSON sebagai format pertukaran data [1]. Nah, pada tutorial kali ini akan membahas tentang Bagaimana Cara Parsing Data JSON kedalam ListView Android.
Kali ini saya sudah menyiapkan sample data JSON yang menurut saya sederhana karena hanya menampilkan data id, nama, email, alamat dan hp. Contoh data tersebut bisa di lihat dibawah ini dan kalian pun bisa download data JSON lengkap melalui link berikut ini.
{
"kontak": [
{
"id": "c200",
"nama": "Ana Saputra",
"email": "[email protected]",
"alamat": "Denpasar",
"jk" : "Laki - Laki",
"hp" : "0857 7777 xxxx"
},
{
"id": "c201",
"nama": "Agung Saputra",
"email": "[email protected]",
"alamat": "Denpasar",
"jk" : "Laki - Laki",
"hp" : "0857 7777 xxxx"
}
. . .
]
}
Langkah – langkah selanjutnya dapat di lihat di bawah ini.
1. Buat project baru di Eclipse dengan cara File ⇒ New Project ⇒ Application Project dengan nama main classnya MainActivity dan beri nama packagenya com.theheran.jsonparsing. Yang belum jelas bisa klik disni
2. Karena kali ini saya akan “ngeload” data JSONnya menggunakan HTTP maka dari itu perlu menambahkan ‘izin’ (permission) pada file AndroidManifest.xml. Buka file tersebut dan tambahkan kode di bawah ini
<!-- Internet permission -->
<uses-permission android:name="android.permission.INTERNET" />
Hingga file AndroidManifest.xml lengkapnya menjadi seperti dibawah ini
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.theheran.jsonparsing"
android:versionCode="1"
android:versionName="1.0" >
<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="18" />
<!-- Internet permission -->
<uses-permission android:name="android.permission.INTERNET" />
<application
android:icon="@drawable/ic_launcher"
android:label="@string/app_name" >
<activity
android:label="@string/app_name"
android:name="com.theheran.jsonparsing.MainActivity" >
<intent-filter >
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<!-- Kontak List Item Activity -->
<activity
android:label="Contact"
android:name="com.theheran.jsonparsing.KontakActivity" >
</activity>
</application>
</manifest>
4. Buatlah class baru dan beri nama sebagai ServiceHandler.java. Class ini berfungsi untuk menghandle HTTP. Ketik kode di bawah ini.
package com.theheran.jsonparsing;
import java.io.IOException;
import java.io.UnsupportedEncodingException;
import java.util.List;
import org.apache.http.HttpEntity;
import org.apache.http.HttpResponse;
import org.apache.http.NameValuePair;
import org.apache.http.client.ClientProtocolException;
import org.apache.http.client.entity.UrlEncodedFormEntity;
import org.apache.http.client.methods.HttpGet;
import org.apache.http.client.methods.HttpPost;
import org.apache.http.client.utils.URLEncodedUtils;
import org.apache.http.impl.client.DefaultHttpClient;
import org.apache.http.util.EntityUtils;
public class ServiceHandler {
static String response = null;
public final static int GET = 1;
public final static int POST = 2;
public ServiceHandler() {
}
public String makeServiceCall(String url, int method) {
return this.makeServiceCall(url, method, null);
}
public String makeServiceCall(String url, int method,
List<NameValuePair> params) {
try {
// http client
DefaultHttpClient httpClient = new DefaultHttpClient();
HttpEntity httpEntity = null;
HttpResponse httpResponse = null;
// Checking http request method type
if (method == POST) {
HttpPost httpPost = new HttpPost(url);
// adding post params
if (params != null) {
httpPost.setEntity(new UrlEncodedFormEntity(params));
}
httpResponse = httpClient.execute(httpPost);
} else if (method == GET) {
// appending params to url
if (params != null) {
String paramString = URLEncodedUtils.format(params, "utf-8");url += "?" + paramString;
}
HttpGet httpGet = new HttpGet(url);
httpResponse = httpClient.execute(httpGet);
}
httpEntity = httpResponse.getEntity();
response = EntityUtils.toString(httpEntity);
} catch (UnsupportedEncodingException e) {
e.printStackTrace();
} catch (ClientProtocolException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
return response;
}
}
5. Selanjutnya buatlah Sebuah file activity_main.xml dengan cara klik kanan pada res/layout ⇒ New ⇒ Android XML File dan paste code di bawah ini
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<ListView
android:id="@android:id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
6. Selanjutnya adalah kita memerlukan satu layout untuk menampung data-data yang akan menampilkan data yang dikirim dari ListView. Berinama layout tersebut dengan nama activity_kontak.xml selanjutnya copy kode di bawah ini
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp">
<!-- Nama -->
<TextView android:id="@+id/name_label"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="25dip"
android:textStyle="bold"
android:paddingTop="10dip"
android:paddingBottom="10dip"
android:textColor="#43bd00"/>
<!-- Email -->
<TextView android:id="@+id/email_label"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#acacac"/>
<!-- No. Handphone -->
<TextView android:id="@+id/mobile_label"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textStyle="bold"/>
<!--
nb: anda bisa mengkostumasi tampilan berikut sesuai dengan kebutuhan anda. :)
-->
</LinearLayout>
6. Pada class MainActivity.java ketik kode di bawah ini :
package com.theheran.jsonparsing;
import com.theheran.jsonparsing.R;
import java.util.ArrayList;
import java.util.HashMap;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
import android.app.ListActivity;
import android.app.ProgressDialog;
import android.content.Intent;
import android.os.AsyncTask;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ListAdapter;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import android.widget.TextView;
public class MainActivity extends ListActivity {
private ProgressDialog pDialog;
// URL untuk mengambil data kontak JSON
private static String url = "http://192.168.43.190:81/kontak.json";
//Nama-nama Node pada JSON
private static final String TAG_KONTAK = "kontak";
private static final String TAG_ID = "id";
private static final String TAG_NAMA = "nama";
private static final String TAG_EMAIL = "email";
private static final String TAG_ALAMAT = "alamat";
private static final String TAG_JK = "jk";
private static final String TAG_HP = "hp";
// kontak JSONArray
JSONArray kontak = null;
// Hashmap for ListView
ArrayList<HashMap<String, String>> contactList;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
contactList = new ArrayList<HashMap<String, String>>();
ListView lv = getListView();
// Action klik pada Listview
lv.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
// Mengambil data dari ListView yang dipilih
String nama = ((TextView) view.findViewById(R.id.nama)).getText().toString();
String email = ((TextView) view.findViewById(R.id.email)).getText().toString();
String hp = ((TextView) view.findViewById(R.id.hp)).getText().toString();
// Memulai memanggil ke class KontakActivity dengan beberapa data
Intent in = new Intent(getApplicationContext(),KontakActivity.class);
in.putExtra(TAG_NAMA, nama);
in.putExtra(TAG_EMAIL, email);
in.putExtra(TAG_HP, hp);
startActivity(in);
}
});
// Menggunakan async task untuk "ngeload" data JSON
new GetContacts().execute();
}
private class GetContacts extends AsyncTask<Void, Void, Void> {
@Override
protected void onPreExecute() {
super.onPreExecute();
pDialog = new ProgressDialog(MainActivity.this);
pDialog.setMessage("Tolong Tunggu...");
pDialog.setCancelable(false);
pDialog.show();
}
@Override
protected Void doInBackground(Void... arg0) {
// Creating service handler class instance
ServiceHandler sh = new ServiceHandler();
// Making a request to url and getting response
String jsonStr = sh.makeServiceCall(url, ServiceHandler.GET);
Log.d("Response: ", "> " + jsonStr);
if (jsonStr != null) {
try {
JSONObject jsonObj = new JSONObject(jsonStr);
// Getting JSON Array node
kontak = jsonObj.getJSONArray(TAG_KONTAK);
// looping through All Contacts
for (int i = 0; i < kontak.length(); i++) {
JSONObject c = kontak.getJSONObject(i);
String id = c.getString(TAG_ID);
String name = c.getString(TAG_NAMA);
String email = c.getString(TAG_EMAIL);
String address = c.getString(TAG_ALAMAT);
String gender = c.getString(TAG_JK);
String hp = c.getString(TAG_HP);
// tmp hashmap for single contact
HashMap<String, String> contact = new HashMap<String, String>();
// adding each child node to HashMap key => value
contact.put(TAG_ID, id);
contact.put(TAG_NAMA, name);
contact.put(TAG_EMAIL, email);
contact.put(TAG_HP, hp);
// adding contact to contact list
contactList.add(contact);
}
} catch (JSONException e) {
e.printStackTrace();
}
} else {
Log.e("ServiceHandler", "Couldn't get any data from the url");
}
return null;
}
@Override
protected void onPostExecute(Void result) {
super.onPostExecute(result);
// Dismiss the progress dialog
if (pDialog.isShowing())
pDialog.dismiss();
/**
* Updating parsed JSON data into ListView
* */
ListAdapter adapter = new SimpleAdapter(
MainActivity.this, contactList,
R.layout.list_item, new String[] { TAG_NAMA, TAG_EMAIL,TAG_HP },
new int[] { R.id.nama,R.id.email, R.id.hp });
setListAdapter(adapter);
}
}
}
Terakhir, jalankan project dengan cara Klik kanan pada project⇒ Run As ⇒ 1 Android Application
Password file zip: www.theheran.com Password file zip: www.theheran.com
Bagaimana Readers? Sudah Jelas? Yang belum jelas bisa mention ke @the_heran. Nah Sekarang sekian dulu ya pembahasan Tutorial Menampilkan Data JSON pada Android . Sampai jumpa 
Salam Hangat
source [1]: http://www.ariona.net/apa-itu-json/
sangat membantu om.