Introduction

This tutorial explains Expandiblelistview.
ExpandileListView
Expandiblelistview is a View that shows items in a vertically scrolling two-level list. The difference between ListView and Expandiblelistview is that it contains two levels that can expand two show children of a group.
In this tutorial, we first extend the ExpandiblelistActivtiy class. Now we need an adapter like a list view to bind the data. So we use BaseExpandibleListAdapter that provides a child of a group when we expand it. Now first we need two layouts, one is to show a group row and another to show a child row in an expandible ListView.
In this class, we create a group and its child by using it in an ArrayList and it to the constructor of the Adapter class where it will use by the getChidview method and getGroupview method to be shown on the screen.
  1. ArrayList<String> groupItem = new ArrayList<String>();
  2. ArrayList<Object> childItem = new ArrayList<Object>();
  4. public void setGroupData()
  5. {
  6. groupItem.add("Android Version");
  7. groupItem.add("Iphone Version");
  8. }
  9. public void setChildItem() {
  10. ArrayList<String> child = new ArrayList<String>();
  11. child.add("CupCake");
  12. child.add("Donut");
  13. child.add("Eclair");
  14. child.add("Froyo");
  15. childItem.add(child);
  17. child = new ArrayList<String>();
  18. child.add("Iphone OS 1.X");
  19. child.add("Iphone OS 2.X");
  20. child.add("Iphone OS 3.X");
  21. child.add("Iphone OS 4.X");
  22. childItem.add(child);
  23. }
Step 1
Create an XML file Activitymain.xml and write this:
  1. <CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools"
  2. android:id="@+id/textView1"
  3. android:layout_width="wrap_content"
  4. android:layout_height="60dp" android:layout_marginLeft="5dp"
  5. android:gravity="center_vertical"
  7. android:textColor="#45454545"
  8. android:padding="10dp"
  9. android:textSize="14sp"
  10. android:textStyle="bold" />
Step 2
Create another XML file and write this:
  1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="match_parent"
  4. android:layout_height="40dp"
  5. android:background="@android:color/black"
  6. android:clickable="true"
  7. android:orientation="vertical"
  8. android:paddingLeft="40dp"
  9. tools:context=".MainActivity" >
  11. <LinearLayout
  12. android:layout_width="match_parent"
  13. android:layout_height="39dp"
  14. android:gravity="center_vertical" >
  17. <TextView
  18. android:id="@+id/textView1"
  19. android:layout_width="wrap_content"
  20. android:layout_height="wrap_content"
  21. android:layout_marginLeft="5dp"
  22. android:textColor="#FFFFFF"
  23. android:textSize="14sp"
  24. android:textStyle="bold" />
  25. </LinearLayout>
  27. <View
  28. android:layout_width="match_parent"
  29. android:layout_height="1dp"
  30. android:background="@android:color/white" />
  32. </LinearLayout>
Step 3
Create a Java class MainActivity.java and write this:
  1. import android.app.ExpandableListActivity;
  2. import android.content.Context;
  3. import android.os.Bundle;
  4. import android.view.LayoutInflater;
  5. import android.widget.ExpandableListView;
  6. import android.widget.ExpandableListView.OnChildClickListener;
  7. import java.util.ArrayList;
  8. public class MainActivity extends ExpandableListActivity implements
  9. OnChildClickListener {
  11. @Override
  12. public void onCreate(Bundle savedInstanceState) {
  13. super.onCreate(savedInstanceState);
  14. ExpandableListView expandbleLis = getExpandableListView();
  15. expandbleLis.setDividerHeight(2);
  16. expandbleLis.setGroupIndicator(null);
  17. expandbleLis.setClickable(true);
  19. setGroupData();
  20. setChildGroupData();
  22. NewAdapter mNewAdapter = new NewAdapter(groupItem, childItem);
  23. mNewAdapter
  24. .setInflater(
  25. (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE),
  26. this);
  27. getExpandableListView().setAdapter(mNewAdapter);
  28. expandbleLis.setOnChildClickListener(this);
  29. }
  31. public void setGroupData() {
  32. groupItem.add("Android Versions");
  33. groupItem.add("Iphone versions");
  34. }
  36. ArrayList<String> groupItem = new ArrayList<String>();
  37. ArrayList<Object> childItem = new ArrayList<Object>();
  39. public void setChildGroupData() {
  40. /**
  41. * Add Data For TecthNology
  42. */
  43. ArrayList<String> child = new ArrayList<String>();
  44. child.add("Cupcake");
  45. child.add("Donut");
  46. child.add("Eclairs");
  47. child.add("Froyo");
  48. childItem.add(child);
  50. /**
  51. * Add Data For Mobile
  52. */
  53. child = new ArrayList<String>();
  54. child.add("Iphone OS 1.x");
  55. child.add("Iphone OS 2.x");
  56. child.add("Iphone OS 3.x");
  57. child.add("Iphone OS 4.x");
  58. childItem.add(child);
  59. }
  60. }
Step 4
Create a Java class and write this:
  1. import android.app.Activity;
  2. import android.view.LayoutInflater;
  3. import android.view.View;
  4. import android.view.View.OnClickListener;
  5. import android.view.ViewGroup;
  6. import android.widget.BaseExpandableListAdapter;
  7. import android.widget.CheckedTextView;
  8. import android.widget.TextView;
  9. import android.widget.Toast;
  11. import java.util.ArrayList;
  13. @SuppressWarnings("unchecked")
  14. public class Adapter extends BaseExpandableListAdapter {
  16. public ArrayList<String> groupItem, tempChild;
  17. public ArrayList<Object> Childtem = new ArrayList<Object>();
  18. public LayoutInflater minflater;
  19. public Activity activity;
  21. public Adapter(ArrayList<String> grList, ArrayList<Object> childItem) {
  22. groupItem = grList;
  23. this.Childtem = childItem;
  24. }
  26. public void setInflater(LayoutInflater mInflater, Activity act) {
  27. this.minflater = mInflater;
  28. activity = act;
  29. }
  31. @Override
  32. public Object getChild(int groupPosition, int childPosition) {
  33. return null;
  34. }
  36. @Override
  37. public long getChildId(int groupPosition, int childPosition) {
  38. return 0;
  39. }
  41. @Override
  42. public View getChildView(int groupPosition, final int childPosition,
  43. boolean isLastChild, View convertView, ViewGroup parent) {
  44. tempChild = (ArrayList<String>) Childtem.get(groupPosition);
  45. TextView text = null;
  46. if (convertView == null) {
  47. convertView = minflater.inflate(R.layout.newxml, null);
  48. }
  49. text = (TextView) convertView.findViewById(R.id.textView1);
  50. text.setText(tempChild.get(childPosition));
  51. convertView.setOnClickListener(new OnClickListener() {
  52. @Override
  53. public void onClick(View v) {
  54. Toast.makeText(activity, tempChild.get(childPosition),
  55. Toast.LENGTH_SHORT).show();
  56. }
  57. });
  58. return convertView;
  59. }
  61. @Override
  62. public int getChildrenCount(int groupPosition) {
  63. return ((ArrayList<String>) Childtem.get(groupPosition)).size();
  64. }
  66. @Override
  67. public Object getGroup(int groupPosition) {
  68. return null;
  69. }
  71. @Override
  72. public int getGroupCount() {
  73. return groupItem.size();
  74. }
  76. @Override
  77. public void onGroupCollapsed(int groupPosition) {
  78. super.onGroupCollapsed(groupPosition);
  79. }
  81. @Override
  82. public void onGroupExpanded(int groupPosition) {
  83. super.onGroupExpanded(groupPosition);
  84. }
  86. @Override
  87. public long getGroupId(int groupPosition) {
  88. return 0;
  89. }
  91. @Override
  92. public View getGroupView(int groupPosition, boolean isExpanded,
  93. View convertView, ViewGroup parent) {
  94. if (convertView == null) {
  95. convertView = minflater.inflate(R.layout.activity_main, null);
  96. }
  97. ((CheckedTextView) convertView).setText(groupItem.get(groupPosition));
  98. ((CheckedTextView) convertView).setChecked(isExpanded);
  99. return convertView;
  100. }
  102. @Override
  103. public boolean hasStableIds() {
  104. return false;
  105. }
  107. @Override
  108. public boolean isChildSelectable(int groupPosition, int childPosition) {
  109. return false;
  110. }
  111. }
Step 5
Output Screen
emul1.png
When you click on Android version it gives a list like this:
emul2.png
When you click on iPhone Version:
emul8.png
When you click on any version of Android:
emul5.jpg
When you click on any version of iPhone:
emul6.jpg