How to add image in expandable List in parent in android?

Working with SimpleExpandableListAdapter is anything but simple. Here's some code that should get you started, assuming that you're using ExpandableListActivity.

In this example, we use the standard android.R.layout.simple_expandable_list_item_1 for our group header view, but we use our own custom layout for the children.

    // Construct Expandable List    final String NAME = "name";    final String IMAGE = "image";    final LayoutInflater layoutInflater = (LayoutInflater) this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);    final ArrayList<HashMap<String, String>> headerData = new ArrayList<HashMap<String, String>>();    final HashMap<String, String> group1 = new HashMap<String, String>();    group1.put(NAME, "Group 1");    headerData.add( group1 );    final HashMap<String, String> group2 = new HashMap<String, String>();    group2.put(NAME, "Group 2");    headerData.add( group2);    final ArrayList<ArrayList<HashMap<String, Object>>> childData = new ArrayList<ArrayList<HashMap<String, Object>>>();    final ArrayList<HashMap<String, Object>> group1data = new ArrayList<HashMap<String, Object>>();    childData.add(group1data);    final ArrayList<HashMap<String, Object>> group2data = new ArrayList<HashMap<String, Object>>();    childData.add(group2data);    // Set up some sample data in both groups    for( int i=0; i<10; ++i) {        final HashMap<String, Object> map = new HashMap<String,Object>();        map.put(NAME, "Child " + i );        map.put(IMAGE, getResources().getDrawable(R.drawable.icon));        ( i%2==0 ? group1data : group2data ).add(map);    }    setListAdapter( new SimpleExpandableListAdapter(            this,            headerData,            android.R.layout.simple_expandable_list_item_1,            new String[] { NAME },            // the name of the field data            new int[] { android.R.id.text1 }, // the text field to populate with the field data            childData,            0,            null,            new int[] {}        ) {            @Override            public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {                final View v = super.getChildView(groupPosition, childPosition, isLastChild, convertView, parent);                // Populate your custom view here                ((TextView)v.findViewById(R.id.name)).setText( (String) ((Map<String,Object>)getChild(groupPosition, childPosition)).get(NAME) );                ((ImageView)v.findViewById(R.id.image)).setImageDrawable( (Drawable) ((Map<String,Object>)getChild(groupPosition, childPosition)).get(IMAGE) );                return v;            }            @Override            public View newChildView(boolean isLastChild, ViewGroup parent) {                 return layoutInflater.inflate(R.layout.expandable_list_item_with_image, null, false);            }        }    );

And inside your custom child layout, named expandable_list_item_with_image.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="wrap_content">    <ImageView        android:id="@+id/image"        android:layout_width="wrap_content"        android:layout_height="wrap_content" />    <TextView        android:id="@+id/name"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="right" /></RelativeLayout>

You can try making your own list adapter that extends BaseExpandableListAdapter just like described in documentation.

Then override getGroupView(..) (for parent item, or getChildView for child item) function and in this function you can inflate your own layout xml.

something like this:

public View getGroupView(int groupPosition, boolean isExpanded, View convertView,            ViewGroup parent)         {            View v = convertView;            if (v == null) {    //sender is activity from where you call this adapter. Set it with construktor.                LayoutInflater vi = (LayoutInflater)sender.getSystemService(Context.LAYOUT_INFLATER_SERVICE);                 v = vi.inflate(R.layout.row, null);            }//children = arraylists of Child             Child c = children.get(childPosition);            if (c != null) {                    TextView tt = (TextView) v.findViewById(R.id.toptext);                    TextView bt = (TextView) v.findViewById(R.id.bottomtext);                    ImageView icon = (ImageView) v.findViewById(R.id.rowicon);                    if (tt != null) {                          tt.setText(c.text1);                            }                    if(bt != null){                          bt.setText(c.text2);                    }                    if (icon != null)                     {                        icon.setImageResource(R.drawable.rowicon);                    }            }            return v;        }

layout xml :

<?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="?android:attr/listPreferredItemHeight"    android:padding="6dip">    <ImageView        android:id="@+id/rowicon"        android:layout_width="wrap_content"        android:layout_height="fill_parent"        android:layout_marginRight="6dip" />    <LinearLayout        android:orientation="vertical"        android:layout_width="0dip"        android:layout_weight="1"        android:layout_height="fill_parent">        <TextView            android:id="@+id/toptext"            android:layout_width="fill_parent"            android:layout_height="0dip"            android:layout_weight="1"            android:gravity="center_vertical"        />        <TextView            android:layout_width="fill_parent"            android:layout_height="0dip"            android:layout_weight="1"             android:id="@+id/bottomtext"            android:singleLine="true"            android:ellipsize="marquee"        />    </LinearLayout></LinearLayout>

After you override getGroupView, you can use setCompoundDrawablesWithIntrinsicBounds function to add image.

@Overridepublic View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {  View v = super.getGroupView(groupPosition, isExpanded, convertView, parent);  TextView tv = (TextView) v.findViewById(R.id.textViewId);  tv.setCompoundDrawablesWithIntrinsicBounds(R.drawable.imageToAdd, 0, 0, 0);  return v;}