什么是 RecyclerView

RecyclerView 到现在为止可以说是人人皆知了，到目前 RecyclerView 已经完全替代了以前的 ListView、GridView等控件，可以说 RecyclerView 使用起来更加的灵活，高度解耦，高度可定制化，能实现的效果也是非常之多

什么是 SwipeRefreshLayout

SwipeRefreshLayout 是 Google 官方推出的一款下拉刷新组件。使用起来也是非常的方便

什么是 CardView

CardView 继承自 FrameLayout 类，是一种卡片视图，主要是以卡片形式显示内容，可实现圆角和阴影效果的一个控件。大多时候作为 RecyclerView 等列表控件的 item 进行使用

简单使用

按照惯例，我们先看一下效果图：

RecyclerView.gif

从效果图来看，该效果是从上一篇 MaterialDesign（三），CoordinatorLayout、AppBarLayout、CollapsingToolbarLayout使用的基础上实现的，主要实现了 RecyclerView 提供的四种 LayoutManager，RecyclerView item 点击回调监听；SwipeRefreshLayout 下拉刷新操作；CardView 作为 item 的布局展示，下面看看具体实现

引入 com.android.support:cardview
由于 RecyclerView 是 v7 包的控件，v7 包之前已经引入过了，在此仅需单独引入 CardView 对应包

compile 'com.android.support:cardview-v7:26.1.0'

xml 文件创建
activity 的 xml 布局

// ...这里省略了 CoordinatorLayout 相关，完整代码请查看文末的 demo

item 的 xml 布局

SwipeRefreshLayout 和 RecyclerView 的 xml 使用非常简单，不作过多说明，这里主要看 item 中的 CardView 控件，CardView 作为 item 的根布局，里面可以包含任意控件，重点关注一下 CardView 的几个属性

app:cardBackgroundColor 设置卡片布局的背景色
app:cardCornerRadius 设置卡片布局的圆角大小
app:cardElevation 设置卡片布局的阴影大小
app:contentPadding 设置卡片布局内容于边距的间隔

这里只列举几个比较常用的属性值设置，更多属性值可查看 API 文档，这些属性也支持在代码中进行设置

Activity 中获取并设置相关属性值，以及事件监听

@BindView(R.id.refresh_layout)
SwipeRefreshLayout mRefreshLayout;
@BindView(R.id.recycler_view)
RecyclerView mRecyclerView;

mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
    @Override
    public boolean onMenuItemClick(MenuItem item) {
        switch (item.getItemId()) {
            case R.id.action_vertical_layout:
                LinearLayoutManager verticalManager = new LinearLayoutManager(CoordinatorLayoutActivity.this, LinearLayoutManager.VERTICAL, false);
                mRecyclerView.setLayoutManager(verticalManager);
                break;
            case R.id.action_horizontal_layout:
                LinearLayoutManager horizontalManager = new LinearLayoutManager(CoordinatorLayoutActivity.this, LinearLayoutManager.HORIZONTAL, false);
                mRecyclerView.setLayoutManager(horizontalManager);
                break;
            case R.id.action_grid_layout:
                GridLayoutManager gridLayoutManager = new GridLayoutManager(CoordinatorLayoutActivity.this, 2);
                mRecyclerView.setLayoutManager(gridLayoutManager);
                break;
            case R.id.action_staggered_grid_layout:
                StaggeredGridLayoutManager staggeredGridLayoutManager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL);
                // 空隙不作处理，防止item乱跳
                staggeredGridLayoutManager.setGapStrategy(StaggeredGridLayoutManager.GAP_HANDLING_NONE);
                mRecyclerView.setLayoutManager(staggeredGridLayoutManager);
                break;
        }
        return false;
    }
});

// 设置进度条颜色，支持多颜色，第一个颜色值会在手势下拉时作为显示
mRefreshLayout.setColorSchemeColors(Color.RED, Color.GREEN, Color.BLUE);
mRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
    @Override
    public void onRefresh() {
        // 延时2秒执行，模拟网络访问
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                // 结束刷新
                mRefreshLayout.setRefreshing(false);
                Toast.makeText(CoordinatorLayoutActivity.this, "刷新完成", Toast.LENGTH_SHORT).show();
            }
        }, 2000);
    }
});

LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false);
mRecyclerView.setLayoutManager(linearLayoutManager);
final ArrayList list = new ArrayList<>();
for (int i = 0; i < 20; i++) {
    list.add(i + "");
}
MyRecyclerViewAdapter adapter = new MyRecyclerViewAdapter(list);
mRecyclerView.setAdapter(adapter);

adapter.setOnItemClickListener(new MyRecyclerViewAdapter.IOnItemClickListener() {
    @Override
    public void onItemClick(View view, int position) {
        Toast.makeText(CoordinatorLayoutActivity.this, "点击了：" + list.get(position), Toast.LENGTH_SHORT).show();
    }
}); 

public class MyRecyclerViewAdapter extends RecyclerView.Adapter {

    private ArrayList mList;

    private IOnItemClickListener mOnItemClickListener;

    public MyRecyclerViewAdapter(ArrayList list) {
        this.mList = list;
    }

    @Override
    public MyRecyclerViewAdapter.MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_recycler_view_layout, parent, false);
        return new MyViewHolder(view);
    }

    @Override
    public void onBindViewHolder(final MyViewHolder holder, int position) {
        holder.mTextView.setText(mList.get(position));
        // 动态改变 ImageView 高度
        ViewGroup.LayoutParams params = holder.mImageView.getLayoutParams();
        params.height = (int) (100 + Math.random() * 200);
        holder.mImageView.setLayoutParams(params);

        // 设置item点击监听
        if (null != mOnItemClickListener) {
            holder.itemView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    mOnItemClickListener.onItemClick(view, holder.getLayoutPosition());
                }
            });
        }
    }

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

    /**
     * 设置item监听器
     *
     * @param onItemClickListener
     */
    public void setOnItemClickListener(IOnItemClickListener onItemClickListener) {
        mOnItemClickListener = onItemClickListener;
    }

    public class MyViewHolder extends RecyclerView.ViewHolder {
        public ImageView mImageView;
        public TextView mTextView;

        public MyViewHolder(View itemView) {
            super(itemView);
            mImageView = itemView.findViewById(R.id.iv_item);
            mTextView = itemView.findViewById(R.id.tv_item);
        }
    }

    /**
     * item 回调监听
     * 由于 RecyclerView 没有提供item的点击监听，所以要自己提供接口进行回调
     */
    public interface IOnItemClickListener {
        void onItemClick(View view, int position);
    }
}

首先看 SwipeRefreshLayout 设置了下拉时进度条的颜色值，并设置了刷新时的事件监听，在里面我们延时2秒（模拟网络访问）执行了 mRefreshLayout.setRefreshing(false) 方法来结束刷新，必须调用此方法后进度条才会消失

重点看一下 RecyclerView 的使用。首先要为 RecyclerView 设置 LayoutManager，然后和 ListView 用法类似，也是需呀设置 Adapter。比较麻烦的是如果你需要设置 item 的分割线，需要调用 mRecyclerView.addItemDecoration() 方法进行设置，该方法的参数是 RecyclerView.ItemDecoration，需要我们自己去实现，如果只是简单的分割线，我一般都会在 item 的 xml 布局里进行添加。还有 RecyclerView 并没有为我们提供 item 点击事件的设置，所以我们要在 Adapter 里提供一个接口回调，再进行设置，其他事件类似。

adapter 的代码和 ListView 的 adapter 用法区别不大，在 onBindViewHolder 方法里，我们动态改变 ImageView 的高度主要是为了在为 RecyclerView 设置 StaggeredGridLayoutManager（瀑布流）的时候能较明显的看出其效果

最后在 Toolbar 菜单项点击的时候对 RecyclerView 的 LayoutManager 进行切换，展示系统提供的几种布局

LinearLayoutManager 线性管理器，支持横向、纵向
GridLayoutManager 网格布局管理器
StaggeredGridLayoutManager 瀑布流式布局管理器

这里我们只是简单的介绍一下 RecyclerView，如果想要更详细的学习，可以参考鸿洋大神的文章 Android RecyclerView 使用完全解析体验艺术般的控件

结语

本文主要简单介绍了 RecyclerView + SwipeRefreshLayout + CardView 的使用。RecyclerView 在实际开发中应用非常广泛，只有你想不到，没有他做不到的时候，所以 RecyclerView 还是非常值得学习使用的。本文 demo 已上传到 github

下面是几个控件的官方 API 地址（自备梯子）

RecyclerView API
SwipeRefreshLayout API
CardView API

MaterialDesign（四），RecyclerView、SwipeRefreshLayout、CardView使用

什么是 RecyclerView

什么是 SwipeRefreshLayout

什么是 CardView

简单使用

结语

你可能感兴趣的:(MaterialDesign（四），RecyclerView、SwipeRefreshLayout、CardView使用)