首先,我们看一下效果,先是下拉从上到下更新5个数据项;然后滑到底部,上拉从底部向上添加5个数据项:
我们使用的第三方库,因此在gradle配置文件中先加进来:
implementation 'com.android.support:recyclerview-v7:25.3.1'
implementation 'com.scwang.smartrefresh:SmartRefreshLayout:1.1.0-alpha-14'
implementation 'com.scwang.smartrefresh:SmartRefreshHeader:1.1.0-alpha-14'
然后就是写一个普普通通的RecyclerView,它的布局文件和item的布局如下:
item布局,就一个textView:
下面就是我们主文件,完整的例子,里面注释写的非常详细,复制,粘贴到自己的项目中就可以实现上面动态图中的效果啦:
public class MainActivity extends AppCompatActivity {
private RecyclerView mRecyclerView;
private MyAdapter mAdapter;
private LinearLayoutManager mLayoutManager;
private RefreshLayout refreshLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
mRecyclerView = (RecyclerView)findViewById(R.id.my_recycler_view);
mLayoutManager = new LinearLayoutManager(this);
mRecyclerView.setLayoutManager(mLayoutManager);
mRecyclerView.addItemDecoration(new DividerItemDecoration(this, LinearLayoutManager.VERTICAL));
mRecyclerView.setHasFixedSize(true);
mAdapter = new MyAdapter(getDatas());
mRecyclerView.setAdapter(mAdapter);
}
private void initView() {
refreshLayout = (RefreshLayout) findViewById(R.id.refreshLayout);
/**
* 设置不同的头部、底部样式
*/
// refreshLayout.setRefreshFooter(new ClassicsFooter(this).setSpinnerStyle(SpinnerStyle.Scale));
// refreshLayout.setRefreshHeader(new BezierRadarHeader(this));
// refreshLayout.setRefreshHeader(new TwoLevelHeader(this));
refreshLayout.setRefreshFooter(new BallPulseFooter(this).setSpinnerStyle(SpinnerStyle.Scale));
refreshLayout.setRefreshHeader(new MaterialHeader(this).setShowBezierWave(true));
//设置样式后面的北京颜色
refreshLayout.setPrimaryColorsId(R.color.colorPrimary, android.R.color.white);
//设置监听器,包括顶部下拉刷新、底部上滑刷新
refreshLayout.setOnMultiPurposeListener(new SimpleMultiPurposeListener(){
@Override
public void onRefresh(@NonNull RefreshLayout refreshLayout) {
mAdapter.refreshData(MoreDatas()); //下拉刷新,数据从上往下添加到界面上
refreshLayout.finishRefresh(1000); //这个记得设置,否则一直转圈
}
@Override
public void onLoadMore(@NonNull RefreshLayout refreshLayout) {
mAdapter.loadMore(MoreDatas()); //上滑刷新,数据从下往上添加到界面上
refreshLayout.finishLoadMore(1000); //这个记得设置,否则一直转圈
}
});
/**
* 上面的那个是多监听器,可以直接将多个监听卸载一个listener中,当然也可以写成下面的形式,是一样的效果
*/
// refreshLayout.setOnRefreshListener(new OnRefreshListener() {
// @Override
// public void onRefresh(@NonNull RefreshLayout refreshLayout) {
// mAdapter.refreshData(MoreDatas()); //下拉刷新,数据从上往下添加到界面上
// refreshLayout.finishRefresh(1000); //这个记得设置,否则一直转圈
// }
// });
//
// refreshLayout.setOnLoadMoreListener(new OnLoadMoreListener() {
// @Override
// public void onLoadMore(@NonNull RefreshLayout refreshLayout) {
// mAdapter.loadMore(MoreDatas()); //上滑刷新,数据从下往上添加到界面上
// refreshLayout.finishLoadMore(1000); //这个记得设置,否则一直转圈
// }
// });
}
//原始的recyclerView数据
private ArrayList getDatas() {
ArrayList data = new ArrayList();
String temp = " item";
for(int i = 0; i < 15; i++) {
data.add(i + temp);
}
return data;
}
//刷新得到的数据
private ArrayList MoreDatas() {
ArrayList data = new ArrayList();
String temp = "新加数据 ";
for(int i = 0; i < 6; i++) {
data.add(temp + i);
}
return data;
}
public static class MyAdapter extends RecyclerView.Adapter {
public ArrayList datas = null;
public MyAdapter(ArrayList datas) {
this.datas = datas;
}
//创建新View,被LayoutManager所调用
@Override
public ViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {
View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.item,viewGroup,false);
ViewHolder vh = new ViewHolder(view);
return vh;
}
//将数据与界面进行绑定的操作
@Override
public void onBindViewHolder(ViewHolder viewHolder, int position) {
viewHolder.mTextView.setText(datas.get(position));
}
//获取数据的数量
@Override
public int getItemCount() {
return datas.size();
}
//底部上拉刷新,数据直接在底部显示
public void loadMore(ArrayList strings) {
datas.addAll(strings);
notifyDataSetChanged();
}
//底部下拉刷新,数据直接从上往下添加数据,显示在顶部
public void refreshData(ArrayList strings) {
datas.addAll(0, strings);
notifyDataSetChanged();
// notifyItemInserted(0); 一次只能加一项数据
}
//自定义的ViewHolder,持有每个Item的的所有界面元素
public static class ViewHolder extends RecyclerView.ViewHolder {
public TextView mTextView;
public ViewHolder(View view){
super(view);
mTextView = (TextView) view.findViewById(R.id.text);
}
}
}
}
具体还有很多其他用法,请看官网中的例子:https://github.com/scwang90/SmartRefreshLayout
当然。学习这个库也很简单,基本就是学会使用,库中的回调函数即可,例如需要下拉刷新了就监听 setOnRefreshListener
需要上拉刷新了就监听 setOnLoadMoreListener或者使用多功能监听器
setOnMultiPurposeListener重写里面的onRefresh()或者onLoadMore()方法即可实现和上面一样的效果:
//第一种写法:设置监听器,包括顶部下拉刷新、底部上滑刷新
refreshLayout.setOnMultiPurposeListener(new SimpleMultiPurposeListener(){
@Override
public void onRefresh(@NonNull RefreshLayout refreshLayout) {
mAdapter.refreshData(MoreDatas()); //下拉刷新,数据从上往下添加到界面上
refreshLayout.finishRefresh(1000); //这个记得设置,否则一直转圈
}
@Override
public void onLoadMore(@NonNull RefreshLayout refreshLayout) {
mAdapter.loadMore(MoreDatas()); //上滑刷新,数据从下往上添加到界面上
refreshLayout.finishLoadMore(1000); //这个记得设置,否则一直转圈
}
});
/**
* 第二种写法:
* 上面的那个是多监听器,可以直接将多个监听卸载一个listener中,当然也可以写成下面的形式,是一样的效果
*/
// refreshLayout.setOnRefreshListener(new OnRefreshListener() {
// @Override
// public void onRefresh(@NonNull RefreshLayout refreshLayout) {
// mAdapter.refreshData(MoreDatas()); //下拉刷新,数据从上往下添加到界面上
// refreshLayout.finishRefresh(1000); //这个记得设置,否则一直转圈
// }
// });
//
// refreshLayout.setOnLoadMoreListener(new OnLoadMoreListener() {
// @Override
// public void onLoadMore(@NonNull RefreshLayout refreshLayout) {
// mAdapter.loadMore(MoreDatas()); //上滑刷新,数据从下往上添加到界面上
// refreshLayout.finishLoadMore(1000); //这个记得设置,否则一直转圈
// }
// });
本文的项目例子请见:https://github.com/buder-cp/base_component_learn/tree/master/smart_learn