ListView を理解する

いろいろ便利そうなViewといえば android.widget.ListView かな？と仕組みを調べてみました。

まず参考になるのが リストビューをカスタマイズする のページ。ArrayAdapterを拡張するあたりで、ListViewの仕組みがおおまかに把握できます。とりあえずこれ理解するだけで、ListViewは使えちゃう感じ。

で、上記のページでconvertViewの使いまわしが気になった場合、更に詳細な説明がある Y.A.M.の雑記帳サイト の - Virtualization and adapters - ページが非常に素晴らしい！

ここで更に注目なのがFastのケース。findViewById()だと遅いので、Holder用意してあげると速くなりますぜ、というコツが説明されています。Holder用にオブジェクトをわざわざ生成するのは重くなりそうに感じますが、ListViewの場合にはViewの使いまわしが非常に多いので効果が出やすい、ということだと思います。

Google I/O の「The world of ListView」 からのまとめだそうですが、残りのネタも非常に参考になります。感謝。

余談ですが LayoutInflater の inflate() でlayoutリソースからViewを直接生成することができるんですね。これもなかなか興味深いです。

というわけで、試しに作った適当なListViewデモです。ただ、ネタを判ってもらえる年代が非常に限られるような…orz

よくある画像+テキストなListViewのサンプルに対し、テキストを2つに増やしました、それらはLinearLayoutで縦に並べてみました、という安直な拡張しただけデス。

名前を表示するTextViewのほうには、以下のようにベタに属性を指定しています。

android:textSize="24sp"

android:background="#cccccc"

android:textColor="#000000"

セレクターについては [Android]ListViewについて ページが詳しいです。また気がつきにくい落とし穴として Android selector の item タグの color の注意点 ページの情報は助かりました。

というわけで、試してみましょう。既存の 9-patch png をもとに、色変換で怪しげな緑のタイルを作成してみました。

list_selector_background_green.9.png

で、drawable/list_selector_background.xml ファイルを新規作成し、以下の内容を記載します。ウィザードでちゃんと指定してあげれば、<item>タグ以外は自動生成されているハズ。

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

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

    <item android:state_focused="true" android:drawable="@drawable/list_selector_background_green" />

</selector>

え、短すぎるって？いいんです、変えたい部分だけ指定してあげれば十分ですよ。後はレイアウト設定で、対象のListViewに以下の属性を追加してやります。

android:listSelector="@drawable/list_selector_background"

これで完了。実行してみると、選択したアイテムの背景が怪しい緑色にかわっています。

ついでなので、文字色も変えてみましょう。

まずはセレクターの設定です。先ほどと同様にdrawable/list_selector_color.xml ファイルを新規作成し、以下の<item>要素を追加します。

    <item android:state_selected="true" android:color="#FF5050" />

    <item android:state_selected="false" android:color="#FFFFFF" />

今回は state_selected="false" が必要です。いったんセレクターを指定した以上、指定しないと勝手に黒に設定されてしまう？ようです。で、対象のTextViewのレイアウト設定に

android:textColor="@drawable/list_selector_color"

の属性を追加するだけで、選択したリストアイテムの説明文が赤に変わりました。

レイアウト設定、これだけでひとつのプログラミング環境みたいなものかもしれません。xmlでビューの構造を定義して、色など細かいものは属性で指定する。そしてその属性はセレクターを使って、状況によって値を変化させることができる。

いやぁ、さすがは今時の開発環境。面白いですね～