RecyclerView的基本使用

最新推荐文章于 2022-10-04 07:00:00 发布

盛大人很低调

最新推荐文章于 2022-10-04 07:00:00 发布

阅读量321

点赞数

分类专栏： android 文章标签： RecyclerVi

android 专栏收录该内容

66 篇文章 1 订阅

订阅专栏

一、添加gradle依赖。

二、RecyclerView实现垂直滚动的列表：

1.RecyclerView适配器：

public class BombAdapter extends RecyclerView.Adapter<BombAdapter.ViewHolder>{

    private List<Bomb> mList;
    private Context mContext;

    public BombAdapter (Context context,List<FruitBean> list){
        mList = list;
        mContext = context;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        LayoutInflater inflater = LayoutInflater.from(mContext);
        View view = inflater.inflate(R.layout.item,null);
        ViewHolder viewHolder = new ViewHolder(view);
        return viewHolder;
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        Bomb bomb = mList.get(position);
        holder.imageView.setImageResource(bomb .imageId);
        holder.textView.setText(bomb .fruitName);
    }

    @Override
    public int getItemCount() {
        return mList.size();
    }

    static class ViewHolder extends RecyclerView.ViewHolder{
        ImageView imageView;
        TextView textView;

        public ViewHolder(View itemView) {
            super(itemView);
            imageView = (ImageView) itemView.findViewById(R.id.imageView);
            textView = (TextView) itemView.findViewById(R.id.textView);
        }
    }
}

2.MainActivity代码：

public class MainActivity extends Activity {

    private RecyclerView recyclerView;
    private List<Bomb> bombList = new ArrayList<>();

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

        initData();
        initView();
    }

    private void initData() {
        for (int i=0;i<2;i++){
            Bomb bomb5 = new Bomb("我是bomb 1 哦",R.drawable.bomb5);
            bombList.add(bomb5);
            Bomb bomb6 = new Bomb("我是bomb 2 哦",R.drawable.bomb6);
            bombList.add(bomb6);
            Bomb bomb7 = new Bomb("我是bomb 3 哦",R.drawable.bomb7);
            bombList.add(bomb7);
            Bomb bomb8 = new Bomb("我是bomb 4 哦",R.drawable.bomb8);
            bombList.add(bomb8);
            Bomb bomb9 = new Bomb("我是bomb 5 哦",R.drawable.bomb9);
            bombList.add(bomb9);
            Bomb bomb10 = new Bomb("我是bomb 6 哦",R.drawable.bomb10);
            bombList.add(bomb10);
            Bomb bomb11 = new Bomb("我是bomb 7 哦",R.drawable.bomb11);
            bombList.add(bomb11);
            Bomb bomb12 = new Bomb("我是bomb 8 哦",R.drawable.bomb12);
            bombList.add(bomb12);
            Bomb bomb13 = new Bomb("我是bomb 9 哦",R.drawable.bomb13);
            bombList.add(bomb13);
            Bomb bomb14 = new Bomb("我是bomb 10 哦",R.drawable.bomb14);
            bombList.add(bomb14);
            Bomb bomb15 = new Bomb("我是bomb 11 哦",R.drawable.bomb15);
            bombList.add(bomb15);
            Bomb bomb16 = new Bomb("我是bomb 12 哦",R.drawable.bomb16);
            bombList.add(bomb16);
        }
    }

    private void initView() {
        recyclerView = (RecyclerView) findViewById(R.id.recyclerView);

        //设置recyclerView的布局方式为线性布局 
        LinearLayoutManager layoutManager = new LinearLayoutManager(this);
        recyclerView.setLayoutManager(layoutManager);

        //如果可以确定每个item的高度是固定的，设置这个选项可以提高性能
        recyclerView.setHasFixedSize(true);

        BombAdapter adapter = new BombAdapter(this,bombList);
        recyclerView.setAdapter(adapter);
    }
}

运行效果：
这里写图片描述

发现此列表是没有分割线的，当然加分割线是很简单的，完全可以在Item的布局里加水平的view，这里写个别的方法添加分割线。

先写个分割线的类：

 public class DividerLine extends RecyclerView.ItemDecoration{
    /**
     * 水平方向
     */
    public static final int HORIZONTAL = LinearLayoutManager.HORIZONTAL;

    /**
     * 垂直方向
     */
    public static final int VERTICAL = LinearLayoutManager.VERTICAL;

    // 画笔
    private Paint paint;

    // 布局方向
    private int orientation;
    // 分割线颜色
    private int color;
    // 分割线尺寸
    private int size;

    public DividerLine() {
        this(VERTICAL);
    }

    public DividerLine(int orientation) {
        this.orientation = orientation;

        paint = new Paint();
    }

    @Override
    public void onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state) {
        super.onDrawOver(c, parent, state);

        if (orientation == VERTICAL) {
            drawHorizontal(c, parent);
        } else {
            drawVertical(c, parent);
        }
    }

    /**
     * 设置分割线颜色
     *
     * @param color 颜色
     */
    public void setColor(int color) {
        this.color = color;
        paint.setColor(color);
    }

    /**
     * 设置分割线尺寸
     *
     * @param size 尺寸
     */
    public void setSize(int size) {
        this.size = size;
    }

    // 绘制垂直分割线
    protected void drawVertical(Canvas c, RecyclerView parent) {
        final int top = parent.getPaddingTop();
        final int bottom = parent.getHeight() - parent.getPaddingBottom();

        final int childCount = parent.getChildCount();
        for (int i = 0; i < childCount; i++) {
            final View child = parent.getChildAt(i);
            final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child.getLayoutParams();
            final int left = child.getRight() + params.rightMargin;
            final int right = left + size;

            c.drawRect(left, top, right, bottom, paint);
        }
    }

    // 绘制水平分割线
    protected void drawHorizontal(Canvas c, RecyclerView parent) {
        final int left = parent.getPaddingLeft();
        final int right = parent.getWidth() - parent.getPaddingRight();

        final int childCount = parent.getChildCount();
        for (int i = 0; i < childCount; i++) {
            final View child = parent.getChildAt(i);
            final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child.getLayoutParams();
            final int top = child.getBottom() + params.bottomMargin;
            final int bottom = top + size;

            c.drawRect(left, top, right, bottom, paint);
        }
    }
}

代码中使用此分割线的类：

 private void initView() {
        recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
//设置recyclerView的布局的排列方向为纵向，默认为纵向
        LinearLayoutManager layoutManager = new LinearLayoutManager(this);
        layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
        recyclerView.setLayoutManager(layoutManager);

        //如果可以确定每个item的高度是固定的，设置这个选项可以提高性能
        recyclerView.setHasFixedSize(true);

        //用系统默认的分割线：
mRecyclerView.addItemDecoration(new DividerItemDecoration(
                getActivity(), DividerItemDecoration.HORIZONTAL_LIST));

        //添加自定义分割线
        DividerLine dividerLine = new DividerLine(DividerLine.VERTICAL);
        dividerLine.setSize(2);
        dividerLine.setColor(getResources().getColor(R.color.dividerLine));
        recyclerView.addItemDecoration(dividerLine);

        BombAdapter adapter = new BombAdapter(this,bombList);
        recyclerView.setAdapter(adapter);
    }

在运行，发现分割线出来了：
这里写图片描述

三、实现RecyclerView的横向滚动的列表：

1.先将item布局改成垂直：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="60dp" 
    android:layout_height="match_parent"
    android:gravity="center_horizontal">
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="50dp"
        android:layout_height="50dp" />
    <TextView
        android:id="@+id/textView"
        android:layout_marginTop="5dp"
        android:gravity="center"
        android:textSize="16sp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>

2.MainActivity代码的innitVIew()方法加一句就ok：

private void initView() {
        recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
        LinearLayoutManager layoutManager = new LinearLayoutManager(this);
        //设置recyclerView的布局的排列方向为横向
        layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
        //设置recyclerView的布局方式为线性布局，默认布局的排列方向为横向为纵向排列
        recyclerView.setLayoutManager(layoutManager);
        BombAdapter adapter = new BombAdapter(this,bombList);
        recyclerView.setAdapter(adapter);
    }

运行：
这里写图片描述

四、实现RecyclerView的瀑布流布局：

1.将item布局改为：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp">
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_gravity="center_horizontal"/>
    <TextView
        android:id="@+id/textView"
        android:layout_marginTop="10dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:layout_gravity="left"/>
</LinearLayout>

2.将recyclerView的布局方式改为瀑布流布局，MainActivity代码：

public class MainActivity extends Activity {

    private RecyclerView recyclerView;
    private List<Bomb> bombList = new ArrayList<>();

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

        initData();
        initView();
    }

    private void initData() {
        for (int i=0;i<2;i++){
            Bomb bomb5 = new Bomb(getRandomLengthName("bomb1"),R.drawable.bomb5);
            bombList.add(bomb5);
            Bomb bomb6 = new Bomb(getRandomLengthName("bomb2"),R.drawable.bomb6);
            bombList.add(bomb6);
            Bomb bomb7 = new Bomb(getRandomLengthName("bomb3"),R.drawable.bomb7);
            bombList.add(bomb7);
            Bomb bomb8 = new Bomb(getRandomLengthName("bomb4"),R.drawable.bomb8);
            bombList.add(bomb8);
            Bomb bomb9 = new Bomb(getRandomLengthName("bomb5"),R.drawable.bomb9);
            bombList.add(bomb9);
            Bomb bomb10 = new Bomb(getRandomLengthName("bomb6"),R.drawable.bomb10);
            bombList.add(bomb10);
            Bomb bomb11 = new Bomb(getRandomLengthName("bomb7"),R.drawable.bomb11);
            bombList.add(bomb11);
            Bomb bomb12 = new Bomb(getRandomLengthName("bomb8"),R.drawable.bomb12);
            bombList.add(bomb12);
            Bomb bomb13 = new Bomb(getRandomLengthName("bomb9"),R.drawable.bomb13);
            bombList.add(bomb13);
            Bomb bomb14 = new Bomb(getRandomLengthName("bomb10"),R.drawable.bomb14);
            bombList.add(bomb14);
            Bomb bomb15 = new Bomb(getRandomLengthName("bomb11"),R.drawable.bomb15);
            bombList.add(bomb15);
            Bomb bomb16 = new Bomb(getRandomLengthName("bomb12"),R.drawable.bomb16);
            bombList.add(bomb16);
        }
    }

    private void initView() {
        recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
        //第一个参数指定布局的列数为3，第二个参数指定布局排列方向
        //若指定排列方向为横向，则显示三行的横向瀑布流
        StaggeredGridLayoutManager layoutManager =
                new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL);
        recyclerView.setLayoutManager(layoutManager);
        BombAdapter adapter = new BombAdapter(this,bombList);
        recyclerView.setAdapter(adapter);
    }

    //获得名字的随机长度
    private String getRandomLengthName(String name){
        Random random = new Random();
        int length = random.nextInt(20)+1;
        StringBuilder sb = new StringBuilder();
        for (int i=0;i<length;i++){
            sb.append(name);
        }
        return sb.toString();
    }
}

运行：
这里写图片描述

五、实现recyclerView的网格布局：
将 StaggeredGridLayoutManager layoutManager =
new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL);
改为
GridLayoutManager layoutManager = new GridLayoutManager(this,3);
即可。运行：
这里写图片描述

六、RecyclerView的点击事件：

RecyclerView需要我们自己给子项具体的View去注册点击事件。请看修改以后的BombAdapter代码：

public class BombAdapter extends RecyclerView.Adapter<BombAdapter.ViewHolder>{

    private List<Bomb> mList;
    private Context mContext;

    public BombAdapter(Context context, List<Bomb> list){
        mList = list;
        mContext = context;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        LayoutInflater inflater = LayoutInflater.from(mContext);
        View view = inflater.inflate(R.layout.item ,null);
        final ViewHolder viewHolder = new ViewHolder(view);

        //为itemView设置点击事件
        viewHolder.bombView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //这句很重要
                int position = viewHolder.getAdapterPosition();
                Toast.makeText(mContext, "你点击了itemVIew----" +   
                      mList.get(position).fruitName, Toast.LENGTH_SHORT).show();
            }
        });

        //为imageView设置点击事件
        viewHolder.imageView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //这句很重要
                int position = viewHolder.getAdapterPosition();
                Toast.makeText(mContext, "你点击了imageVIew----" + 
                       mList.get(position).fruitName, Toast.LENGTH_SHORT).show();
            }
        });

        return viewHolder;
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        Bomb bomb = mList.get(position);
        holder.imageView.setImageResource(bomb.imageId);
        holder.textView.setText(bomb.fruitName);
    }

    @Override
    public int getItemCount() {
        return mList.size();
    }

    static class ViewHolder extends RecyclerView.ViewHolder{
        View bombView; 
        ImageView imageView;
        TextView textView;

        public ViewHolder(View itemView) {
            super(itemView);
            bombView = itemView;
            imageView = (ImageView) itemView.findViewById(R.id.imageView);
            textView = (TextView) itemView.findViewById(R.id.textView);
        }
    }
}