[Android] BaseAdapterで画像とテキストをListView表示

base adapter 01 - [Android] BaseAdapterで画像とテキストをListView表示
ArrayAdapterを使えば手軽に作れる ListView ですが、画像とテキストのリストなど色々と細かく作りこみたい場合はカスタムでadapterを作成することになります。BaseAdapterを継承してカスタムでadapterを作るケースを試してみます。

Android Studio 3.4.2
API 29
AndroidX



ListView

 
メンバー11人の写真、スタッフ管理番号、eメールアドレス、電話番号(内線)そして名前をリスト化したアプリを作成してみたいと思います。

メンバー:
base adapter 03 - [Android] BaseAdapterで画像とテキストをListView表示

ListViewアプリ:
base adapter 02b - [Android] BaseAdapterで画像とテキストをListView表示

ListViewを作るためのBaseAdapterを継承したクラスは3つあります。

  1. SimpleAdapter
  2. ArrayAdapter
  3. CursorAdapter

単純なテキストリストはArrayAdapterを使ったほうが簡単です。ただし込み入ったレイアウトにしたい時はそのままBaseAdapterをカスタム化して使ったほうがいいでしょう。

 

 

BaseAdapter

 

カスタムadapterを作成する手順としては:

  • BaseAdapterを継承したクラスを作成
  • getView() メソッドをオーバライト
  • リスト項目のレイアウトをカスタマイズ

基本的なBaseAdapterの構造は

  • getCount(): 配列やListの要素数を返す
  • getItem(): indexやオブジェクトを返す
  • getItemId(): 特別なIDをindexの他に返す
  • getView(): setImageBitmap() など、ここで描画させている
 

サンプルコード

 
実際に作っていきたいと思います。
 
MainActivity.java

 
新しいTestAdapterクラスをprojectに作成します。
TestAdapter.java

 
レイアウトファイル
activity_main.xml

 
新しくLayout XMLファイルをlayout以下に作成します。
list_items.xml

 
strings.xml

 
サムネイル化(150x150pixel程度)した小さい画像をdrawableに入れます。
(API24以上を想定した場合はdrawable-v24に入れる)
 
base adapter 04 - [Android] BaseAdapterで画像とテキストをListView表示

画像は適当なものでかまいませんが、ファイル名がコードで呼ばれているので合わせてください。
 
これで実行してみます。
 

 

convertViewの再利用

 
リスト数が10個程度だとあまり気にならないのですが、画像を貼り付けてリスト数が数百になると、あるいはリストを増やせる仕様のケースでは、スクロールが重くなり最終的には Out Of Memory で終了…となる可能性があります。
 
ちょっと古いのですがGoogleがListViewについて解説した2010の動画です。今も使える内容で基本的な事が良く分かります。

Google I/O 2010 – The world of ListView

10000のアイテムをそのままリスト表示させていたらメモリがいくらあっても足りない
描画負荷を減らし、高速にするための手法として

 
if (convertView == null){

}else{

}
の部分で convetView がnullでなければ再利用する
– Inflate()
– findViewById()
は省略され、ViewHolder の children view が使用されます。

テキストのリストであれば問題ないかもしれませんが、画像を扱うListViewではこれは必須です。
 

    ArrayAdapter
  1. ListView と ArrayAdapter 簡単なテキストリストの表示
  2. ArrayAdapterを使ってレイアウトをアレンジ
  3. ListActivity と ArrayAdapterで画像とテキストをリスト表示
    Basedapter
  1. BaseAdapterで画像とテキストをリスト表示
  2. ListViewリストをタップして画面遷移
  3. ListViewアイテムの移動、削除
  4. ListView アイテム個々の背景、高さなどを変える

 
References:
ListView
BaseAdapter

誤字脱字、意味不明で分からにゃイ、
などのご意見はこちらから mailフォーム

ブックマークしておくと便利です このエントリーをはてなブックマークに追加




アプリ開発が上達するお勧め

アプリ開発を始めたけどわからないところがあり、誰かに聞きたいけど周りにはそんな人はいない…あるいは、会社で働いていて日中そんなに時間をとれないなど、オンラインのプログラミングスクールがいいでしょう、時間の制約がないところが一番の魅力です。

以下の3つはAndroidが学習できるオンラインスクールです。


TECH ACADEMY
Androidアプリコース



侍エンジニア塾
侍エンジニア塾 無料体験レッスン



CodeCamp
~約8,000名の受講生と80社以上の導入実績~
現役エンジニアのオンライン家庭教師CodeCamp





正直ネットや本では限界があります。直接(ネットで)誰か分かる人に聞いた方が早く解決して、上達も早いと思います。

尚、スクールがダメだと言う人がいますが、やる気があれば問題ありません。与えられるのを待っていてはいけないですね
欲しいものは取りに行くのです。


Google Pixel 3 XLグローバル版
SIMフリー 並行輸入品
6.3インチの大画面
背景をぼかすポートレートモード撮影


Anker PowerCore II Slim 10000
Power IQ 2.0搭載
iPhone & Android対応

シェアする

  • このエントリーをはてなブックマークに追加

フォローする