0
点赞
收藏
分享

微信扫一扫

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



文章目录


  • ​​一、交错网格局管理器 StaggeredGridLayoutManager ( 瀑布流 )​​
  • ​​二、交错网格局管理器默认设置​​
  • ​​三、交错网格局管理器水平方向设置​​
  • ​​四、完整代码示例​​
  • ​​五、RecyclerView 相关资料​​




本篇博客主要讨论设置不同的布局管理器 , 以及不同布局管理器的参数设置 , 基础用法参考 ​​【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 参数设置的是每列的元素个数 ; ( 古代人写字顺序 )



构造函数原型 :

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






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


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

//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);

运行效果 :

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






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


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

//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】 五、RecyclerView 布局 ( 瀑布流 | 交错网格局管理器 StaggeredGridLayoutManager  )_参数设置_02






四、完整代码示例


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​​

 ( 使用 Android Studio 打开 )



举报

相关推荐

0 条评论