Pada artikel kali ini saya akan menunjukkan bagaimana Cara Buat Custom ListView Di Aide.

Sebelumnya kita telah membahas Cara Buat ViewPager Di Aide

Membuat Custom ListView di aide tidak terlalu sulit seperti membuat WebView di aide.
Mari kita menuju ke Tutornya..

Buat Custom ListView Di Aide

1. Buatlah Project seperti di bawah ini
- Name: ListView
- Package Name: com.alfiyt.ListView

2. Buka folder ListView/app/src/res/layout kemudian buka file main.xml lalu tambahkan code di bawah ini

<?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:gravity="center"
android:orientation="vertical">

<TextView
android:textSize="15.0dip"
android:typeface="serif"
android:textStyle="bold|italic"
android:textColor="#ff00ffff"
android:ellipsize="marquee"
android:gravity="center"
android:focusable="true"
android:focusableInTouchMode="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="ListView By ALFI YT ➖ www.alfi-yt.com"
android:scrollHorizontally="true"
android:singleLine="true"
android:shadowDx="3.0"
android:shadowDy="2.0"
android:shadowRadius="1.0"
android:freezesText="false"
android:layout_alignParentTop="true"
android:marqueeRepeatLimit="marquee_forever"
android:background="@drawable/bg"/>

<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/list"
android:background="@drawable/bg"/>

</LinearLayout>

3. Masih dalam folder layout, buat file baru dengan nama List.xml lalu masukkan kode 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="wrap_content"
android:orientation="horizontal"
android:padding="10dp"
android:layout_gravity="center_vertical">

<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:id="@+id/image"
android:layout_gravity="center_vertical"/>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="10dp"
android:orientation="vertical">

<TextView
android:layout_height="wrap_content"

android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_width="wrap_content"
android:id="@+id/jdl"
android:textColor="#FF0F00"
android:textStyle="bold"/>

<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:id="@+id/des"
android:textColor="#00C7F9"/>

</LinearLayout>

</LinearLayout>

4. Pindah ke folder ListView /app/src/java kemudian buat file atau class baru dengan nama Item.java lalu tambahkan kode di bawah ini

package com.alfiyt.ListView;

import android.graphics.drawable.*;

public class Item
{
private String stringUtama;
private String stringKecil;
private Drawable gambar;

public void setStringUtama(String stringUtama)
{
this.stringUtama = stringUtama;
}

public String getStringUtama()
{
return stringUtama;
}

public void setStringKecil(String stringKecil)
{
this.stringKecil = stringKecil;
}

public String getStringKecil()
{
return stringKecil;
}


public void setGambar(Drawable gambar)
{
this.gambar = gambar;
}

public Drawable getGambar()
{
return gambar;
}}

5. Kemudian buat file / class lagi lalu namai dengan nama Adapter.java

package com.trikkeren.ListView;

import android.content.*;
import android.view.*;
import android.widget.*;
import java.util.*;

public class Adapter extends BaseAdapter
{

private ArrayList listKu;
private LayoutInflater layoutInflaterKu;

public Adapter(Context c, ArrayList list)
{
this.listKu = list;
this.layoutInflaterKu = LayoutInflater.from(c);
}

@Override
public int getCount()
{
return listKu.size();
}

@Override
public Object getItem(int posisi)
{
return listKu.get(posisi);
}

@Override
public long getItemId(int posisi)
{
return posisi;
}

private static class PenampungView
{
TextView textUtama;
TextView textKecil;
ImageView imageIkon;
}

@Override
public View getView(int posisi, View view, ViewGroup p3)
{
PenampungView penampung;
if (view == null)
{
view = layoutInflaterKu.inflate(R.layout.list, p3, false);
penampung = new PenampungView();
penampung.textUtama = (TextView)view.findViewById(R.id.jdl);
penampung.textKecil = (TextView)view.findViewById(R.id.des);
penampung.imageIkon = (ImageView)view.findViewById(R.id.image);
view.setTag(penampung);
}
else
{
penampung = (PenampungView)view.getTag();
}

penampung.textUtama.setText(listKu.get(posisi).getStringUtama());
penampung.textKecil.setText(listKu.get(posisi).getStringKecil());
penampung.imageIkon.setImageDrawable(listKu.get(posisi).getGambar());

return view;
}

}

6. Edit MainActivity.java hapus kode yang ada lalu tambahkan kode di bawah ini

package com.trikkeren.ListView;

import android.app.*;
import android.os.*;
import java.util.*;
import android.widget.*;
import android.graphics.drawable.*;

public class MainActivity extends Activity
{
private ListView listView;
private ArrayList listData;
private Adapter ap;

@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
listView = (ListView)findViewById(R.id.list);
listData=new ArrayList();
ap = new Adapter(this, listData);
listView.setAdapter(ap);

testingSetUpListData();
}

private void testingSetUpListData()
{
String[] Judul={"Shaun The Sheep","Doraemon","Bilu Mela","Upin & Ipin","ALFI YT"};
String[] Deskripsi={"Domba","Kucing","Ikan","Orang","trikkerenn.blogspot.com"};

Item item;
Drawable gambar=getResources().getDrawable(R.drawable.ic_launcher);
for (int i=0;i < Judul.length;i++)
{
item = new Item();
item.setGambar(gambar);
item.setStringUtama(Judul[i]);
item.setStringKecil(Deskripsi[i]);
listData.add(item);
}

ap.notifyDataSetChanged();
}
}

7. Pindah ke folder ListView/app/src/res/drawable-hdpi kemudian tambahkan file baru lalu beri nama bg.xml file ini adalah background, tambahkan code di bawah ini di dalam file bg.xml

<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="9.0dip" />
<padding android:left="3.0dip" android:top="4.0dip" android:right="3.0dip" android:bottom="4.0dip" />
<stroke android:width="1.0dip" android:color="#ff00ffff" />
</shape>

Akhir Kata

Itulah Cara Buat Custom ListView Di Aide. Cukup mudah bukan? Jika kamu masih belum paham silahkan komen di kolom komentar

Berlangganan artikel terbaru dari blog ini langsung via email.

Cara Buat Custom ListView di Aide

Buat Custom ListView Di Aide

Akhir Kata