Skip to content

使用StaggeredGridLayoutManager

使用StaggeredGridLayoutManager实现瀑布流效果。

假设我们要做一个竖直列表,每行2个item。

效果图

给RecyclerView使用StaggeredGridLayoutManager

binding.reView.setLayoutManager(new StaggeredGridLayoutManager(2, RecyclerView.VERTICAL));

item的layout

<?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="horizontal">

    <TextView
        android:id="@+id/tv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#03A9F4"
        android:gravity="center"
        android:minHeight="40dp"
        android:text="data item"
        android:textColor="#fff"
        android:textSize="18sp"
        android:textStyle="bold" />

</LinearLayout>

操作数据列表,增加和删除一些子项。 增加数据后,调用mAdapter.notifyItemInserted更新列表。 删除数据后,调用mAdapter.notifyItemRemoved

private View.OnClickListener mOnClickListener = new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.head_add1:
                mAdapter.getDataList().add(0, new Data("data\n" + System.currentTimeMillis(), color1));
                mAdapter.notifyItemInserted(0);
                break;
            case R.id.head_minus1:
                mAdapter.getDataList().remove(0);
                mAdapter.notifyItemRemoved(0);
                break;
            case R.id.tail_add1:
                mAdapter.getDataList().add(new Data("data\n" + System.currentTimeMillis(), color2));
                mAdapter.notifyItemInserted(mAdapter.getDataList().size() - 1);
                break;
            case R.id.tail_minus1:
                int tail = mAdapter.getItemCount() - 1;
                mAdapter.getDataList().remove(tail);
                mAdapter.notifyItemRemoved(tail);
                break;
            case R.id.head3_add1:
                mAdapter.getDataList().add(3, new Data("data\n" + System.currentTimeMillis(), color1));
                mAdapter.notifyItemInserted(3);
                break;
            case R.id.head3_minus1:
                mAdapter.getDataList().remove(3);
                mAdapter.notifyItemRemoved(3);
                break;
        }
    }
};

效果展示