【Kotlin×Android】リストビューのレイアウトカスタマイズ


リストビューはデフォルトのままだとテキストしか表示できませんが、
自分でレイアウトを作りそれを使用するでテキスト以外の情報も表示させることができるようになります。
今回はリストビューのレイアウトをカスタマイズする方法を紹介します。

以下のような画面を作成します。

必要なもの

カスタマイズするために必要なものは以下お通りです。

  • BaseAdapterを継承したアダプタークラス
  • リストに表示させる情報を定義したdataクラス
  • リストのアイテムとして表示させるlayoutファイル

BaseAdapterを継承したアダプタークラス

コンストラクターで各種必要な情報を受け取ります。

  • context
    • コンテキスト
  • data
    • 表示させるデータ
  • resource
    • レイアウトファイル

レイアウトファイルをViewのオブジェクトに変換するためにLayoutInflaterを取得します。
後で出てきますが、このオブジェクトのiflateメソッドを使用します

この部分は何をするものなのか何となくイメージできると思います。
データの個数、アイテム、アイテムのIDをそれぞれ取得します。

この部分でviewに値を設定しています。
inflateメソッドでレイアウトファイルをViewに変換しています。
ただレイアウトファイルの解析は時間がかかるため再利用できるものがある場合はそれを使用します。

リストに表示させる情報を定義したdataクラス

リストのアイテムとして表示させたい情報を定義します。
今回はidとtitleを定義しました。

リストのアイテムとして表示させるlayoutファイル


idを表示させるためのTextView、
titleを表示させるためのTextView、
画像を表示させるためのImageViewを配置しています。


MainActivity


ここまでくればやることは簡単で先ほど定義したdataクラスであるListItemの配列を作成し、CustomListAdapterに渡します。
さらにそれをListViewのadapterに設定すれば完了です。

MainActivityのレイアウトにはListViewのみを配置しています。