【教學】Android 擴展列表－ ExpandableList

　　各位開發者在使用 ListView 時，有沒有想過在中間加些不一樣的特色呢？今天要來教如何在列表中加入擴展的功能，可以利用這個功能來進行分類。除此之外，還可以使用這項功能來縮放自己的列表。

　　在 Coding 之前，會需要各位幫忙先設置三個 XML，分別是 ExpandableList 放置的 XML、分類列表的參考模組與子項目的參考模組。在這邊分別命名為 activity_main.xml、group_item.xml 與 child_item.xml。

Path：res/layout/activity_main.xml


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

   xmlns:tools="http://schemas.android.com/tools"

   android:layout_width="match_parent"

   android:layout_height="match_parent"

   android:orientation="vertical" >



   <ExpandableListView

      android:id="@+id/elst"

      android:layout_width="match_parent"

      android:layout_height="match_parent" />



</LinearLayout>

Path：res/layout/group_item.xml

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

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

   android:layout_width="match_parent"

   android:layout_height="wrap_content"

   android:background="#aaaaaa" >



<TextView

   android:id="@+id/txt_group"

   android:layout_width="wrap_content"

   android:layout_height="wrap_content"

   android:layout_alignParentLeft="true"

   android:layout_alignParentTop="true"

   android:layout_marginBottom="5dp"

   android:layout_marginLeft="10dp"

   android:layout_marginTop="5dp"

   android:text="Group"

   android:textColor="#000000"

   android:textSize="12dp" />



</RelativeLayout>

Path：res/layout/child_item.xml


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

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

   android:layout_width="match_parent"

   android:layout_height="wrap_content" >



   <TextView

      android:id="@+id/txt_demo"

      android:layout_width="wrap_content"

      android:layout_height="wrap_content"

      android:layout_alignParentRight="true"

      android:layout_alignParentTop="true"

      android:layout_marginBottom="10dp"

      android:layout_marginRight="10dp"

      android:layout_marginTop="10dp"

      android:text=""

      android:textColor="#000000"

      android:textSize="20dp" />



   <TextView

      android:id="@+id/txt_child"

      android:layout_width="wrap_content"

      android:layout_height="wrap_content"

      android:layout_alignBottom="@+id/txt_demo"

      android:layout_alignParentLeft="true"

      android:layout_alignTop="@+id/txt_demo"

      android:layout_marginLeft="10dp"

      android:layout_marginRight="10dp"

      android:layout_toLeftOf="@+id/txt_demo"

      android:text=""

      android:textColor="#000000"

      android:textSize="20dp" />



</RelativeLayout>

　　三個 XML 都設置完畢之後，接下來就要到程式碼的部分囉！那麼我廢話不多說，直接來看程式碼吧！

File Name：MainActivity


public class MainActivity extends Activity {



  private List<Map<String, Object>> groupData;

  private List<List<Map<String, Object>>> childData;

  private ExpandableListView elst;



  private String[] arr_child01 = new String[]{"Milk", "Apple", "Banana", "Orange"}

  , arr_child02 = new String[]{"Tom","Jack","Ray","Mark","Jason","Coco"}

  , arr_child03_1 = new String[]{"Child01","Child02","Child03","Child04","Child05","Child06","Child07","Child08"}

  , arr_child03_2 = new String[]{"Demo01","Demo02","Demo03","Demo04","Demo05","Demo06","Demo07","Demo08"}

  , arr_group = new String[]{ "Food", "People", "Demo Group" };



  @Override

  protected void onCreate(Bundle savedInstanceState) {

   super.onCreate(savedInstanceState);

   setContentView(R.layout.activity_main);



   elst = (ExpandableListView) findViewById(R.id.elst);

   prepareData();

   SimpleExpandableListAdapter adapter = 

     new SimpleExpandableListAdapter(this, 

       groupData, R.layout.group_item, 

       new String[]{"Group"}, new int[]{R.id.txt_group}, 

       childData, R.layout.child_item, 

       new String[]{"Child","Demo"}, new int[]{R.id.txt_child, R.id.txt_demo});

  

        // change group indicator style

        elst.setGroupIndicator(null);

//        elst.setGroupIndicator(getResources().getDrawable( R.drawable.ic_launcher));

        

  elst.setAdapter(adapter);

  for(int i=0;i<arr_group.length;i++){

   // open up all group

    elst.expandGroup(i);

  }

 }

 

  private void prepareData() {

   groupData = new ArrayList<Map<String, Object>>();

   childData = new ArrayList<List<Map<String, Object>>>();



  for (int i = 0; i < arr_group.length; i++) {

   Map<String, Object> groupObj = new HashMap<String, Object>();

   groupObj.put("Group", arr_group[i]);

   groupData.add(groupObj);



   List<Map<String, Object>> list = new ArrayList<Map<String, Object>>();

  switch (i) {

   case 0:

    for (int j = 0; j < arr_child01.length; j++) {

     Map<String, Object> obj = new HashMap<String, Object>();

     obj.put("Child", arr_child01[j]);

     obj.put("Demo", "");

     list.add(obj);

    }

    childData.add(list);

    break;

   case 1:

    for (int j = 0; j < arr_child02.length; j++) {

     Map<String, Object> obj = new HashMap<String, Object>();

     obj.put("Child", arr_child02[j]);

     obj.put("Demo", "");

     list.add(obj);

    }

    childData.add(list);

    break;

   case 2:

    for (int j = 0; j < arr_child03_1.length; j++) {

     Map<String, Object> obj = new HashMap<String, Object>();

     obj.put("Child", arr_child03_1[j]);

     obj.put("Demo", arr_child03_2[j]);

     list.add(obj);

    }

    childData.add(list);

    break;

   }

  }

 }

}