Membuat Custom ListView Android Dengan Data Item Yang Diambil Dari Database SQLite


Selamat sore semuanya🙂,
Kali ini aku mau berbagi pengetahuan mengenai bagaimana caranya membuat tampilan ListView di Android dengan layout (susunan item bisa lebih dari 1 baris dan style yang lebih menarik) yang sesuai dengan keinginan kita. Dan data yang ditampilkan dalam listview ini nanti, adalah mengambil dari dalam database SQLite.

Contoh hasil jadi dari aplikasi ini nanti adalah seperti gambar berikut :
Custom ListView Android With Database

Intinya, gimana caranya kita membuat sebuah ListView di Android dengan susunan seperti ini :

Judul Item
Sub item detil

Karena kebanyakan ListView yang standard bawaannya, hanya akan menampilkan di bagian atas saja dari contoh tersebut. Untuk dapat melakukan/membuat tampilan seperti itu, kita membutuhkan bantuan BaseAdapter atau jika ingin lebih lagi bisa pakai ArrayAdapter.

Pertama, kamu buat Android Project baru silahkan kasih nama apa. Dalam kasus ini, Main Activity nya aku beri nama DaftarPenagihan. Sebelum itu, kalian perlu mempersiapkan 1 buah database dengan nama penagihan (karena dalam tutorial ini aku pakai database dengan nama tersebut :D), dan jangan lupa setelah membuat file database ini, taruh file nya di dalam workspace kamu di dalam folder assets, berikut adalah susunan tabelnya :

Database SQLite

Dan berikut adalah list source code masing-masing file,, bisa kamu copy paste atau langsung download projectnya nanti.

<!-- main.xml -->

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:layout_gravity="center"
    android:paddingLeft="15dp"
    android:paddingRight="15dp"
    android:background="@drawable/background" >

	<ListView
        android:id="@+id/listViewSMS"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    </ListView>

</LinearLayout>

 

// DataPenagihan.java

package com.wjc.penagihan;

import java.util.ArrayList;
import android.os.Bundle;
import android.widget.ListView;
import android.app.Activity;

public class DaftarPenagihan extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        ListView lViewPenagihan = (ListView) findViewById(R.id.listViewSMS);
        MyDatabaseHandler db = new MyDatabaseHandler(this);
        ArrayList<Penagihan> pnghList = db.getAllPenagihan();
        lViewPenagihan.setAdapter(new MyAdapter(this, pnghList));
    }
}

2 File pasti otomatis akan terbuat saat kalian membuat project, kalian hanya perlu menyesuaikan 2 file yang sudah dibuat tersebut dengan contoh tersebut diatas🙂. Kemudian kalian perlu membuat 3 buah file Java Class dan 1 xml file layout lagi. Berikut ini adalah list filenya :

Berikut ini file layout_daftar.xml, adalah file penting yang perlu ada. File inilah yang menetukan bagaimana nantinya tampilan ListView yang kita buat. Jadi kalo bisa silahkan dikembangkan sesuai dengan keinginan:mrgreen:

<!-- layout_daftar.xml -->

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/tv_nama"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceMedium" />

    <TextView
        android:id="@+id/tv_detail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</LinearLayout>

Berikut ini adalah class yang menangani untuk proses olah database penagihan.db yang sudah kita buat tadi.

// MyDatabaseHandler.java

package com.wjc.penagihan;

import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;
import java.util.ArrayList;
import java.util.List;

import android.content.ContentValues;
import android.content.Context;
import android.database.Cursor;
import android.database.SQLException;
import android.database.sqlite.SQLiteDatabase;
import android.database.sqlite.SQLiteException;
import android.database.sqlite.SQLiteOpenHelper;

public class MyDatabaseHandler extends SQLiteOpenHelper {
	private static String DB_PATH = "/data/data/com.wjc.penagihan/databases/";
	private static String DB_NAME = "penagihan.db";
	private final Context _context;
	private SQLiteDatabase db;

	private static final int DATABASE_VERSION = 1;

	public MyDatabaseHandler(Context context) {
		super(context, DB_NAME, null, DATABASE_VERSION);
        this._context = context;
	}

	@Override
	public void onCreate(SQLiteDatabase db) {

	}

	@Override
	public void onUpgrade(SQLiteDatabase db, int arg1, int arg2) {

	}

	public void createDataBase() throws IOException{
        boolean dbExist = checkDataBase();
        if(dbExist){
        }else{
        	this.getReadableDatabase();
        	try {
        		copyDataBase();
        	} catch (IOException e) {
        		throw new Error("Error copying database");
        	}
        }
    }

    private boolean checkDataBase(){
        SQLiteDatabase checkDB = null;
        try{
            String myPath = DB_PATH + DB_NAME;
            checkDB = SQLiteDatabase.openDatabase(myPath, null, SQLiteDatabase.OPEN_READWRITE);

        }catch(SQLiteException e){
        }
        if(checkDB != null){
            checkDB.close();
        }

        return checkDB != null ? true : false;
    }

    private void copyDataBase() throws IOException{
        InputStream myInput = _context.getAssets().open(DB_NAME);
        String outFileName = DB_PATH + DB_NAME;
        OutputStream myOutput = new FileOutputStream(outFileName);
        byte[] buffer = new byte[1024];
        int length;
        while ((length = myInput.read(buffer))>0){
            myOutput.write(buffer, 0, length);
        }
        myOutput.flush();
        myOutput.close();
        myInput.close();
    }

    public void openDataBase() throws SQLException{
    	String myPath = DB_PATH + DB_NAME;
    	db = SQLiteDatabase.openDatabase(myPath, null, SQLiteDatabase.OPEN_READWRITE);
    }

    @Override
    public void close() {
    	if(db != null)
    		db.close();
	    super.close();
    }

	public ArrayList<Penagihan> getAllPenagihan(){
		if(db != null)
    		db.close();
		openDataBase();
		String tgl = new Penagihan().getCurrentDate();
		db.delete("daftar", "tanggal_input <> ?", new String[]{tgl});

		ArrayList<Penagihan> pngList = new ArrayList<Penagihan>();
		String query = "SELECT nama_pelanggan, jumlah_bayar, jenis_bayar FROM daftar";
		Cursor cur = db.rawQuery(query, null);
		if(cur.moveToFirst()){
			do{
				Penagihan png = new Penagihan();
				png.setDaftarPlg(cur.getString(0));
				png.setDaftarJumlahBayar(cur.getString(1));
				png.setDaftarBayar(cur.getString(2));
				pngList.add(png);
			}while(cur.moveToNext());
		}
		cur.close();
		return pngList;
	}
}

Berikut ini adalah class yang digunakan untuk helper dalam mengakses data sementara untuk olah database.

// Penagihan.java

package com.wjc.penagihan;

public class Penagihan {
	private String d_plg, d_jumlah, d_bayar;

	public void setDaftarPlg(String plg){
		d_plg = plg;
	}

	public String getDaftarPlg(){
		return d_plg;
	}

	public void setDaftarBayar(String byr){
		d_bayar = byr;
	}

	public String getDaftarBayar(){
		return d_bayar;
	}

	public void setDaftarJumlahBayar(String byr){
		d_jumlah = byr;
	}

	public String getDaftarJumlahBayar(){
		return d_jumlah;
	}
}

Dan ini file terakhir, adalah file BaseAdapter yang digunakan untuk membaca data dari database kemudian ditampilkan ke dalam listview yang sudah kita design pada file layout_daftar.xml tersebut diatas.

package com.wjc.penagihan;

import java.util.ArrayList;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;

public class MyAdapter extends BaseAdapter {
	private static ArrayList<Penagihan> daftarPenagihan;
	private LayoutInflater myInflater;

	public MyAdapter(Context context, ArrayList<Penagihan> results) {
		daftarPenagihan = results;
		myInflater = LayoutInflater.from(context);
	}

	public int getCount() {
		return daftarPenagihan.size();
	}

	public Object getItem(int arg0) {
		return daftarPenagihan.get(arg0);
	}

	public long getItemId(int arg0) {
		return arg0;
	}

	public View getView(int position, View convertView, ViewGroup parent) {
		ViewHolder holder;
		if(convertView == null) {
			convertView = myInflater.inflate(R.layout.layout_daftar, null);
			holder = new ViewHolder();
			holder.txtName = (TextView) convertView.findViewById(R.id.tv_nama);
			holder.txtDetails = (TextView) convertView.findViewById(R.id.tv_detail);
			convertView.setTag(holder);
		}else{
			holder = (ViewHolder) convertView.getTag();
		}

		holder.txtName.setText(daftarPenagihan.get(position).getDaftarPlg());
		String detil = "Rp "+daftarPenagihan.get(position).getDaftarJumlahBayar()+", "+daftarPenagihan.get(position).getDaftarBayar();
		holder.txtDetails.setText(detil);
		return convertView;
	}

	static class ViewHolder {
		TextView txtName;
		TextView txtDetails;
	}
}

Sekian terima kasih🙂, semoga sukses dan selamat mencoba. Jika ingin mendownload contoh project ini yang sudah jadi, silahkan download di sini (Contoh Custom ListView Android Multiline Dengan Database)

19 thoughts on “Membuat Custom ListView Android Dengan Data Item Yang Diambil Dari Database SQLite

  1. mas, aku sudah dwnld Contoh Custom ListView Android Multiline Dengan Database apk, tapi username dan password untuk login apa ya mas? maaf baru belajar android. thanks

  2. kak,,, tanya dunk,,,
    kalau mau masukkin data file suara di sqlite caranya gmana yaa??
    biar bisa dipanggil lewat listview,,, masukkkin data ke tabelnya gak ngerti kak,,, mohon bimbingannya kak,,, makasih

  3. gan.. gmna caranya wktu kita buat file apk nya dr cth diatas.. file database jg inculde otomatis ??

    soalnya waktu saya coba di hp, dy lgsg force close.. mgkin krna db nya nda terinclude.. tapi klo di emulator mulus aja gan..

    mohon pencerahannya gan ^_^

  4. permisi numpang nanya mengenai listview
    pertama tama saya ingin memberikan gambaran latihan yang saya bikin, saya membuat sebuah aplikasi yaitu pengenalan angka kepada balita pada tablet PC, disini saya menempatkan icon angka 0-9 ke folder drawable dan telah dapat ditampilkan di listview datagrid,
    yang ingin saya tanyakan bagaimana cara menampilkan nama file yang ada di folder drawable ketika salah satu angka kepencet pada saat memilih. terima kasih sebelumnya
    P.S. : barusan pertama kali megang jadi maaf klq ada kesalah pahaman.

Mari Berdiskusi Bersama

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s