サイト移転のお知らせ:http://techbooster.org/に移転しました

ExpandableListViewクラスで折り畳めるリストを表示する

5月 28, 2011   //   by kkato   //   ユーザインターフェース  //  No Comments

今回はリストの中の項目を選択すると、子供のリストが開くExpandableListViewの使い方を説明します。

大項目を表示させておいて、詳細は選択してから表示するような場面で活用できます。

通常のListViewについては下記の記事などが参考になります。

それでは続きへどうぞ

ExpandableListActivity

通常のListViewにもListViewクラスを直接使う方法とリスト表示専用のListActivityを継承したActivityを用意する2つの方法がありましたが、ExpandableListViewも同じようにExpandableListViewクラスを使う方法とExpandableListActivityクラスを継承したActivityを用意する方法があります。

ExpandableListActivityクラスを使うことで手軽にExpandableListViewを使うことができます。ExpandableListViewと他のViewを共存させたい場合には、ExpandableListActivityクラスを使わず自分でレイアウトを作成してExpandableListViewクラスを直接使う必要があります。

今回は後者のExpandableListActivityを継承したActivityを用意する方法を用いて表示させます。

まず表示させるリストを準備します。GroupとChildと表現されていますが親と子の関係と捉えた方が分かりやすいかもしれません。

上記のスクリーンショットでは3つのGroup(親)を持つリストがあり、それぞれに5つのChildが存在するリストを用意しています。

public class MainActivity extends ExpandableListActivity {
    @Override<br />
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        List<Map<String, String>> groupList = new ArrayList<Map<String,String>>();
        List<List<Map<String, String>>> childList = new ArrayList<List<Map<String,String>>>();

ChildはGroupがそれぞれリストを持っているので、リストのリストということになります。

次にリストに追加していきます。

for (int i = 0; i < 3; i++) {
	// Group(親)のリスト
	Map<String, String> groupElement = new HashMap<String, String>();
	groupElement.put("GROUP_TITLE", "Group " + i);
	groupList.add(groupElement);
	// Childのリスト
	List<Map<String, String>> childElements = new ArrayList<Map<String, String>>();
	for (int j = 0; j < 5; j++) {
		Map<String, String> child = new HashMap<String, String>();
		child.put("CHILD_TITLE", "Child " + j);
		child.put("SUMMARY", "Summary " + j);
		childElements.add(child);
	}
	childList.add(childElements);
}

Groupには「TITLE」というキーを、Childには「TITLE」「SUMMARY」の2つのキーでMapクラスを作成しListに入れています。このキーは任意の値で良いですが後述のAdapterを作成する際に引数で与える際に使うので間違わないようにだけしてください。

SimpleExpandableListAdapter

ListActivityと同様にAdapterを作成して、setListAdapterメソッドで設定します。

今回はSimpleExpandableListAdapterクラスを利用します。SimpleExpandableListAdapterクラスはリストとレイアウト、Mapのキーを引数に与えるだけの簡単に扱えるAdapterクラスです。

SimpleExpandableListAdapter adapter = new SimpleExpandableListAdapter(
		this,
		// Group(親)のリスト
		groupList,
		// Group(親)のレイアウト
		android.R.layout.simple_expandable_list_item_1,
		// Group(親)のリストで表示するMapのキー
		new String []{"GROUP_TITLE"},
		// Group(親)のレイアウト内での文字を表示するTextViewのID
		new int []{android.R.id.text1},
		// Child(子)のリスト
		childList,
		// Child(子)のレイアウト
		android.R.layout.simple_expandable_list_item_2,
		// Child(子)のリストで表示するMapのキー
		new String []{"CHILD_TITLE", "SUMMARY"},
		// Child(子)のレイアウト内での文字を表示するTextViewのID
		new int []{android.R.id.text1, android.R.id.text2}
);
setListAdapter(adapter);

これで項目を選択すると子供のリストが開くExpandableListViewを表示することができます。


関連する記事:

Sponsored Link

Comments are closed.

技術書新刊 発売中

アンドロイドアカデミアには、CIやテスト、互換検証など実務に生きるノウハウをあつめています

技術書新刊 発売中

Android Next!はAndroid 7.0に対応したはじめての技術書です!


The Web Explorer 2はCSSの中央寄せやWebAudioなど未来を読み解く一冊です


Revised TypeScript in DefinitelylandはTypeScript 2.0(β)に対応した解説書です。インストールから型定義まで幅広くサポートしています


技術書をかこう!はエンジニアらしい執筆環境を構築、HowTo本です