ListView using SimpleAdapter in Android

In this blog post, I would like explain how to populate ListView using SimplaAdapter.

1. Create a new project File -> Android Project. While creating a new project give activity name as MainActivity.java and copy this code:

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        ListView lv= (ListView)findViewById(R.id.listview);

        // create the grid item mapping
        String[] col_value = new String[] {"col_1", "col_2"};
        int[] col_id = new int[] { R.id.item1, R.id.item2 };
        String[] col_1_values = getResources().getStringArray(R.array.Mobile_OS);
        String[] col_2_values = getResources().getStringArray(R.array.Mobile_OS_Company);

        // prepare the list of all records
        List<HashMap<String, String>> fillMaps = new ArrayList<HashMap<String, String>>();
        for(int i = 0; i < 5; i++){
            HashMap<String, String> map = new HashMap<String, String>();

            map.put("col_1", col_1_values[i]);
            map.put("col_2", col_2_values[i]);

            fillMaps.add(map);
        }

        // fill in the grid_item layout
        SimpleAdapter adapter = new SimpleAdapter(this, fillMaps, R.layout.grid_item, col_value, col_id);
        lv.setAdapter(adapter);
        lv.setOnItemClickListener(new OnItemClickListener(){

            @Override
            public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
                        long arg3) {
                  // TODO Auto-generated method stub
                  ListView lv = (ListView) arg0;
                   TextView fishtextview=(TextView)arg0.getChildAt(arg2-lv.getFirstVisiblePosition()).findViewById(R.id.item1);
                   String fieldname = fishtextview.getText().toString();
                   Toast mtost=Toast.makeText(getApplicationContext(),fieldname, Toast.LENGTH_SHORT);
                   mtost.show();
            }

		});
    }
}

2. Now open your main.xml layout and copy this code:

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

    <!-- List Divider -->
    <View android:layout_width="fill_parent"
        android:layout_height="1dip"
        android:background="?android:attr/listDivider" />

    <!-- ListView (grid_items) -->
    <LinearLayout android:id="@+id/layout"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent">
        <ListView android:id="@+id/listview"
            android:layout_height="fill_parent"
            android:layout_width="fill_parent">
        </ListView>
    </LinearLayout>
</LinearLayout>

3. Now open your grid.xml layout and copy this code:

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

        <TextView android:id="@+id/item1"
            android:text="col_1"
            android:layout_height="fill_parent"
            android:layout_width="wrap_content"
            android:width="100dip"
        />
        <TextView android:id="@+id/item2"
            android:text="col_2"
            android:layout_height="fill_parent"
            android:layout_width="wrap_content"
            android:width="100dip"
        />

</LinearLayout>

4. now array.xml file in res/values folder and copy this code:

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

<string-array
name="Mobile_OS">
<item>Android</item>
<item>IOS</item>
<item>Windows</item>
<item>Bada</item>
<item>Firefox</item>
</string-array>

<string-array
name="Mobile_OS_Company">
<item>Google</item>
<item>iPhone</item>
<item>Microsoft</item>
<item>Samsung</item>
<item>Mozilla</item>
</string-array>

</resources>

Tips to Remember always:

1) I have retrieved array values from array.xml file into the String Array.(On line no: 21 & 22)

String[] col_1_values = getResources().getStringArray(R.array.Mobile_OS);
String[] col_2_values = getResources().getStringArray(R.array.Mobile_OS_Company);

2) You can also use Images instead of text. For Example change these values:

String[] col_1_values = getResources().getStringArray(R.array.Mobile_OS);
String[] col_2_values = getResources().getStringArray(R.array.Mobile_OS_Company);

to

int[] col_1_values = new int[] {R.drawable.android, R.drawable.ios, R.drawable.windows, R.drawable.bada, R.drawable.firefox};
String[] col_2_values = getResources().getStringArray(R.array.Mobile_OS);

On Line no 30 change like this:

map.put("col_1", Integer.toString(col_1_values[i]));

Now, on grid.xml change TextView to ImageView on Line no: (7 – 12) to:

<ImageView
            android:id="@+id/item2"
            android:layout_width="60dp"
            android:layout_height="wrap_content"
            android:width="100dip"
            android:clickable="false"
            android:duplicateParentState="false"
            android:scaleType="fitXY"
             />

Complete Sourcecode for ListView with ImageView using SimpleAdapter:

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        ListView lv= (ListView)findViewById(R.id.listview);

        // create the grid item mapping
        String[] col_value = new String[] {"col_1", "col_2"};
        int[] col_id = new int[] { R.id.item1, R.id.item2 };
        String[] col_2_values = getResources().getStringArray(R.array.Mobile_OS);
        int[] col_1_values = new int[] {R.drawable.android, R.drawable.ios, R.drawable.windows, R.drawable.bada, R.drawable.firefox};

        // prepare the list of all records
        List<HashMap<String, String>> fillMaps = new ArrayList<HashMap<String, String>>();
        for(int i = 0; i < 5; i++){
            HashMap<String, String> map = new HashMap<String, String>();

            map.put("col_2", col_2_values[i]);
            map.put("col_1", Integer.toString(col_1_values[i]));

            fillMaps.add(map);
        }

        // fill in the grid_item layout
        SimpleAdapter adapter = new SimpleAdapter(this, fillMaps, R.layout.grid_item, col_value, col_id);
        lv.setAdapter(adapter);

        lv.setOnItemClickListener(new OnItemClickListener(){

            @Override
            public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
                        long arg3) {
                  // TODO Auto-generated method stub
                  ListView lv = (ListView) arg0;
                   TextView fishtextview=(TextView)arg0.getChildAt(arg2-lv.getFirstVisiblePosition()).findViewById(R.id.item2);
                   String fieldname = fishtextview.getText().toString();
                   Toast mtost=Toast.makeText(getApplicationContext(),fieldname, Toast.LENGTH_SHORT);
                   mtost.show();
            }

		});
    }
}

now grid.xml file:

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

        <ImageView
        android:id="@+id/item1"
        android:layout_width="60dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:clickable="false"
        android:duplicateParentState="false"
        android:scaleType="fitXY"/>

        <TextView android:id="@+id/item2"
            android:text="col_2"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:width="100dip"
            android:layout_weight="1"
        />

</LinearLayout>

and main.xml file has no change in it.

Screenshot:Screenshot_2014-06-24-17-19-43Screenshot_2014 06 24 17 15 50

Hope this helpful. Your valuable comments are always welcomed. It will help to improve my post and understanding.

durga chiranjeevi

durga chiranjeevi

I'm currently working as Android developer at Energy Alternatives India. Interested in Application and Game development.
durga chiranjeevi

Leave a Reply

Your email address will not be published. Required fields are marked *