Tutorial Custom ListView Android

membuat listview sederhana memang gampang, cukup sebuah array data dan simplelistadapter,maka listview sudah tampil. kenyataan dilapangan, simple listview sangat jarang dipakai, terutama untuk aplikasi komersial dan populer. Kita perhatikan Aplikasi GMail, Contact,Facebook, Twitter dan lainnya, mereka memanfaatkan listview amun listviewnya sudah di custom sehingga tampilannya bagus.

Dalam tutorial kali ini, kita akan meneruskan membuat custom listview yang lebih kompleks daripada hanya menampilkan ikon disisi kiri listview. Kasus yang akan kita buat adalah menampilkan listview negara dengan 4 format data dalam setiap item. 4 data itu adalah bendera, nama negara, nama ibukota negara dan jumlah penduduk. Gambarannya seperti apa? lihat gambar berikut ini.

File yang dibutuhkan

Untuk membuat listview seperti ini, kita membutuhkan 5 file utama yaitu

1. Country.java, merupakan model data untuk listview
2. CountryAdapter.java merupakan ‘pengikat’ antara model dengan view,dalam bahasa lain bisa juga disebut dengan controller.
3. CountryActivity.java yang merupakan view dari listview itu sendiri.
4. country_row.xml , berisi pola layout untuk satu item negara
5. country_activity.xml , berisi layout utama yang akan dipanggil oleh CountryActivity
6. File gambar icon bendera masing masing negara yang akan ditampilkan. letakan di folder drawable.

   Jika kita perhatikan, model ini sering juga disebut dnegan MVC. Bagi yang terbiasa dengan MVC, insyaAllah akan mudah mengikutinya.

   Country.java

   Model data dari listview, berisi deklarasi field, construktor serta geter setternya. Berikut ini adalah potongan dari file Country.java

   public class Country {
   	private Bitmap flagIcon;
   
   	private String nama;
   	private String ibukota;
   	private String jumlahPenduduk;
   	
   	public Country(Bitmap fi, String n, String i, String jp) {
   		flagIcon = fi;
   		nama = n;
   		ibukota = i;
   		jumlahPenduduk = jp;
   	}
   ...
   ...
   ...
   }
   

   File CountryAdapter

   package com.candralab.listview;
   
   import java.util.List;
   
   import android.content.Context;
   import android.view.LayoutInflater;
   import android.view.View;
   import android.view.ViewGroup;
   import android.widget.BaseAdapter;
   import android.widget.ImageView;
   import android.widget.TextView;
   
   public class CountryAdapter extends BaseAdapter {
   	private Context mContext;
   	private List<Country> mListInfo;
   
   	public CountryAdapter(Context context, List<Country> list) {
   		mContext = context;
   		mListInfo = list;
   
   	}
   
   	@Override
   	public int getCount() {
   		return mListInfo.size();
   	}
   
   	@Override
   	public Object getItem(int pos) {
   		return mListInfo.get(pos);
   	}
   
   	@Override
   	public long getItemId(int pos) {
   		return pos;
   	}
   
   	@Override
   	public View getView(int pos, View convertView, ViewGroup parent) {
   		// get selected entry
   		Country entry = mListInfo.get(pos);
   
   		// inflating list view layout if null
   		if (convertView == null) {
   			LayoutInflater inflater = LayoutInflater.from(mContext);
   			convertView = inflater.inflate(R.layout.country_row, null);
   		}
   		// set image icon
   		ImageView imgIcon = (ImageView) convertView.findViewById(R.id.imgIcon);
   		imgIcon.setImageBitmap(entry.getFlagIcon());
   
   		// set nama
   		TextView tvName = (TextView) convertView.findViewById(R.id.tvNama);
   		tvName.setText(entry.getNama());
   
   		TextView tvPhone = (TextView) convertView.findViewById(R.id.tvIbukota);
   		tvPhone.setText(entry.getIbukota());
   
   		TextView tvJumlahPenduduk = (TextView) convertView
   				.findViewById(R.id.tvJumlahPenduduk);
   		tvJumlahPenduduk.setText(entry.getJumlahPenduduk());
   
   		return convertView;
   	}
   
   }
   

   CountryActivity

   potongan code di fungsi onCreate

   setContentView(R.layout.country_activity);
   
   		lvcountry = (ListView) findViewById(R.id.listCountry);
   
   		List<Country> lsCountry = new ArrayList<Country>();
   
   		lsCountry
   				.add(new Country(BitmapFactory.decodeResource(getResources(),
   						R.drawable.indonesia), "Indonesia", "Jakarta",
   						"246 juta jiwa "));
   		lsCountry.add(new Country(BitmapFactory.decodeResource(getResources(),
   				R.drawable.saudi), "Saudi Arabia ", "Riyadh", "28 juta jiwa"));
   
   ....
   ....
   

   Download

   Karena kodenya panjang,maka saya hanya mengambil potongan kode kode inti disetiap file. Jika anda ingin mencoba sendiri,silahkan download source code lengkapnya di sini.