ListView with images android.

We want to create a Listview with different images, like football match table.

Create a class with file xml like this

<?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:background="#ffffff"

    android:orientation="vertical" >

<ListView

        android:id="@+id/list"

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        android:layout_marginTop="2dp"      

        android:dividerHeight="1px"

        android:lineSpacingExtra="-8dp"

        android:singleLine="true"

        android:textColor="#00F" >

    </ListView>

</LinearLayout>

Create an xml file name lit.xml

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

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

    xmlns:ads="http://schemas.android.com/apk/res-auto"

    android:layout_width="match_parent"

    android:layout_height="45sp"

    android:orientation="horizontal" >

    <ImageView

        android:id="@+id/im"

        android:layout_width="0dp"

        android:layout_height="45sp"

        android:layout_marginLeft="1dp"

        android:layout_weight="0.9"

        android:contentDescription="@null"

         />

    <TextView

        android:id="@+id/text1"

        android:layout_width="0dp"

        android:layout_height="fill_parent"

        android:layout_weight="2"

        android:gravity="left|center_vertical"

        android:textColor="#0000aa"

        android:textSize="15sp" />

    <TextView

        android:id="@+id/text2"

        android:layout_width="0dp"

        android:layout_height="45sp"

        android:layout_weight="2"

        android:gravity="center"

        android:textColor="#0000aa"

        android:textSize="15sp" />

    <TextView

        android:id="@+id/text3"

        android:layout_width="0dp"

        android:layout_height="fill_parent"

        android:layout_weight="2"

        android:gravity="right|center_vertical"

        android:textColor="#0000aa"

        android:textSize="15sp" />

    <ImageView

        android:id="@+id/im2"

        android:layout_width="0dp"

        android:layout_height="45sp"

        android:layout_marginRight="1dp"

        android:layout_weight="0.9"

        android:contentDescription="@null" />

</LinearLayout>

Create another class name customadapter.

public class customadapter extends ArrayAdapter<String> {    

          private final Activity context;         

          private final Integer[] imgid;

          private final Integer[] imgid2;

          private final String[]  item;

          private final String[]  item2;

          private final String[]  item3;

          public customadapter(Activity context, String[] item, String[] item2, String[] item3, Integer[] imgid,Integer[] imgid2) {

               super(context,R.layout.lit,item);

               // TODO Auto-generated constructor stub           

               this.context=context;

               this.item=item;

               this.item2=item2;

               this.item3=item3;

               this.imgid=imgid;

               this.imgid2=imgid2;

          }        

          @SuppressLint({ "ViewHolder", "InflateParams" })

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

               LayoutInflater inflater=context.getLayoutInflater();

View rowView=inflater.inflate(R.layout.lit, null,true);

              

TextView txtTitle = (TextView) rowView.findViewById(R.id.text1);

TextView txtTitle2 = (TextView) rowView.findViewById(R.id.text2);

TextView txtTitle3 = (TextView) rowView.findViewById(R.id.text3);

ImageView imageView = (ImageView) rowView.findViewById(R.id.im);       

ImageView imageView2 = (ImageView) rowView.findViewById(R.id.im2);          

txtTitle.setText(item[position]);

txtTitle2.setText(item2[position]);

txtTitle3.setText(item3[position]);

imageView.setImageResource(imgid[position]);

imageView2.setImageResource(imgid2[position]);          

     return rowView;          

          };

     }

Import libraries.

Copy images you want to use to folder drawable below res folder.

In class to present listView, declare adapter, arrays to above Override.

ListView lv;

private ArrayAdapter<String> adapter;

     String[] ten = { "France", "Albania", "Romania", "France", "Switzerland", "Romania" };

     String[] ten2 = { "Romania", "Switzerland", "Switzerland", "Albania",

               "France", "Albania" };

     String[] kq = { "1-0", "2-1", "2-3", "3-3", "1-4", "3-2" };

     Integer[] mg = new Integer[] { R.drawable.phap, R.drawable.anba,

               R.drawable.roma, R.drawable.phap, R.drawable.thuysi,

               R.drawable.roma };

     Integer[] mg2 = new Integer[] { R.drawable.roma, R.drawable.thuysi,

               R.drawable.thuysi, R.drawable.anba, R.drawable.phap,

               R.drawable.anba };

Add address, create Listview with adapter from class customadapter.

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

lv.setChoiceMode(ListView.CHOICE_MODE_SINGLE);

     adapter= new customadapter(this,ten,kq,ten2,mg,mg2);

         

     lv.setOnItemClickListener(new OnItemClickListener() {

               @Override

     public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,

                          long arg3) {

                     // int sodong = arg2;

                     //dem = 1;

               }

          });

          lv.setAdapter(adapter);

Run to see the result.