RecycleView实现瀑布流

现在列表的布局较少用ListView，而大多数采用的是RecycleView，RecycleView可以有较多的变换，非常的灵活，也可以自定义设计你想要的动画或者是分割线，所以比较受欢迎吧。

RecycleView使用

1.Bind RecycleView

使用了butterknife来绑定，稍稍可以偷懒一点

@Bind(R.id.id_recycle)
RecyclerView recyclerView;

2.设置布局管理器

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

这里设置的是实现流式布局，设置的2列，方向是垂直的，实现瀑布流就是用流式布局

3.设置adapter

 recyclerView.setAdapter(photoAdapter);

4.设置分割线和动画

recyclerView.addItemDecoration( new DividerGridItemDecoration(this ));  
recyclerView.setItemAnimator( new DefaultItemAnimator());  

其中主要难点在于adapter

自定义的adapter要继承RecycleView.Adapter，在adapter中要使ViewHolder继承自RecycleView.ViewHolder

在此之前定义了PhotoEntity实体类，里面有photo的各种信息（这个不重要），并且定义了一个photo.xml，这个是每个图片的布局，有imageView和textView

RecycleView.Adapter有三个方法：

onCreateViewHolder() : 这个类似于getView，返回的是ViewHolder，用来加载视图

onBindViewHolder() ： 将数据等添加到ViewHolder

getItemCount() ：获得列表的数量

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


    List<PhotoEntity> mList;    //图片列表
    Fragment mFragment; //图片点击加载的fragment


    public  PhotoAdapter(List<PhotoEntity> mList,Fragment fragment){
        this.mList = mList;
        this.mFragment = fragment;
    }
    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {  //相当于getView，返回加载的视图
        View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.photo,parent);
        ViewHolder viewHolder = new ViewHolder(v);
        return viewHolder;
    }


    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {


        //加载picasso
        PhotoEntity photo = mList.get(position);
        Picasso
                .with(mFragment.getContext())
                .load(Uri.parse(photo.getUrl()))
                .centerCrop()
                .into(holder.iv_photo);
        String desc = photo.getDesc();
        holder.tv_photo.setText(desc);
    }


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


    public class ViewHolder extends RecyclerView.ViewHolder {
        @Bind(R.id.iv_photo)
        ImageView iv_photo;
        @Bind(R.id.tv_photo)
        TextView tv_photo;


        public ViewHolder(View itemView) {
            super(itemView);
            ButterKnife.bind(this,itemView);
        }
    }
}

在activity中把adapter与RecycleView绑定起来

photoAdapter = new PhotoAdapter(photo,this);
recyclerView.setAdapter(photoAdapter);
//实现瀑布流，两列
recyclerView.setLayoutManager(new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL));
recyclerView.setItemAnimator(new DefaultItemAnimator());

这就实现了瀑布流的布局。我们可以通过SwipeRefreshLayout实现下拉刷新
过程如下：

1.Bind SwipeRefreshLayout

@Bind(R.id.swipe_refresh_layout)
SwipeRefreshLayout swipeRefreshLayout;

2.设置下拉刷新的颜色

 swipeRefreshLayout.setColorSchemeResources(R.color.refresh_process1, R.color.refresh_process2, R.color.refresh_process3);

3.加载，mIsFirstCreate开始设置为true，为第一次创建，自然先要加载

</pre><pre name="code" class="plain">swipeRefreshLayout.measure(View.MEASURED_SIZE_MASK, View.MEASURED_HEIGHT_STATE_SHIFT);
        if (mIsFirstCreated){
            onRefresh();
        }

4.执行刷新，loadMore是刷新的执行体

public void onRefresh() {
        swipeRefreshLayout.setRefreshing(true);
        mPresenter.loadMore(page);
        mIsFirstCreated = false;
    }

5.停止刷新

 public void finishRefresh() {
        swipeRefreshLayout.setRefreshing(false);
    }