RecyclewView的基本使用与进阶(一)

最近打算把RecyclerView重新整理一下,从最基础的使用到各种定制化的进阶使用,开一个小系列,本系列不讲源码,只讲如何使用,如果有什么问题请指出
本系列打算整理以下使用方法:
1、RecyclerView的简单使用
2、RecyclerView添加分割线,定制分割线
3、RecyclerView添加item动画
4、RecyclerView复杂布局
5…(想到再加)

RecyclerView的简单使用

其实跟ListView使用步骤一样,只是有些细微的不同,先来张效果图

那么接下来就开始本篇博客的正文,如何使用RecyclerView,步骤如下:

首先依赖RecyclerView

在module的build.gradle中添加依赖:

compile 'com.android.support:recyclerview-v7:25.3.1'

使用RecyclerView

完成依赖后,自然在是Activity的布局文件中使用RecyclerView:

<android.support.v7.widget.RecyclerView
        android:id="@+id/rv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

再去Activity中绑定Id

rv = (RecyclerView) findViewById(R.id.rv);

写Adapter

接下来就是写Adapter了,与ListView不同的是,RecyclerView必须要写ViewHolder

public class RvAdapter extends RecyclerView.Adapter<RvAdapter.RvHolder> {
    private List<Integer> list;

public RvAdapter(List list) {
    this.list = list;
}

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

@Override
public void onBindViewHolder(RvHolder holder, int position) {
    holder.img.setBackgroundResource(list.get(position));
}

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

class RvHolder extends RecyclerView.ViewHolder {
    ImageView img;

public RvHolder(View itemView) {
    super(itemView);
    img = (ImageView) itemView.findViewById(R.id.img);
}

}

}

item的布局也很简单

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:orientation="vertical">
<ImageView
    android:id="@+id/img"
    android:layout_width="100dp"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:layout_marginBottom="10dp"/>
</LinearLayout>

传递数据并设置RecyclerView的LayoutManager

最后我们在Activity中将数据传到adapter中

public class MainActivity extends AppCompatActivity {
    private RecyclerView rv;
    private List<Integer> list;
    private RvAdapter adapter;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    rv = (RecyclerView) findViewById(R.id.rv);
    list = new ArrayList<>();
    for (int i = 0; i < 3; i++) {
        list.add(R.mipmap.p1);
        list.add(R.mipmap.p2);
        list.add(R.mipmap.p3);
        list.add(R.mipmap.p4);
        list.add(R.mipmap.p5);
        list.add(R.mipmap.p6);
    }
    adapter = new RvAdapter(list);
    rv.setLayoutManager(new LinearLayoutManager(this));
    rv.setAdapter(adapter);
}

}

这样就大功告成了,来看看效果:

GridLayout

接下来看看RecyclerView的强大之处,如果我们想要GridView的效果怎么办?重写?no no no no,只需要修改一句代码即可,就是我们的LayoutManager:

rv.setLayoutManager(new GridLayoutManager(this,2));

来看看效果:

瀑布流

瀑布流实现也非常的简单,同样是更改LayoutManager:

rv.setLayoutManager(new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL));

先来看看效果:

咋跟Grid一样的效果??
不急,先理清思路,实现瀑布流关键就在于那个不同的高度,既然这样,就直接给每个item设置不同的高度就行了,那么就去adapter中去设置随机高度:

private void randomHeight(List<Integer> list){
           heights = new ArrayList<>();
           for (int i = 0; i <list.size() ; i++) {
               heights.add((int) (300+Math.random()*300));
           }
       }

然后在onBindViewHolder中给每个item设置随机高度:

RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) holder.itemView.getLayoutParams();
    params.height = heights.get(position);
    holder.itemView.setLayoutParams(params);

最后来看看效果:

虽然比较简陋,也算是一个简单的瀑布流,各位根据自己的需求更改吧,下一篇讲讲分割线的绘制

坚持原创技术分享,您的支持将鼓励我继续创作!