Tutorial Android : Cara Menggunakan AsyncTask di Android

Akhirnya sampai di rumah dan bisa berlibur sejenak dari kegiatan yang aneh-aneh di pulau seberang. Dan yang terpenting saya bisa bertemu lagi dengan si Paijo, Jupiter MX baru yang akan menggantikan Jupiter Z aka Bejo untuk menemani saya seliweran tiap harinya. Tadi malam, setelah sampai rumah saya langsung mengajak si Paijo jalan-jalan ke jalan byPass Ngurah Rai. Emang mantap dah si Paijo, larinya kencang bukan main :D. Semoga si Paijo bisa membuat saya lebih enteng rejeki dan jodoh, maklumlah saya sudah lama menyandang status #jombloGalau. Ngomong-ngomong soal  #galau (lagi), kemarin-kemarin saya sempat dilanda rasa #galau dengan aplikasi android yang saya buat, dimana selalu force close jika dijalankan di versi 3.0 ke atas. Setelah mencari masalahnya di logcat, ternyata mulai android versi 3.0 ke atas tidak diperbolehkan untuk mengakses internet secara langsung melalui main activity. Saya coba cari solusinya di stackoverflow dan solusinya kita bisa menggunakan AsyncTask. AsyncTask ini memungkinkan pengaksesan internet (background data) berjalan di background.

Ketika pertama membaca dokumentasi cara penggunaannya di developer.android.com, saya bingung juga. Saya kira harus mengubah seluruh kode yang berfungsi untuk berkomunikasi via internet. Ternyata hanya perlu menambahkan sebuah class (di dalam public class main activity) yang meng-extends abstract class AsyncTask dan mendefinisikan ketiga method abstract-nya, yaitu onPreExecute(), doInBackground(), dan onPostExecute() pada main activity. Studi kasusnya pada postingan kali ini ialah menampilkan data ke dalam listview dan dicoba pada emulator dengan versi android 4.0.3 alias Ice Cream Sandwich. Proses parsing data dari format JSON dan menyimpannya ke dalam ArrayList dilakukan di method doInBackground(). Kemudian untuk menampilkannya ke dalam listview dilakukan di method onPostExecute(). Dari method onCreate (main activity), kita hanya perlu memanggil class tersebut dengan menambahkan method execute(). Sekarang kita coba untuk membuatnya, cekidot gan…

1. Siapkan tabelnya terlebih dahulu, tabelnya masih sama seperti postingan yang kemarin. Setelah itu kita buat sebuah file php untuk memanggil data yang ada di dalam tabel dan kita atur sesuai format JSON.

<?php
include("koneksi.php");
$q = mysql_query("SELECT * FROM tbl_artikel");
$v = '{"berita" : [';
while($r=mysql_fetch_array($q))
{
	if(strlen($v)<15)
	{
		$v .= '{"judul" : "'.strip_tags($r['judul']).'", "tanggal" : "'.$r['tanggal'].'", "waktu" : "'.$r['waktu'].'"}';
	}
	else
	{
		$v .= ',{"judul" : "'.strip_tags($r['judul']).'", "tanggal" : "'.$r['tanggal'].'", "waktu" : "'.$r['waktu'].'"}';
	}

}
$v .= ']}';
	echo $v;
?>

2. Buat sebuah android project baru dengan detail seperti di bawah ini :

3. Seperti biasa, ketika akan menampilkan data ke dalam listview android, kita membutuhkan 2 buah layout, yaitu main.xml (berisi sebuah listview) dan list_row.xml (berisi textview untuk menempatkan data hasil parsing).

main.xml

<?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>

list_row.xml

<?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="wrap_content"
    android:orientation="horizontal">
    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
    	android:layout_margin="10dp"
        android:orientation="vertical">

        <TextView
            android:id="@+id/judul"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:textColor="#fff"
            android:textSize="14sp"
            android:textStyle="bold"
            android:paddingBottom="2dip" />

        <TextView
            android:id="@+id/tanggal"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:textColor="#fff"
            android:textSize="10sp" />
    </LinearLayout>

</LinearLayout>

4. Class JSONParser yang saya gunakan masih sama dengan yang di tutorial-tutorial sebelumnya, seperti di bawah ini :

public class JSONParser {

	static InputStream is = null;
	static JSONObject jObj = null;
	static String json = "";

	public JSONParser() {

	}

	public JSONObject AmbilJson(String url) {

		try {
			DefaultHttpClient httpClient = new DefaultHttpClient();
			HttpPost httpPost = new HttpPost(url);

			HttpResponse httpResponse = httpClient.execute(httpPost);
			HttpEntity httpEntity = httpResponse.getEntity();
			is = httpEntity.getContent();

		} catch (UnsupportedEncodingException e) {
			e.printStackTrace();
		} catch (ClientProtocolException e) {
			e.printStackTrace();
		} catch (IOException e) {
			e.printStackTrace();
		}

		try {
			BufferedReader reader = new BufferedReader(new InputStreamReader(
					is, "iso-8859-1"), 8);
			StringBuilder sb = new StringBuilder();
			String line = null;
			while ((line = reader.readLine()) != null) {
				sb.append(line + "\n");
			}
			is.close();
			json = sb.toString();
		} catch (Exception e) {
			Log.e("Buffer Error", "Error converting result " + e.toString());
		}

		try {
			jObj = new JSONObject(json);
		} catch (JSONException e) {
			Log.e("JSON Parser", "Error parsing data " + e.toString());
		}

		return jObj;

	}
}

5. Buka dan edit file TesAsyncTasActivity.java, ketikkan kode di bawah ini. Terdapat sebuah class baru dengan nama AmbilData yang meng-extends abstract class AsyncTask, dengan 3 method yang telah didefinisikan di dalamnya.

public class TesAsyncTaskActivity extends ListActivity {

	static String in_judul = "judul";
	static String in_waktu = "tanggal";
	JSONArray str_json = null;
	public String lo_Koneksi,isi ;

	private ProgressDialog pDialog;
	ArrayList<HashMap<String, String>> data_map = new ArrayList<HashMap<String, String>>();

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        Koneksi lo_Koneksi = new Koneksi();
        isi = lo_Koneksi.isi_koneksi();
        new AmbilData().execute();
    }

    class AmbilData extends AsyncTask<String, String, String> {
        @Override
        protected void onPreExecute() {
            super.onPreExecute();
            pDialog = new ProgressDialog(TesAsyncTaskActivity.this);
            pDialog.setMessage("Sabar gan, masih ngambil data neh...");
            pDialog.setIndeterminate(false);
            pDialog.setCancelable(true);
            pDialog.show();
        }

        protected String doInBackground(String... args) {

            String link_url = isi+"berita.php";
    		JSONParser jParser = new JSONParser();
    		JSONObject json = jParser.AmbilJson(link_url);

    		try {
    			str_json = json.getJSONArray("berita");

    			for(int i = 0; i < str_json.length(); i++){
    				JSONObject ar = str_json.getJSONObject(i);

    				HashMap<String, String> map = new HashMap<String, String>();

    				String judul = ar.getString("judul");
    				String waktu = ar.getString("tanggal")+" | "+ar.getString("waktu");

    				map.put(in_judul, judul);
    				map.put(in_waktu, waktu);

    				data_map.add(map);
    			}
    		} catch (JSONException e) {
    			e.printStackTrace();
    		}
            return null;
        }

        protected void onPostExecute(String file_url) {
            pDialog.dismiss();
            runOnUiThread(new Runnable() {
                public void run() {
                	ListAdapter adapter = new SimpleAdapter(
							TesAsyncTaskActivity.this, data_map,
							R.layout.list_row, new String[] { in_judul, in_waktu}, new int[] {R.id.judul, R.id.tanggal});
                    setListAdapter(adapter);
                }
            });

        }
    }
}

6. Karena akan mengakses HTTPRequest, jangan lupa untuk menambahkan permisionnya pada file AndroidManifest.xml.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="dlmbg.pckg.tes.asynctask"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk android:minSdkVersion="10" />

    <application
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name" >
        <activity
            android:name=".TesAsyncTaskActivity"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
    <uses-permission android:name="android.permission.INTERNET" />

</manifest>

7. Setelah selesai, sekarang kita coba jalankan pada sebuah emulator yang menggunakan android versi 4.0.3 atau 3.0 juga bisa. Akan muncul sebuah DialogBox yang sudah kita buat pada method onPreExecute().

Nah, sekarang ketika akan membuat aplikasi yang membutuhkan komunikasi data internet jangan lupa untuk menambahkan AsyncTask. Agar dapat berjalan di android versi yang lebih tinggi, mengingat saat ini sudah banyak hape android yang menggunakan OS versi terbaru. OK deh, sekian dulu postingan saya kali ini, semoga bermanfaat untuk rekan-rekan yang sedang dibuat galau gara-gara aplikasinya force close di android versi 3.0 ke atas :D.

Happy Blogging and Keep Coding

Cheerrrss….!!!!

[to_like][/to_like]

35 comments

  1. Asha Reply

    Bli, mau nanya. Kalo misalkan kita mau merefresh isi dari listview gimana caranya bli? Jadi saya membuat sebuah option menu Refresh, ketika di tap, isi listview direfresh. Mohon bantuannya bli

  2. Pingback: Tutorial Android : Contoh Aplikasi Sistem Informasi Akademik Berbasis Android | Ng`Blog Biar Gak GobloG – BlogNya Gede Lumbung

  3. Rdiksa Reply

    Bli, ade tutor anggo ngae layout sebuah project pang nyak fit di semua versi layar? pang nyak dinamis.

    • Gede Lumbung Post authorReply

      pake relativelayout
      atau jika tidak mau repot, bisa menggunakan framework hybrid seperti phonegap, titanium, sencha touch dll
      berbasis html, css, dan js

  4. yuno Reply

    bli, klo yg buat sistem akademik gimana?
    tlg pencerahannya (lebih tepat bocoran)!
    kirim2 ke email ya bli. ^^

    plus yg akses DB via wifi (minta tutorial sedetail2nya)

    thx b4! “programmer cepuk(cupu)”

  5. via Reply

    bro, aku kan mau bikin table, nah aku udah looping tablerow dan textview di fungsi doInBackground. terus begitu aku mau add tablerownya kedalam tablelayout error bro, tapi kalau aku add tablerow kedalam tablelayoutnya di fungsi onPostExecute, yang muncul hanya data terakhirnya aja. Kira2 ada solusi ga bro? makasih 🙂

    • Gede Lumbung Post authorReply

      ane belum pernah looping isi tabel
      dulu pernah looping tabel, terus hasilnya ane masukkan ke dalam listview

  6. fathan Reply

    bro, kalo mau nampilin detil artikelnya gmn ya? masih bingung klu pake asynctask. mohon bimbingannya 😀

  7. didi Reply

    gan buat detilnya gmn ya?
    Apa sama seperti saat membuat TesAsyncTasActivity.java? tp pada posting agan yg sebelumnya tentang Mengakses Data Dari Database MySQL di ListView Dengan JSON,,detil meng-extends ke Activity bukan ListActivity. Mohon bantuannya gan..ane br butuh

  8. Miqkial Reply

    Mas..
    kalau mau tampilkan data berdasarkan kode/nim yang sudah di masukkan dengan intent bagaimana ya ??

  9. ajuz Reply

    tolong dong gambar step 2 dan 7 di perbarui, biar bacanya enak mas. 😀

  10. yuno Reply

    masih error di JSON-nya –> /Error parsing data org.json.JSONException: Value <?xml of type java.lang.String cannot be converted to JSONObject/ kenapa ya?

  11. nehruxxx Reply

    gan, bagaimana caranya supaya list view dari hasil Asynctask ini belang-belang warnanya, supaya enak ngeliat nya, ane nyoba main-main di listadapter nya gak bisa-bisa gan…., mungkin ente bisa ngasih pencerahan???

  12. putra Reply

    bli, kenapa pas saya coba dengan link yang dinamis, awalnya lancar pas udah beberapa kali dijalankan muncul error begini dari logcat nya : “Error parsing data org.json.JSONException: Value <?xml of type java.lang.String cannot be converted to JSONObject"

    link yang saya akses untuk mendapatkan json : 10.0.2.2/tesandroid/hargabarang/date/id_barang,

    date dan id_barang di dapat dari form input yang saya buat

    jadi linknya seperti ini : – 10.0.2.2/tesandroid/hargabarang/2013-12-23/1
    – 10.0.2.2/tesandroid/hargabarang/2013-9-21/3
    yang dinamis date dan id_barangnya

    apakah error nya itu karena link akses json nya yang sering berubah-ubah???

  13. putra Reply

    bli, kenapa pas saya coba dengan link yang dinamis, awalnya lancar pas udah beberapa kali dijalankan muncul error begini dari logcat nya : “Error parsing data org.json.JSONException: Value <?xml of type java.lang.String cannot be converted to JSONObject"

    link yang saya akses untuk mendapatkan json : 10.0.2.2/tesandroid/hargabarang/date/id_barang,

    date dan id_barang di dapat dari form input yang saya buat

    jadi linknya seperti ini :
    – 10.0.2.2/tesandroid/hargabarang/2013-12-23/1
    – 10.0.2.2/tesandroid/hargabarang/2013-9-21/3
    yang dinamis date dan id_barangnya

    apakah error nya itu karena link akses json nya yang sering berubah-ubah???

  14. Nova Agustina Reply

    class Koneksinya ini..

    package dlmbg.pckg.tes.asynctask;

    public class Koneksi {

    public String isi_koneksi()
    {
    String isi = “http://10.0.2.2/android/”;
    return isi;
    }

    }