RecyclerView告别低级的ListView，让你的列表更具观赏性（一）

引言

提起Android开发，你能想到最浪漫的事，就是撸个炫酷的ListView的Adapter把你的数据按列表形式展示出来了吧？其实大可不必！老套的ListView已经不能满足现在的开发需求了，缺点相当明显，比如你想要列表横向滚动，你会发现ListView无计可施！

这就不得不来介绍下今天的主角了：RecyclerView。跟随我的脚步一起来学习吧～

介绍

RecyclerView是support.v7包中的控件，可以说是ListView和GridView的增强升级版。

RecyclerView的强大和可扩展性离不开其众多辅助类。其中Adapter和ViewHolder以及LayoutManager是展示列表所必须的，其他辅助类配合能完成更多复杂炫酷的需求。

区别

（1）Listview中ViewHolder是需要自定义的，在RecyclerView中ViewHolder是谷歌已经封装好的。

（2）Listview中的Item是只能垂直滑动的，RecyclerView可以水平滑动或者垂直滑动，针对多种类型条目的展示效果，如瀑布流网格支持多种类型。

（3）Listview中删除或添加item时，item是无法产生动画效果的，在RecyclerView中添加、删除或移动item时有两种默认的效果可以选择SimpleItemAnimator（简单条目动画）和 DefaultItemAnimator（原样的条目动画）。

Tips：RecyclerView还提供了ItemDecoration，可以自定义我们的动画样式哦，后续我也会通过博客分享出来。本文的最后会先给大家看一下我们自定义动画后实现的“炫酷”效果。

用法

第一篇RecyclerView只写瀑布流的用法，实现跟ListView同样的功能，后续会分享更多其他比ListView更强大的用法。

第一步：添加相关依赖（app下build.gradle）

implementation "com.google.android.material:material:1.1.0-alpha07"

第二步：布局文件中使用控件

（1）主布局：activity的xml布局文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".blog.Case21"
    android:orientation="vertical">
    
    <androidx.appcompat.widget.Toolbar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:title="Recyclerview示例"
        app:titleTextColor="@color/white"
        android:background="@color/green"/>

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

</LinearLayout>

（2）子布局：R.layout.case7_item_fruit.xml

形式：左边图片+右边文字

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/white"
        android:orientation="horizontal"
        android:padding="5dp"
        tools:ignore="MissingConstraints">

        <ImageView
            android:id="@+id/fruit_image"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"/>

        <TextView
            android:id="@+id/fruit_name"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_marginLeft="10dp"
            android:layout_weight="1"
            android:gravity="center"
            android:textColor="@color/black"
            android:textSize="20sp" />
    </LinearLayout>

第三步：创建实体类Fruit（为RecyclerView填充数据使用）

/**
 * @data on 2020/8/27 9:47 PM
 * @auther  ArmStrong
 * @describe  
 */
public class Fruit {
    private String name;
    private int imageId;

    public Fruit(String name, int imageId) {
        this.name = name;
        this.imageId = imageId;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getImageId() {
        return imageId;
    }

    public void setImageId(int imageId) {
        this.imageId = imageId;
    }
}

第四步：创建RecyclerView的适配器类

/**
 * @data on 2020/8/28 1:51 PM
 * @auther
 * @describe
 */
public class FruitRecyclerViewAdapter extends RecyclerView.Adapter<FruitRecyclerViewAdapter.MyViewHolder>{
    private List<Fruit> fruitList;


    public FruitRecyclerViewAdapter(List<Fruit> fruitList) {
        this.fruitList = fruitList;
    }

    @NonNull
    @Override
    public MyViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
       View itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.case7_item_fruit,parent,false);
       final MyViewHolder holder = new MyViewHolder(itemView);
       return holder;
    }

    @Override
    public void onBindViewHolder(@NonNull MyViewHolder holder, int position) {
        Fruit fruitItem = fruitList.get(position);
        holder.fruitImage.setImageResource(fruitItem.getImageId());
        holder.fruitName.setText(fruitItem.getName());
        //item的点击事件
        holder.fruitView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                int positon = holder.getAdapterPosition();
                Fruit fruit = fruitList.get(positon);
                Toast.makeText(v.getContext(),"ver："+"你点击了"+fruit.getName(),Toast.LENGTH_SHORT).show();
            }
        });
    }

    public static class MyViewHolder extends RecyclerView.ViewHolder{
        View fruitView;

        //图片
        public ImageView fruitImage;
        //标题
        public TextView fruitName;

        public MyViewHolder(View itemView) {
            super(itemView);
            fruitView = itemView;
            fruitImage = itemView.findViewById(R.id.fruit_image);
            fruitName = itemView.findViewById(R.id.fruit_name);
        }
    }

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

}

第五步：Activity中为控件绑定适配器类

public class Case21 extends AppCompatActivity {
    private RecyclerView mRecyclerView;
    private FruitRecyclerViewAdapter adapter;
    private LinearLayoutManager layoutManager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_case21);
        mRecyclerView = findViewById(R.id.recyclerView);

        //RecyclerView填充数据
        List<Fruit> mList = new ArrayList();
        for ( int i=1 ; i<20 ; i++){
            mList.add(new Fruit("apple"+i,R.mipmap.apple));
        }

        //瀑布流布局
        adapter = new FruitRecyclerViewAdapter(mList);
        layoutManager = new LinearLayoutManager(this);
        layoutManager.setOrientation(RecyclerView.VERTICAL);
        mRecyclerView.setLayoutManager(layoutManager);
        mRecyclerView.setAdapter(adapter);
        mRecyclerView.setItemAnimator(new DefaultItemAnimator());
    }
}

运行效果

本期效果：

RecyclerView（一）.gif

后续达到的效果：

RecyclerViewFinal.gif

解析

（1）：布局加载分析

RecyclerView需要通过setLayoutManager()方法设置布局管理器，同时需要setAdapter()绑定适配器，用于填充数据。而可以看到RecyclerView是通过自定义ViewHolder的方式来加载的item文件，并且绑定到控件的id，这一幕何其熟悉，不正是activity的加载布局和定义控件，使用流程嘛！

（2）：填充数据分析

在RecyclerView中，使用重写的onBindViewHolder方法来，通过ViewHolder对我们定义和绑定的控件进行数据填充。而我们请求的数据从哪里来呢？当然是从接口请求最后封装成列表数据，从而提取出来，FruitList其实就是模拟出了这种情景，所以需要我们在Adapter中定义构造函数，参数就是我们的数据源：fruitList。

而在activity中，只需要创建该Adapter，调用其构造方法传递参数进去，就可以了，后续定义控件以及绑定控件id全部交由Adapter中的ViewHolder帮助我们来完成。

（3）：点击事件分析

点击跳转到详情页是每个列表都需要实现的标准业务逻辑，这里的点击事件就是模拟这个操作。而在RecyclerView中点击事件也不得不借助ViewHolder，在自定义ViewHolder中定义控件和绑定控件的时候需要定义itemView，这样在onBindViewHolder中就可以通过Viewholder的方式来获取我们的整个列表item控件的View布局了，点击事件setOnClickListener，重写onClick方法就可以了。是不是很简单！

千夜零一："之前总是看各种博客学习东西，现在我想用博客记录下我的学习脚步，好东西也需要分享，索取和给予是相互的。以后会尽量日更的！目标完成1001篇博客哈哈。”
如果觉得对你有所帮助，请不要吝啬你的点赞，有问题也可以在下方评论区留言哦，关注我一起学习吧～