【RecyclerView】九、为 RecyclerView 设置不同的布局样式_recyclerview不同布局

作者：Gausst松鼠会 | 2024-03-01 15:01:36

踩

recyclerview不同布局

文章目录

一、为 RecyclerView 设置不同的布局样式
二、完整代码
三、RecyclerView 相关资料

一、为 RecyclerView 设置不同的布局样式

为 RecyclerView 设置不同的布局样式流程 :

① 自定义 RecyclerView.Adapter 泛型类型 : 适配器的泛型类型需要设置为 RecyclerView.ViewHolder , 这是所有 ViewHolder 的基类 ;

public class Adapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> 
1

② 实现 getItemViewType( ) 方法 : 这里为不同位置的组件设置不同的布局类型 ;

        @Override
        public int getItemViewType(int position) {
            // 返回 View 布局类型, 奇数序号组件类型为 VIEW_TYPE_2, 偶数序号组件类型为 VIEW_TYPE_1
            return position % 2;
        }
1
2
3
4
5

③ 根据布局类型加载不同的布局文件 : 在 onCreateViewHolder( ) 方法中 , 根据当前的 int viewType 参数 , 加载不同的布局文件 ;

        @Override
        public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {

            // 根据不同的组件类型加载不同类型的布局文件
            switch (viewType){
                case VIEW_TYPE_1:
                    return new ViewHolder(
                            LayoutInflater.from(MainActivity.this)
                                    .inflate(R.layout.item_recyclerview, parent, false)
                    );


                case VIEW_TYPE_2:
                    return new ViewHolder2(
                            LayoutInflater.from(MainActivity.this)
                                    .inflate(R.layout.item_recyclerview2, parent, false)
                    );
            }

            return null;
        }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

④ 根据不同的布局类型绑定数据 : 在 onBindViewHolder( ) 方法中为布局组件绑定数据时 , 可以调用 getItemViewType 方法 , 获取当前的布局类型 , 然后根据该布局类型 , 将 ViewHolder 参数强转为不同的子类对象 , 然后为其绑定数据 ;

        @Override
        public void onBindViewHolder(@NonNull RecyclerView.ViewHolder holder, int position) {
            // 根据 position 获取布局类型 , 然后绑定数据
            switch (getItemViewType(position)){
                case VIEW_TYPE_1:
                    ((ViewHolder)holder).text.setText("" + position);
                    break;

                case VIEW_TYPE_2:
                    ((ViewHolder2)holder).text.setText("" + position);
                    ((ViewHolder2)holder).image.setImageResource(R.mipmap.ic_launcher);
                    break;
            }
        }
1
2
3
4
5
6
7
8
9
10
11
12
13
14

二、完整代码

完整代码 :

package kim.hsl.recyclerview;

import android.graphics.Color;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.GridLayoutManager;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;
import androidx.recyclerview.widget.StaggeredGridLayoutManager;

public class MainActivity extends AppCompatActivity {

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

        //1 . 从布局中获取 RecyclerView
        RecyclerView recycler_view = findViewById(R.id.recycler_view);

        //2 . 创建并设置布局管理器
        //创建布局管理器
        LinearLayoutManager layoutManager = new LinearLayoutManager(this, RecyclerView.VERTICAL, false);

        //设置布局管理器
        recycler_view.setLayoutManager(layoutManager);

        // 添加分隔符
        recycler_view.addItemDecoration(new ItemDecoration());

        //3 . 创建并设置列表适配器
        Adapter adapter = new Adapter();
        recycler_view.setAdapter(adapter);
    }

    /**
     * RecyclerView 适配器
     * RecyclerView.Adapter 中的 ViewHolder 泛型设置为 RecyclerView.ViewHolder
     * 同理 onBindViewHolder 中的泛型也要是该类型的
     */
    public class Adapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {

        public static final int VIEW_TYPE_1 = 0;
        public static final int VIEW_TYPE_2 = 1;

        @Override
        public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {

            // 根据不同的组件类型加载不同类型的布局文件
            switch (viewType){
                case VIEW_TYPE_1:
                    return new ViewHolder(
                            LayoutInflater.from(MainActivity.this)
                                    .inflate(R.layout.item_recyclerview, parent, false)
                    );


                case VIEW_TYPE_2:
                    return new ViewHolder2(
                            LayoutInflater.from(MainActivity.this)
                                    .inflate(R.layout.item_recyclerview2, parent, false)
                    );
            }

            return null;
        }

        @Override
        public void onBindViewHolder(@NonNull RecyclerView.ViewHolder holder, int position) {
            // 根据 position 获取布局类型 , 然后绑定数据
            switch (getItemViewType(position)){
                case VIEW_TYPE_1:
                    ((ViewHolder)holder).text.setText("" + position);
                    break;

                case VIEW_TYPE_2:
                    ((ViewHolder2)holder).text.setText("" + position);
                    ((ViewHolder2)holder).image.setImageResource(R.mipmap.ic_launcher);
                    break;
            }
        }

        @Override
        public int getItemCount() {
            return 10;
        }

        @Override
        public int getItemViewType(int position) {
            // 返回 View 布局类型, 奇数序号组件类型为 VIEW_TYPE_2, 偶数序号组件类型为 VIEW_TYPE_1
            return position % 2;
        }

        public class ViewHolder extends RecyclerView.ViewHolder {
            TextView text;
            public ViewHolder(@NonNull View itemView) {
                super(itemView);
                text = itemView.findViewById(R.id.text);
            }
        }

        public class ViewHolder2 extends RecyclerView.ViewHolder {
            TextView text;
            ImageView image;
            public ViewHolder2(@NonNull View itemView) {
                super(itemView);
                text = itemView.findViewById(R.id.text);
                image = itemView.findViewById(R.id.image);
            }
        }
    }

}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122