前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >【RecyclerView】 五、RecyclerView 布局 ( 瀑布流 | 交错网格局管理器 StaggeredGridLayoutManager )

【RecyclerView】 五、RecyclerView 布局 ( 瀑布流 | 交错网格局管理器 StaggeredGridLayoutManager )

作者头像
韩曙亮
发布2023-03-28 21:05:27
1.4K0
发布2023-03-28 21:05:27
举报
文章被收录于专栏:韩曙亮的移动开发专栏

文章目录

本篇博客主要讨论设置不同的布局管理器 , 以及不同布局管理器的参数设置 , 基础用法参考 【RecyclerView】 一、RecyclerView 最基本用法 ( 添加支持库 | 设置布局文件 | 自定义适配器 ) , 以及 RecyclerView 专栏 ;

一、交错网格局管理器 StaggeredGridLayoutManager ( 瀑布流 )


使用代码创建 交错网格局管理器 StaggeredGridLayoutManager, 推荐使用

StaggeredGridLayoutManager(int spanCount, int orientation)

构造函数 , 可以使用一行代码设置基本的 StaggeredGridLayoutManager参数 ;

参数说明 :

① int spanCount : 网格布局行或列的个数. 如果当前方向是垂直方向, 该参数设置的是行数. 如果当前方向是水平方向, 该参数设置的是列数.

② int orientation : 布局方向. 设置成 RecyclerView.VERTICAL 或 RecyclerView.HORIZONTAL.

当方向是 RecyclerView.VERTICAL 垂直方向时 , 网格元素排列顺序是逐行排列 , 先将第一行排满 , 然后将第二行排满 , int spanCount 参数设置的是每行的元素个数 ; ( 现代人写字顺序 )

当方向是 RecyclerView.HORIZONTAL 水平方向时 , 网格元素排列顺序是逐列排列 , 先将第一列排满 , 然后将第二列排满 , int spanCount 参数设置的是每列的元素个数 ; ( 古代人写字顺序 )

构造函数原型 :

代码语言:javascript
复制
    /**
     * 创建瀑布流网格布局管理器
     *
     * @param spanCount   如果当前方向是垂直方向, 该参数设置的是行数. 如果当前方向是水平方向, 该参数设置的是列数.
     * @param orientation 布局方向. 设置成 RecyclerView.VERTICAL 或 RecyclerView.HORIZONTAL.
     */
    public StaggeredGridLayoutManager(int spanCount, int orientation) {
        mOrientation = orientation;
        setSpanCount(spanCount);
        mLayoutState = new LayoutState();
        createOrientationHelpers();
    }

二、交错网格局管理器默认设置


StaggeredGridLayoutManager 默认设置是垂直方向 , 代码如下 :

代码语言:javascript
复制
        //1 . 从布局中获取 RecyclerView
        RecyclerView recycler_view = findViewById(R.id.recycler_view);

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

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

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

运行效果 :

三、交错网格局管理器水平方向设置


交错网格局管理器水平方向设置 :

代码语言:javascript
复制
        //1 . 从布局中获取 RecyclerView
        RecyclerView recycler_view = findViewById(R.id.recycler_view);

        //2 . 创建并设置布局管理器
        //创建布局管理器
        /*StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(
                3,
                RecyclerView.VERTICAL);*/

        StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(
                3,
                RecyclerView.HORIZONTAL);

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

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

运行效果 :

四、完整代码示例


代码语言:javascript
复制
package kim.hsl.recyclerview;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.GridLayoutManager;
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 . 创建并设置布局管理器
        //创建布局管理器
        /*StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(
                3,
                RecyclerView.VERTICAL);*/

        StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(
                3,
                RecyclerView.HORIZONTAL);

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

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

    /**
     * RecyclerView 适配器
     */
    public class Adapter extends RecyclerView.Adapter<Adapter.ViewHolder> {

        @NonNull
        @Override
        public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
            View root_view = LayoutInflater.from(MainActivity.this)
                    .inflate(R.layout.item_recyclerview, parent, false);
            return new ViewHolder(root_view);
        }

        @Override
        public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
            holder.text.setText("" + position);
        }

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

        public class ViewHolder extends RecyclerView.ViewHolder {
            TextView text;

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

}

五、RecyclerView 相关资料


官方文档 :

使用 RecyclerView 创建动态列表 : https://developer.android.google.cn/guide/topics/ui/layout/recyclerview

高级 RecyclerView 自定义 : https://developer.android.google.cn/guide/topics/ui/layout/recyclerview-custom

代码示例 :

GitHub 源码地址 : https://github.com/han1202012/001_RecyclerView

博客源码快照 : https://download.csdn.net/download/han1202012/14945985

( 使用 Android Studio 打开 )

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021-01-27,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 文章目录
  • 一、交错网格局管理器 StaggeredGridLayoutManager ( 瀑布流 )
  • 二、交错网格局管理器默认设置
  • 三、交错网格局管理器水平方向设置
  • 四、完整代码示例
  • 五、RecyclerView 相关资料
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档