Android RecyclerView的StaggeredGridLayoutManager实现交错排列的子元素分组

喜欢ヅ旅行 2023-10-17 18:53 45阅读 0赞

**Android RecyclerView的StaggeredGridLayoutManager实现交错排列的子元素分组**

先看实现的结果如图：  
![20180330160755861][]  
设计背景：现在的产品对设计的需求越来越多样化，如附录文章2是典型的联系人分组RecyclerView，子元素排列到一个相同的组，但是有些时候，UI要求把这些元素不是垂直方向的，而是像本文开头的图中所示样式排列，这就需要用StaggeredGridLayoutManager规划RecyclerView，在附录文章2的基础上改造，代码：

package app.zhangphil.app;
    
    import android.graphics.Color;
    import android.support.v7.app.AppCompatActivity;
    import android.os.Bundle;
    import android.support.v7.widget.RecyclerView;
    import android.support.v7.widget.StaggeredGridLayoutManager;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.TextView;
    
    import java.util.ArrayList;
    
    public class MainActivity extends AppCompatActivity {
    
        private final int TYPE_GROUP = 0xa01;
        private final int TYPE_CHILD = 0xa02;
        private String[] groupNames = {"A", "B", "C", "D", "E", "F", "G"};
        private ArrayList<Item> mItems;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            mItems = new ArrayList<>();
            for (int i = 0; i < groupNames.length; i++) {
                Group group = new Group();
                group.position = i;
                group.title = groupNames[i];
                mItems.add(group);
    
                int count = (int) (Math.random() * 100) % 9 + 1;
                for (int j = 0; j < count; j++) {
                    Child child = new Child();
                    child.position = j;
                    child.groupPos = i;
                    child.groupName = group.title;
                    mItems.add(child);
                }
            }
    
            RecyclerView mRecyclerView = findViewById(R.id.recycler_view);
    
            StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(4, StaggeredGridLayoutManager.VERTICAL);
            mRecyclerView.setLayoutManager(layoutManager);
    
            RecyclerViewAdapter mAdapter = new RecyclerViewAdapter();
            mRecyclerView.setAdapter(mAdapter);
        }
    
        public class RecyclerViewAdapter extends RecyclerView.Adapter<ItemVH> {
    
            @Override
            public ItemVH onCreateViewHolder(ViewGroup parent, int viewType) {
                View view;
                ItemVH itemVH = null;
                switch (viewType) {
                    case TYPE_GROUP:
                        view = LayoutInflater.from(parent.getContext()).inflate(android.R.layout.simple_list_item_1, parent, false);
                        itemVH = new GroupVH(view);
    
                        StaggeredGridLayoutManager.LayoutParams layoutParams = new StaggeredGridLayoutManager.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
                        layoutParams.setFullSpan(true);
                        itemVH.itemView.setLayoutParams(layoutParams);
                        break;
    
                    case TYPE_CHILD:
                        view = LayoutInflater.from(parent.getContext()).inflate(android.R.layout.simple_list_item_2, parent, false);
                        itemVH = new ChildVH(view);
                        break;
                }
    
                return itemVH;
            }
    
            @Override
            public void onBindViewHolder(ItemVH holder, int position) {
                Item item = mItems.get(position);
                switch (getItemViewType(position)) {
                    case TYPE_GROUP:
                        Group g = (Group) item;
                        GroupVH groupVH = (GroupVH) holder;
                        groupVH.text1.setText(g.title);
                        break;
    
                    case TYPE_CHILD:
                        Child c = (Child) item;
                        ChildVH childVH = (ChildVH) holder;
                        childVH.text1.setText(c.groupName);
                        childVH.text2.setText(c.position + "");
                        break;
                }
            }
    
            @Override
            public int getItemCount() {
                return mItems.size();
            }
    
            @Override
            public int getItemViewType(int position) {
                return mItems.get(position).getType();
            }
        }
    
        private class Group extends Item {
            public String title;
    
            @Override
            public int getType() {
                return TYPE_GROUP;
            }
        }
    
        private class Child extends Item {
            public int groupPos;
            public String groupName;
    
            @Override
            public int getType() {
                return TYPE_CHILD;
            }
        }
    
        private abstract class Item {
            public int position;
    
            public abstract int getType();
        }
    
        private class GroupVH extends ItemVH {
            public TextView text1;
    
            public GroupVH(View itemView) {
                super(itemView);
                text1 = itemView.findViewById(android.R.id.text1);
                text1.setBackgroundColor(Color.RED);
            }
    
            @Override
            public int getType() {
                return TYPE_GROUP;
            }
        }
    
        private class ChildVH extends ItemVH {
            public TextView text1;
            public TextView text2;
    
            public ChildVH(View itemView) {
                super(itemView);
                text1 = itemView.findViewById(android.R.id.text1);
                text2 = itemView.findViewById(android.R.id.text2);
                text1.setTextColor(Color.LTGRAY);
                text2.setTextColor(Color.BLUE);
            }
    
            @Override
            public int getType() {
                return TYPE_CHILD;
            }
        }
    
        private abstract class ItemVH extends RecyclerView.ViewHolder {
            public ItemVH(View itemView) {
                super(itemView);
            }
    
            public abstract int getType();
        }
    }

重点是在onCreateViewHolder时候，用StaggeredGridLayoutManager.LayoutParams使得当前的ViewHolder扩充（MATCH\_PARENT）整个布局，并且：

layoutParams.setFullSpan(true);

实现结果就是本文开头的图中所示样式。

附录：  
1，《Android RecyclerView的StaggeredGridLayoutManager和CardView》链接：https://blog.csdn.net/zhangphil/article/details/47604581  
2，《Android RecyclerView实现子元素的Group分组，LinearLayoutManager垂直方向》链接：https://blog.csdn.net/zhangphil/article/details/79758587

[20180330160755861]: https://img-blog.csdn.net/20180330160755861