RecyclerViewのグループ表示機能を実装したAndroidの完成例（カスタムグループヘッダーとアイテムレイアウト）

モバイル 2023-04-16 14:00:45 訪問数: null

効果のスクリーンショットを実現します。

まず、RecyclerView にグループ化の概念を追加する必要があります.グループ化を表す Group クラスを作成できます.これには、グループ化名とグループ化内のデータ項目のリストが含まれます. コードは以下のように表示されます:

public class Group {
    private String name;
    private List<Item> items;

    public Group(String name, List<Item> items) {
        this.name = name;
        this.items = items;
    }

    public String getName() {
        return name;
    }

    public List<Item> getItems() {
        return items;
    }


    public static class Item {
        private String name;
        private String description;

        public Item(String name, String description) {
            this.name = name;
            this.description = description;
        }

        public String getName() {
            return name;
        }

        public String getDescription() {
            return description;
        }
    }
}

次に、グループ化をサポートできるように RecyclerView の Adapter を変更する必要があります。すべてのデータ項目の合計数ではなく、すべてのグループのデータ項目の合計数を返すには、getItemCount() メソッドをオーバーライドする必要があります。また、各グループのヘッダー ビューを表示できるように、getItemViewType() メソッドをオーバーライドして別のビュー タイプを返す必要があります。コードは以下のように表示されます:

package com.example.recyclerview_group;

import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import androidx.recyclerview.widget.RecyclerView;

import java.util.List;

/**
 * @author wh445306
 * @version 1.0
 * @Description GroupAdapter
 * @Date 2023-04-07 14:37
 */
public class GroupAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
    private List<Group> groups;

    public GroupAdapter(List<Group> groups) {
        this.groups = groups;
    }

    @Override
    public int getItemCount() {
        int count = 0;
        for (Group group : groups) {
            count += group.getItems().size() + 1;
        }
        return count;
    }

    @Override
    public int getItemViewType(int position) {
        int count = 0;
        for (Group group : groups) {
            int size = group.getItems().size() + 1;
            if (position < count + size) {
                return position == count ? 0 : 1;
            }
            count += size;
        }
        throw new IllegalArgumentException("Invalid position");
    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        if (viewType == 0) {
            View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_group, parent, false);
            return new GroupViewHolder(view);
        } else {
            View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_item, parent, false);
            return new ItemViewHolder(view);
        }
    }

    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
        int count = 0;
        for (Group group : groups) {
            int size = group.getItems().size() + 1;
            if (position < count + size) {
                if (position == count) {
                    GroupViewHolder groupViewHolder = (GroupViewHolder) holder;
                    groupViewHolder.nameTextView.setText(group.getName());
                } else {
                    ItemViewHolder itemViewHolder = (ItemViewHolder) holder;
                    Group.Item item = group.getItems().get(position - count - 1);
                    itemViewHolder.nameTextView.setText(item.getName());
                    itemViewHolder.descriptionTextView.setText(item.getDescription());
                }
                return;
            }
            count += size;
        }
        throw new IllegalArgumentException("Invalid position");
    }

    private static class GroupViewHolder extends RecyclerView.ViewHolder {
        private TextView nameTextView;

        public GroupViewHolder(View itemView) {
            super(itemView);
            nameTextView = itemView.findViewById(R.id.GroupName);
        }
    }

    private static class ItemViewHolder extends RecyclerView.ViewHolder {
        private TextView nameTextView;
        private TextView descriptionTextView;

        public ItemViewHolder(View itemView) {
            super(itemView);
            nameTextView = itemView.findViewById(R.id.ItemName);
            descriptionTextView = itemView.findViewById(R.id.ItemDescription);
        }
    }
}

最後に、Activity または Fragment に RecyclerView と GroupAdapter を作成し、RecyclerView の Adapter として設定する必要があります。コードは以下のように表示されます:

package com.example.recyclerview_group;

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {
    private RecyclerView recyclerView;

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

        List<Group> groups= new ArrayList<>();
        List<Group.Item> items1 = new ArrayList<>();
        items1.add(new Group.Item("Item 1", "Description 1"));
        items1.add(new Group.Item("Item 2", "Description 2"));
        items1.add(new Group.Item("Item 3", "Description 3"));
        groups.add(new Group("Group 1", items1));
        List<Group.Item> items2 = new ArrayList<>();
        items2.add(new Group.Item("Item 4", "Description 4"));
        items2.add(new Group.Item("Item 5", "Description 5"));
        groups.add(new Group("Group 2", items2));
        List<Group.Item> items3 = new ArrayList<>();
        items3.add(new Group.Item("Item 6", "Description 6"));
        items3.add(new Group.Item("Item 7", "Description 7"));
        groups.add(new Group("Group 3", items3));

        recyclerView = findViewById(R.id.recyclerView);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));
        recyclerView.setAdapter(new GroupAdapter(groups));
    }
}

activity_main

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

    <!-- RecyclerView控件 -->
    <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recyclerView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_above="@+id/footerTextView"
            android:padding="16dp" />

    <!-- TextView控件 -->
    <TextView
            android:id="@+id/footerTextView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:gravity="center"
            android:padding="16dp"
            android:text="Footer Text" />

</RelativeLayout>

item_group 定義

item_group は、RecyclerView のグループ化されたヘッダー ビューのレイアウト ファイルを指定するために使用されます。

この例では、TextView コントロールを使用してグループ タイトルを表示し、プロパティを使用してandroid:backgroundタイトルの背景色を設定し、android:textColorプロパティを使用してタイトル テキストの色を設定します。このレイアウト ファイルは、実際のニーズに応じて変更およびカスタマイズできます。

以下は、item_group.xmlグループ タイトルを表示するための TextView コントロールを含む簡単なサンプル コードです。

 

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
          android:id="@+id/GroupName"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:background="@color/colorAccent"
          android:padding="16dp"
          android:textColor="@android:color/white" />

item_item定義

`R.layout.item_item は、RecyclerView のデータ項目ビューのレイアウト ファイルを指定するために使用されます。

この例では、2 つの TextView コントロールを使用して、RecyclerView のデータ項目の名前と説明、テキスト サイズを設定するandroid:textSizeプロパティ、android:textStyleテキスト スタイルを設定するプロパティ、およびテキストの色を設定するandroid:textColorプロパティ表示します。このレイアウト ファイルは、実際のニーズに応じて変更およびカスタマイズできます。

以下は、RecyclerView のデータ項目の名前と説明を表示する 2 つの TextView コントロールを含む単純なitem_item.xmlサンプル。

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

    <TextView
            android:id="@+id/ItemName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="18sp"
            android:textStyle="bold" />

    <TextView
            android:id="@+id/ItemDescription"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="14sp"
            android:textColor="@android:color/darker_gray" />

</LinearLayout>

 

このようにして、RecyclerView のグループ化機能を実現しました。GroupAdapter では、getItemCount()、getItemViewType()、onCreateViewHolder()、および onBindViewHolder() メソッドを書き直して、グループ化をサポートします。Activity または Fragment 内に RecyclerView と GroupAdapter を作成し、RecyclerView の Adapter として設定することでグループ化機能を実現します。

この例では、RecyclerView コントロールと TextView コントロールを含めるために RelativeLayout を使用しています。RecyclerView コントロールの高さは、レイアウト全体を占めるように match_parent に設定されます。TextView コントロールの高さは、テキスト コンテンツに従って高さを調整するために、wrap_content に設定されます。RecyclerView コントロールの下部は、プロパティを使用して TextView コントロールの上部に揃えられますandroid:layout_above="@+id/footerTextView"。

おすすめ

転載: blog.csdn.net/wh445306/article/details/130117140
おすすめ
Face Wall Intelligence が Eurux-8x22B オープンソース大型モデルをリリース - 「科学のチャンピオン」と呼ぶにふさわしいモデル
Kaiyuan Daily | Google は、Hongmeng のオープンソース Android 携帯電話を Docker がサポート、オープンプラットフォームを閉鎖。
ランキング
Swiper を使用する際の落とし穴、どの落とし穴に陥りましたか?
データ構造基盤のリンクリスト（1）
Vue3 は Excel のアップロードと JSON データへの解析を実装し、自動ダウンロード用の JSON ファイルを生成します。
LG4721 [テンプレート]パーティションFFT
C ++のコンストラクタとデストラクタの実行順序
c3新特性多列
ライブラリのリソース
Unityエディタの拡張機能? PropertyDrawerとは何ですか? カスタムスクリプト変数のプロット?
2つのノード間のパスを見つけるのNeo4j
Linuxのnginxのを使用してCDNサーバの設定を行います
アーカイブ
もっと
2024-05-06(6)
2024-05-05(0)
2024-05-04(18)
2024-05-03(8)
2024-05-02(0)
2024-05-01(4)
2024-04-30(35)
2024-04-29(5)
2024-04-28(12)
2024-04-27(29)

コードワールド

© 2018 codetd.com