Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!

将相本无种,男儿当自强。这篇文章主要讲述Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!相关的知识,希望能为你提供帮助。
android 高级控件(六)——RecyclerView的方方面面,让你知道他的魅力!

RecyclerView出来很长时间了,相信大家都已经比较了解了,这里我把知识梳理一下,其实你把他看成一个升级版的ListView也是可以的,为什么这样说呢?我们一起来学习一下!
一.RecyclerView的基本使用
使用RecyclerView的话,大家都知道,他是V7里面的控件,所以我们需要添加源,但是大家的Gradle版本都是不一样的,这里介绍一下一种比较方便的添加方法,我们右键我们的项目
Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!

文章图片

选择open module settings,然后依次选择我们的app-Dependencies,点击+号,选择Library Dependency,然后搜索RecyclerView就好了
Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!

文章图片

好的,添加完成之后我们就可以在Build.gradle里面看到我们添加的源了
compile ‘com.android.support:recyclerview-v7:24.2.0‘

现在我们就可以开始使用RecyclerView了,在布局里添加
< ?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="match_parent"> < android.support.v7.widget.RecyclerView android:id="@+id/mRecyclerView" android:layout_width="match_parent" android:layout_height="match_parent"/> < /LinearLayout>

我们先来模拟一下一些基础数据,最基本的写法:
public class MainActivity extends AppCompatActivity {private RecyclerView mRecyclerView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initView(); }/** * 初始化View */ private void initView() { mRecyclerView = (RecyclerView) findViewById(R.id.mRecyclerView); //设置布局,这里我们使用线性布局 mRecyclerView.setLayoutManager(new LinearLayoutManager(this)); //设置适配器 mRecyclerView.setAdapter(new RecyclerView.Adapter() { @Override public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { return new ViewHolder(new TextView(parent.getContext())); }@Override public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) { ViewHolder vh = (ViewHolder) holder; vh.tv.setText("我是item:" + position); }@Override public int getItemCount() { return 10; }class ViewHolder extends RecyclerView.ViewHolder { private TextView tv; public ViewHolder(TextView itemView) { super(itemView); tv = itemView; }public TextView getTv() { return tv; } } }); } }

OK,运行一下
Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!

文章图片

成功的运行,但是你看到,他也太丑了吧,还有,你这都是什么烂代码,怎么一点扩展性都没有,没错,因为我这还只是演示的,看官仔细看,我们接下来要做的事情!
二.RecyclerView的item
我们上面那个写死了,现在我们来个扩展性强的,我们都知道listview一般是写个item,有个实体类,还有个adapter对吧,那我们也是一样的:
首先我们的item
< ?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="match_parent" android:orientation="vertical"> < TextView android:id="@+id/tvTitle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="30sp"/> < TextView android:id="@+id/tvContent" android:layout_width="wrap_content" android:layout_height="wrap_content"/> < /LinearLayout>

然后就是我们的实体类了
package com.liuguilin.recyclerviewsample; /* *项目名:RecyclerViewSample *包名:com.liuguilin.recyclerviewsample *文件名:ItemData *创建者:LGL *创建时间:2016/10/7 13:48 *描述:实体类 */public class ItemData {private String title; private String content; public String getTitle() { return title; }public void setTitle(String title) { this.title = title; }public String getContent() { return content; }public void setContent(String content) { this.content = content; } }

再接着实现我们的adapter
package com.liuguilin.recyclerviewsample; /* *项目名:RecyclerViewSample *包名:com.liuguilin.recyclerviewsample *文件名:RecyclerViewAdapter *创建者:LGL *创建时间:2016/10/7 13:10 *描述:TODO */import android.support.v7.widget.RecyclerView; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView; import java.util.List; public class RecyclerViewAdapter extends RecyclerView.Adapter {private List< ItemData> mList; public RecyclerViewAdapter(List< ItemData> mList) { this.mList = mList; }@Override public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {return new ViewHolder(LayoutInflater.from(parent.getContext()) .inflate(R.layout.list_item, null)); }@Override public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) { ViewHolder vh = (ViewHolder) holder; ItemData item = mList.get(position); vh.getTvTitle().setText(item.getTitle()); vh.getTvContent().setText(item.getContent()); }@Override public int getItemCount() { return mList.size(); }class ViewHolder extends RecyclerView.ViewHolder {private View mView; private TextView tvTitle; private TextView tvContent; public ViewHolder(View mView) { super(mView); tvTitle = (TextView) mView.findViewById(R.id.tvTitle); tvContent = (TextView) mView.findViewById(R.id.tvContent); }public TextView getTvTitle() { return tvTitle; }public TextView getTvContent() { return tvContent; } } }

做完这些,我们就去填充下数据
package com.liuguilin.recyclerviewsample; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.RecyclerView; import java.util.ArrayList; import java.util.List; public class MainActivity extends AppCompatActivity {private RecyclerView mRecyclerView; private List< ItemData> mList = new ArrayList< > (); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initView(); }/** * 初始化View */ private void initView() { mRecyclerView = (RecyclerView) findViewById(R.id.mRecyclerView); //设置布局,这里我们使用线性布局 mRecyclerView.setLayoutManager(new LinearLayoutManager(this)); for (int i = 0; i < 100; i++) { ItemData item = new ItemData(); item.setTitle("Title" + i); item.setContent("Content:" + i); mList.add(item); } //设置适配器 mRecyclerView.setAdapter(new RecyclerViewAdapter(mList)); } }

好的,我们来运行一下:
Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!

文章图片

这个扩展就比较高了对吧;我们继续来看。
三.RecyclerView的样式
你们看了这么久了肯定会觉得这个太丑了,想定义下样式,事实上,RecyclerView很灵活,很多都是通过代码来控制的不像listview一样是xml设置,我们看下setLayoutManager的具体使用姿势:
//设置布局,这里我们使用线性布局 mRecyclerView.setLayoutManager(new LinearLayoutManager(this,LinearLayoutManager.HORIZONTAL,false));

我们设置水平的,来看看效果
Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!

文章图片

我们可以看到,水平了,这三个参数分别是:上下文,布局方向,是否旋转,我们现在把是否旋转设置为true再来看下效果:
Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!

文章图片

显而易见,数据是倒过来的了,当然我们也不只是一种布局,我们设置表格布局
mRecyclerView.setLayoutManager(new GridLayoutManager(this,3));

参数是3列的含义,我们来看下:
Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!

文章图片

好的,基本的你学会了吗?我们还有一个属性是添加分割线的,很多同学并不知道在哪里添加,其实他是需要代码设置的;
//添加分割线 mRecyclerView.addItemDecoration(new MyDecoration(this,MyDecoration.VERTICAL_LIST));

但是这个MyDecoration是什么?官方为我们提供了例子,这里就不演示了
package com.liuguilin.recyclerviewsample; /* *项目名:RecyclerViewSample *包名:com.liuguilin.recyclerviewsample *文件名:MyDecoration *创建者:LGL *创建时间:2016/10/7 14:22 *描述:分割线 */import android.content.Context; import android.content.res.TypedArray; import android.graphics.Canvas; import android.graphics.Rect; import android.graphics.drawable.Drawable; import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.RecyclerView; import android.view.View; public class MyDecoration extends RecyclerView.ItemDecoration{private Context mContext; private Drawable mDivider; private int mOrientation; public static final int HORIZONTAL_LIST = LinearLayoutManager.HORIZONTAL; public static final int VERTICAL_LIST = LinearLayoutManager.VERTICAL; //我们通过获取系统属性中的listDivider来添加,在系统中的AppTheme中设置 public static final int[] ATRRS= new int[]{ android.R.attr.listDivider }; public MyDecoration(Context context, int orientation) { this.mContext = context; final TypedArray ta = context.obtainStyledAttributes(ATRRS); this.mDivider = ta.getDrawable(0); ta.recycle(); setOrientation(orientation); }//设置屏幕的方向 public void setOrientation(int orientation){ if (orientation != HORIZONTAL_LIST & & orientation != VERTICAL_LIST){ throw new IllegalArgumentException("invalid orientation"); }mOrientation = orientation; }@Override public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) { if (mOrientation == HORIZONTAL_LIST){ drawVerticalLine(c, parent, state); }else { drawHorizontalLine(c, parent, state); } }//画横线, 这里的parent其实是显示在屏幕显示的这部分 public void drawHorizontalLine(Canvas c, RecyclerView parent, RecyclerView.State state){ int left = parent.getPaddingLeft(); int right = parent.getWidth() - parent.getPaddingRight(); final int childCount = parent.getChildCount(); for (int i = 0; i < childCount; i++){ final View child = parent.getChildAt(i); //获得child的布局信息 final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams)child.getLayoutParams(); final int top = child.getBottom() + params.bottomMargin; final int bottom = top + mDivider.getIntrinsicHeight(); mDivider.setBounds(left, top, right, bottom); mDivider.draw(c); //Log.d("wnw", left + " " + top + " "+right+""+bottom+" "+i); } }//画竖线 public void drawVerticalLine(Canvas c, RecyclerView parent, RecyclerView.State state){ int top = parent.getPaddingTop(); int bottom = parent.getHeight() - parent.getPaddingBottom(); final int childCount = parent.getChildCount(); for (int i = 0; i < childCount; i++){ final View child = parent.getChildAt(i); //获得child的布局信息 final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams)child.getLayoutParams(); final int left = child.getRight() + params.rightMargin; final int right = left + mDivider.getIntrinsicWidth(); mDivider.setBounds(left, top, right, bottom); mDivider.draw(c); } }//由于Divider也有长宽高,每一个Item需要向下或者向右偏移 @Override public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) { if(mOrientation == HORIZONTAL_LIST){ //画横线,就是往下偏移一个分割线的高度 outRect.set(0, 0, 0, mDivider.getIntrinsicHeight()); }else { //画竖线,就是往右偏移一个分割线的宽度 outRect.set(0, 0, mDivider.getIntrinsicWidth(), 0); } } }

设置完之后我们来运行一下
Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!

文章图片

好的,分割线野有了,如果我们要自定义一下最喜欢个分割线,我们可写一个xml
< ?xml version="1.0" encoding="utf-8"?> < shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> < solid android:color="@color/colorAccent"/> < size android:height="1dp"/> < /shape>

然后在我们的主题里面引用
< !-- Base application theme. --> < style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> < !-- Customize your theme here. --> < item name="colorPrimary"> @color/colorPrimary< /item> < item name="colorPrimaryDark"> @color/colorPrimaryDark< /item> < item name="colorAccent"> @color/colorAccent< /item> < item name="android:listDivider"> @drawable/divider< /item> < /style>

再来运行一下
Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!

文章图片

OK,到这里这个样式已经基本上没什么问题了
四.RecyclerView的Adapter
我们把Adapter放后面讲,也是希望大家先去看下代码,本身代码也不多,以这个adapter为例,我简单的说话这些方法的作用
  • 构造方法
传递参数的,没什么可说的
  • onCreateViewHolder
这里我们一般是来初始化我们的布局的,也就是我们item
  • onBindViewHolder
绑定View之后就在这里面进行赋值了,分工明确
  • getItemCount
返回数据长度,没什么可说的
  • ViewHolder
继承RecyclerView.ViewHolder,对item的view进行初始化,也就是我们的缓存对象
【Android 高级控件——RecyclerView的方方面面,让你知道他的魅力!】到这里,大家是不是已经学会了呢?如果没有学会的话,请加群:555974449我们继续学习
Demo下载:http://download.csdn.net/detail/qq_26787115/9646804

    推荐阅读