[Android Studio] ListViewで自作Adapterを使用する

どうも、tatsuです!

今日は、ListViewで自作Adapterを使用する方法を説明します。

※この記事で使用しているAndroid Studioのバージョンは2.3.3です。

ListViewで自作Adapterを使用する

今回は、以下のようなレイアウトを作っていきます。また、自作Adapterには独自クラスをデータとして渡したいと思います。

自作レイアウトの作成

画面左のプロジェクトウィンドウからlayoutフォルダを右クリックして、[New]→[Layout resource file]を選択して、次のようなファイルを作成します。

custom_list_layout.xmlは以下のようにします。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>

        <TextView
            android:id="@+id/mainText"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:gravity="center_vertical"
            android:text="メインテキスト"
            android:textSize="30sp"/>

        <TextView
            android:id="@+id/subText"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:gravity="center_vertical"
            android:text="サブテキスト"
            android:textSize="20sp"
            android:paddingLeft="20dp"/>
    </LinearLayout>

    <TextView
        android:id="@+id/description"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="説明がここに表示される~~~~~"/>

</LinearLayout>

自作Adapterにデータとして渡す独自クラスの作成

プロジェクトウィンドウから、MainActivity.javaが入っているフォルダを右クリックし、[New]→[Java Class]を選択し、以下のクラスを作成します。

CustomDataClass.javaは以下のようにします。

public class CustomDataClass {

    // リストの一項目自体を識別するためのid
    private long id = 0;

    private int imageId = 0;

    private String mainString = "";

    private String subString = "";

    private String description = "";


    // コンストラクタ -- このクラスがインスタンス化された時に実行されます
    public CustomDataClass(int imageid, String main, String sub, String desc){
        this.id = (new Random()).nextLong();
        this.imageId = imageid;
        this.mainString = main;
        this.subString = sub;
        this.description = desc;
    }


    // ここからgetter, setter
    public long getId(){
        return id;
    }

    public int getImageId() {
        return imageId;
    }

    public void setImageId(int imageId) {
        this.imageId = imageId;
    }

    public String getMainString() {
        return mainString;
    }

    public void setMainString(String mainString) {
        this.mainString = mainString;
    }

    public String getSubString() {
        return subString;
    }

    public void setSubString(String subString) {
        this.subString = subString;
    }

    public String getDescription() {
        return description;
    }

    public void setDescription(String description) {
        this.description = description;
    }
}

自作Adapterの作成

プロジェクトウィンドウから、MainActivity.javaが入っているフォルダを右クリックし、[New]→[Java Class]を選択し、以下のクラスを作成します。

注意
必ずBaseAdapterをSuperClassに指定してください。

CustomAdapter.javaは以下のようにします。

public class CustomAdapter extends BaseAdapter {

    // contextはおまじないと思って記述してください(説明が難しいため)
    private Context context = null;

    // ArrayListの中に独自クラスのCustomDataClassを指定
    private ArrayList<CustomDataClass> data = null;

    private int resource = 0;


    // コンストラクタ  MainActivityでアダプターを生成する箇所で呼ばれている
    public CustomAdapter(Context context, ArrayList<CustomDataClass> data, int resource){
        this.context = context;
        this.data = data;
        this.resource = resource;
    }


    /**
     * データの個数を返すメソッド
     * ※このメソッドは必ず記述すること
      */
    public int getCount() {
        return data.size();
    }

    /**
     * 指定された順番にある項目を返すメソッド
     * ※このメソッドは必ず記述すること
     */
    public Object getItem(int position) {
        return data.get(position);
    }

    /**
     * 指定された順番にある項目の識別idを返すメソッド
     * ※このメソッドは必ず記述すること
     */
    public long getItemId(int position) {
        return data.get(position).getId();
    }

    /**
     * リスト項目を表示するためのメソッド
     * 自作アダプターを作成するにあたって一番重要
     * 実際にユーザが呼ぶ箇所ではなく、リストを生成するために自動で呼ばれる
     * ※このメソッドは必ず記述すること
     */
    public View getView(int position, View convertView, ViewGroup parent) {
        Activity activity = (Activity) context;
        // 指定された位置のデータを取得
        CustomDataClass data = (CustomDataClass) getItem(position);

        // 再利用可能なビューが無かったら生成する
        if(convertView == null){
            convertView = activity.getLayoutInflater().inflate(resource, null);
        }

        /**
         * ここから各項目に値を割り当てる処理
         */
        // 画像割り当て
        ((ImageView) convertView.findViewById(R.id.image)).setImageResource(data.getImageId());
        // idがmainTextのTextViewに、指定されたデータのmainStringの値を格納している
        ((TextView) convertView.findViewById(R.id.mainText)).setText(data.getMainString());
        // こっちの書き方のほうがいつもの書き方なのでわかりやすいかも?
        TextView sub = (TextView) convertView.findViewById(R.id.subText);
        sub.setText(data.getSubString());
        // idがdescriptionのTextViewに、指定されたデータのdescriptionの値を格納している
        ((TextView) convertView.findViewById(R.id.description)).setText(data.getDescription());

        return convertView;
    }
}

activity_main.xml

activity_main.xmlは以下のようにします。

    <ListView
        android:id="@+id/list"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

MainActivity.java

MainActivity.javaは以下のようにします。

public class MainActivity extends AppCompatActivity {
    

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // ListViewに表示する項目を生成
        ArrayList<CustomDataClass> listData = new ArrayList<>();
        for(int i = 1; i <=  5; i++){
            CustomDataClass data = new CustomDataClass(R.mipmap.ic_launcher, "メイン"+i, "サブサブサブ"+i, "説明説明説明説明説明説明説明"+i);
            listData.add(data);
        }

        /**
         * CustomAdapterを生成
         * R.layout.custom_list_layout : リストビュー自身のレイアウト。今回は自作。
         */
        CustomAdapter customAdapter = new CustomAdapter(
                this,
                listData, // 使用するデータ
                R.layout.custom_list_layout // 自作したレイアウト
        );

        // idがlistのListViewを取得
        ListView listView = (ListView) findViewById(R.id.list);
        listView.setAdapter(customAdapter);
    }

}

結果

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です