If your application has to display data in groups that each has its members or children, ExpandableList meets your requirement. You can create two levels of lists. The first level is the groups and the second level is members. You define the ExpandableList in xml file using <ExpandableList> tag.

Now to have an example of ExpandableList application, you create a new project in Android Studio. Then in the activity_main.xml file, you define an ExpandableList.

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

    <ExpandableListView

        android:id="@+id/expList"

        android:layout_height="match_parent"

        android:layout_width="match_parent"

        />

</LinearLayout>

List groups and members need their own layout files to display data. In the res/layout directory, you create two xml files: list_group, and list_member.

list_group.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= "wrap_content"

    android:orientation="horizontal"

    android:padding="8dp"

    android:background="#ffdbdbdb">

    <TextView

        android:id="@+id/txtgheader"

        android:layout_width= "wrap_content"

        android:layout_height= "wrap_content"

        android:paddingLeft= "?android:attr/expandableListPreferredItemPaddingLeft"

        android:textSize="17sp"

        android:textColor="#ff808021" />

</LinearLayout>

list_member.xml

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

    android:orientation="vertical" >

    <TextView

        android:id="@+id/txtmember"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:textSize="15sp"

        android:paddingTop="5dp"

        android:paddingBottom="5dp"

        android:paddingLeft="?android:attr/expandableListPreferredChildPaddingLeft" />

</LinearLayout>

In the src directory, you create class called ExpandableListAdapter that extends the BaseExpandableListAdapter class. Its constructor has three parameters that allow you to pass a Context object, a list that contains group data, and a MashMap that contains member data mapping to its group. An instance of the ExpandableListAdapter is used to supply group and member data to the expandable list.

import java.util.HashMap;

import java.util.List;

import android.content.Context;

import android.graphics.Typeface;

import android.text.Html;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.BaseExpandableListAdapter;

import android.widget.TextView;

public class ExpandableListAdapter extends BaseExpandableListAdapter {

    private Context _context;

    private List<String> _listGroupTitle; // header titles

    private HashMap<String, List<String>> _listDataMembers;

    public ExpandableListAdapter(Context context, List<String> listGroupTitle,

                                 HashMap<String, List<String>> listDataMembers) {

        this._context = context;

        this._listGroupTitle = listGroupTitle;

        this._listDataMembers = listDataMembers;

    }

    @Override

    public Object getChild(int groupPosition, int childPosititon) {

        return this._listDataMembers.get(this._listGroupTitle.get(groupPosition))

                .get(childPosititon);

    }

    @Override

    public long getChildId(int groupPosition, int childPosition) {

        return childPosition;

    }

    @Override

    public View getChildView(int groupPosition, final int childPosition,

                             boolean isLastChild, View convertView, ViewGroup parent) {

        final String memberText = (String) getChild(groupPosition, childPosition);

        if (convertView == null) {

            LayoutInflater infalInflater = (LayoutInflater) this._context

                    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

            convertView = infalInflater.inflate(R.layout.list_member, null);

        }

        TextView txtMember = (TextView) convertView

                .findViewById(R.id.txtmember);

        txtMember.setText(memberText);

        return convertView;

    }

    @Override

    public int getChildrenCount(int groupPosition) {

        return this._listDataMembers.get(this._listGroupTitle.get(groupPosition)).size();

    }

    @Override

    public Object getGroup(int groupPosition) {

        return this._listGroupTitle.get(groupPosition);

    }

    @Override

    public int getGroupCount() {

        return this._listGroupTitle.size();

    }

    @Override

    public long getGroupId(int groupPosition) {

        return groupPosition;

    }

    @Override

    public View getGroupView(int groupPosition, boolean isExpanded,

                             View convertView, ViewGroup parent) {

        String gTitle = (String) getGroup(groupPosition);

        if (convertView == null) {

            LayoutInflater infalInflater = (LayoutInflater) this._context

                    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

            convertView = infalInflater.inflate(R.layout.list_group, null);

        }

        TextView txtGHeader= (TextView) convertView

                .findViewById(R.id.txtgheader);

        // Make group title bold

        txtGHeader.setText(Html.fromHtml("<b>"+gTitle+"</b>"));

        return convertView;

    }

    @Override

    public boolean hasStableIds() {

        return false;

    }

    @Override

    public boolean isChildSelectable(int groupPosition, int childPosition) {

        return true;

    }

}

Finally, in the MainActivity class that hosts the expandable list, you create a reference to the list, create an instance of the ExpandableListAdapter. You will pass group and member data to the constructor of the ExpandableListAdapter.

import java.util.ArrayList;

import java.util.HashMap;

import java.util.List;

import android.app.Activity;

import android.content.Context;

import android.os.Bundle;

import android.view.View;

import android.view.ViewGroup;

import android.widget.ExpandableListView;

import android.widget.ExpandableListView.OnChildClickListener;

import android.widget.ExpandableListView.OnGroupClickListener;

import android.widget.TextView;

import android.widget.Toast;

public class MainActivity extends Activity {

    ExpandableListAdapter expandableListAdapter;

    ExpandableListView expListView;

    List<String> listGroupTitles;

    HashMap<String, List<String>> listDataMembers;

    Context context;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        context=this;

        // get the listview

        expListView = (ExpandableListView) findViewById(R.id.expList);

        // Setting up list

        setUpExpList();

        expandableListAdapter= new ExpandableListAdapter(this, listGroupTitles, listDataMembers);

        // Setting list adapter

        expListView.setAdapter(expandableListAdapter);

        // Register list to receive child click event

        expListView.setOnChildClickListener(new OnChildClickListener() {

            @Override

            public boolean onChildClick(ExpandableListView parent, View v, int groupPosition, int childPosition, long id) {

                ViewGroup vg=(ViewGroup)v;

                TextView tv=(TextView)vg.findViewById(R.id.txtmember);

                Toast.makeText(context, tv.getText().toString(), Toast.LENGTH_LONG).show();

                return false;

            }

        });

        expListView.setOnGroupClickListener(new OnGroupClickListener() {

            @Override

            public boolean onGroupClick(ExpandableListView parent, View v, int groupPosition, long id) {

                ViewGroup vg=(ViewGroup)v;

                TextView tv=(TextView)vg.findViewById(R.id.txtgheader);

                Toast.makeText(context, tv.getText().toString(), Toast.LENGTH_LONG).show();

                return false;

            }

        });

    }

      private void setUpExpList() {

        listGroupTitles= new ArrayList<String>();

        listDataMembers= new HashMap<String, List<String>>();

        // Adding group title

        listGroupTitles.add("Group 1");

        listGroupTitles.add("Group 2 (no member)");

        // Adding member data

        List<String> group1Members= new ArrayList<String>();

        group1Members.add("Member1");

        group1Members.add("Member2");

        group1Members.add("Member3");

        group1Members.add("Member4");

        group1Members.add("Member5");

        listDataMembers.put(listGroupTitles.get(0), group1Members);

        listDataMembers.put(listGroupTitles.get(1),new ArrayList<String>());

    }

}

Posted by: Dara | post date: 03-11-2015 | Subject: Android Apps Development