Listview Bergambar (Image Listview) dengan Intent

Kali ini ane mau buat tutorial Listview dengan gambar tapi bisa intent ke class java yg lain kalo d pilih (tanpa database),,,,

kalau2 ente mau bikin listview image dengan database SQLite, coba deh pake tutorial DISINI....

Begini nih tutorialnya,,,

1. Buat project di eclipse atau pake project yg udah ada,,,
2. Buat folder drawable di res dan masukkan gambarnya (buat ada gambar d listviewnya)...
3. Buat listmenu2.xml yg isinya :

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

    android:layout_marginTop="5dp">

    <ListView

        android:id="@+id/list"

        android:layout_marginTop="10dp"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:headerDividersEnabled="true"

        android:divider="#ff00ff"

        android:dividerHeight="2dp"

     />

   </LinearLayout>

4. Buat list_item.xml :

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent" >

    <ImageView

        android:id="@+id/icon"

        android:layout_width="80dp"

        android:layout_height="80dp"

        android:contentDescription="@string/image"

        android:paddingLeft="10dp"

        android:paddingRight="10dp" />

    <TextView

        android:id="@+id/title"

        android:paddingTop="10dp"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_toRightOf="@+id/icon"

        android:paddingBottom="10dp"

        android:textColor="#CC0033"

        android:textSize="16dp" />

    <TextView

        android:id="@+id/desc"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_below="@+id/title"

        android:layout_toRightOf="@+id/icon"

        android:textColor="#3399FF"

        android:textSize="14dp" />

</RelativeLayout>

Pada 'android:contentDescription="@string/image' bila error tambahkan kode :

 <string name="image">image</string>

5. MainActivity.java di isikan :

package com.com.listimage1;

import java.util.ArrayList;

import java.util.List;

import android.app.Activity;

import android.content.Intent;

import android.os.Bundle;

import android.view.View;

import android.widget.AdapterView;

import android.widget.AdapterView.OnItemClickListener;

import android.widget.ListView;


public class MainActivity extends Activity implements OnItemClickListener {

    public static final String[] titles = new String[] { "Jeruk",

            "Pisang"};

    public static final String[] descriptions = new String[] {

            "Jeruk Mandarin", "Pisang Sunpriset"};

    public static final Integer[] images = { R.drawable.jeruk, R.drawable.banana};

    ListView listView;

    List<RowItem> rowItems;

  
    /** Called when the activity is first created. */

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.listmenu2);



        rowItems = new ArrayList<RowItem>();

        for (int i = 0; i < titles.length; i++) {

            RowItem item = new RowItem(images[i], titles[i], descriptions[i]);

            rowItems.add(item);

        }

        listView = (ListView) findViewById(R.id.list);

        CustomListViewAdapter adapter = new CustomListViewAdapter(this,

                R.layout.list_item, rowItems);

        listView.setAdapter(adapter);

        listView.setOnItemClickListener(this);

   }

    @Override

    public void onItemClick(AdapterView<?> arg0, View v, int position, long arg3) {

     //variable position merupakan variabel urutan dalam listview yg tampil (mulai dr 0)

     if(position == 0){

      Intent i = new Intent(MainActivity.this, Satu.class);

         startActivity(i);

     }else if(position == 1){

         Intent i = new Intent(MainActivity.this, Dua.class);

         startActivity(i);

     }

     }
}

Image disesuaikan sesuai gambar yg ada di folder drawable..
Intent disesuaikan dengan yg mau d panggil classnya yah.....dalam kasus ini ane manggil Satu.class dan Dua.class

6. Buat RowItem.java :

package com.com.listimage1;

public class RowItem {

    private int imageId;

    private String title;

    private String desc;

    public RowItem(int imageId, String title, String desc) {

        this.imageId = imageId;

        this.title = title;

        this.desc = desc;

    }

    public int getImageId() {

        return imageId;

    }

    public void setImageId(int imageId) {

        this.imageId = imageId;

    }

    public String getDesc() {

        return desc;

    }

    public void setDesc(String desc) {

        this.desc = desc;

    }

    public String getTitle() {

        return title;

    }

    public void setTitle(String title) {

        this.title = title;

    }

    @Override

    public String toString() {

        return title + "\n" + desc;

    }

}

7. Dan CustomListView.java :

package com.com.listimage1;

import java.util.List;

import android.app.Activity;

import android.content.Context;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.ArrayAdapter;

import android.widget.ImageView;

import android.widget.TextView;



public class CustomListViewAdapter extends ArrayAdapter<RowItem> {



    Context context;



    public CustomListViewAdapter(Context context, int resourceId,

            List<RowItem> items) {

        super(context, resourceId, items);

        this.context = context;

    }



    /*private view holder class*/

    private class ViewHolder {

        ImageView imageView;

        TextView txtTitle;

        TextView txtDesc;

    }



    public View getView(int position, View convertView, ViewGroup parent) {

        ViewHolder holder = null;

        RowItem rowItem = getItem(position);



        LayoutInflater mInflater = (LayoutInflater) context

                .getSystemService(Activity.LAYOUT_INFLATER_SERVICE);

        if (convertView == null) {

            convertView = mInflater.inflate(R.layout.list_item, null);

            holder = new ViewHolder();

            holder.txtDesc = (TextView) convertView.findViewById(R.id.desc);

            holder.txtTitle = (TextView) convertView.findViewById(R.id.title);

            holder.imageView = (ImageView) convertView.findViewById(R.id.icon);

            convertView.setTag(holder);

        } else

            holder = (ViewHolder) convertView.getTag();



        holder.txtDesc.setText(rowItem.getDesc());

        holder.txtTitle.setText(rowItem.getTitle());

        holder.imageView.setImageResource(rowItem.getImageId());



        return convertView;

    }

}

Mantep gak tuh,,,,,

oiya jangan lupa tambahin deklarasi class di AndroidManifest.xml.....

Kalo g jalan, download aja projectnya langsung d sini...
(cara dpt passwordnya kirim email ke dimazmarham19@gmail.com)

kalo udah d import ke eclipse trus ada error d projectnya, coba buat project baru dan copas isi file xml sama java sesuai dengan project yg d download d sini,,,

Read More