前提：
现在市面上的Android的App只要涉及到网络交互的，几乎都有着上拉刷新的功能。无论是新闻资讯类的简书掘金，还是直播类的斗鱼火猫。网上的各种框架，也多的数不胜数。像我之前用的SwipeToLoadLayout，就是一个很好的下拉刷新框架。不过Google在5.0之后出了SwipeRefreshLayout，个人就很喜欢material design风格的设计。毕竟谷歌自家出的，出生就带光环。哈哈，不闲扯了，下面进入正题。
1.SwipeRefreshLayout用法：
image.png
从源码中可以看到，他本身继承与ViewGroup。所以只需要将他像一般的ViewGroup一样用就好了。
//xml代码
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/swiperefreshlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.RecyclerView
android:id="@+id/recyclerview"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.v4.widget.SwipeRefreshLayout>
这里介绍几个SwipeRefreshLayout的代码的基本用法：
//下拉刷新的圆圈是否显示
refreshLayout.setRefreshing(false);
//设置下拉时圆圈的颜色（可以由多种颜色拼成）
refreshLayout.setColorSchemeResources(android.R.color.holo_blue_light,
android.R.color.holo_red_light,
android.R.color.holo_orange_light);
//设置下拉时圆圈的背景颜色（这里设置成白色）
refreshLayout.setProgressBackgroundColorSchemeResource(android.R.color.white);
//设置下拉刷新时的操作
refreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
@Override
public void onRefresh() {
//具体操作
·······
}
});
这样一个简单的下拉刷新就完成了，简单吧。哈哈。
2.上拉加载：
下面重点来了，谷歌只提供了下拉刷新，但却没有像别的下拉刷新框架一样提供上拉加载的功能。这可怎么办呢，别急。有的观察仔细的朋友可能会发现，现在市面上用SwipeRefreshLayout做下拉刷新的，一般加载的时候都是用的自动加载。不像是传统的下拉刷新框架，会有一个明显的上拉动作。而是滑到一定的位置，就进行自动加载。这样会使用户有着更好的体验，省去了等待上拉加载的时间。
代码：
private class MyAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
private final static int TYPE_CONTENT=0;//正常内容
private final static int TYPE_FOOTER=1;//下拉刷新
@Override
public int getItemViewType(int position) {
if (position==listData.size()){
return TYPE_FOOTER;
}
return TYPE_CONTENT;
}
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
if (viewType==TYPE_FOOTER){
View view = LayoutInflater.from(getApplicationContext()).inflate(R.layout.activity_main_foot, parent, false);
return new FootViewHolder(view);
}
else {
View view = LayoutInflater.from(getApplicationContext()).inflate(R.layout.activity_main_item, parent, false);
MyViewHolder myViewHolder = new MyViewHolder(view);
return myViewHolder;
}
}
@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, final int position) {
if (getItemViewType(position)==TYPE_FOOTER){
}
else{
MyViewHolder viewHolder= (MyViewHolder) holder;
viewHolder.textView.setText("第" + position + "行");
}
}
@Override
public int getItemCount() {
return listData.size()+1;
}
}
private class MyViewHolder extends RecyclerView.ViewHolder {
private TextView textView;
public MyViewHolder(View itemView) {
super(itemView);
textView = itemView.findViewById(R.id.textItem);
}
}
private class FootViewHolder extends RecyclerView.ViewHolder{
private ContentLoadingProgressBar progressBar;
public FootViewHolder(View itemView) {
super(itemView);
progressBar=itemView.findViewById(R.id.pb_progress);
}
}
分析：
显示部分分成两部分，
一部分是正常的显示内容，
另一部分就是滑到底端的ProgressBar。
所以应该给RecyclerView增加一个progressBar作为footer。当然这里也不一定是progressbar作为footer，具体是什么View可以由你自己定义。
由于手动给RecyclerView增加了一个Footer所以，recyclerview显示的item个数就得+1.
@Override
public int getItemCount() {
return listData.size()+1;//listData是数据源
}
当recyclerview滑动到最低端时要给他添加一个底部的footer。所以要设置两个viewHolder，一个是正常的内容，另一个是滑动到底端时显示的自定义view
private final static int TYPE_CONTENT=0;//正常内容
private final static int TYPE_FOOTER=1;//加载View
@Override
public int getItemViewType(int position) {
if (position==listData.size()){
return TYPE_FOOTER;//判断滑到最底部时，返回的ViewType为TYPE_CONTENT。
}
return TYPE_CONTENT;
}
recyclerview的onCreateViewHolder中：根据viewType来判断recyclerview应该绑定哪个viewHolder。
这里我们定义两个viewHolder，一个正常加载内容的MyViewHolder(viewTpye==TYPE_CONTENT) ，还有一个当滑动到低端时的FootViewHolder(viewTpye==TYPE_FOOTER) 。
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
if (viewType==TYPE_FOOTER){
View view = LayoutInflater.from(getApplicationContext()).inflate(R.layout.activity_main_foot, parent, false);
return new FootViewHolder(view);
}
else {
View view = LayoutInflater.from(getApplicationContext()).inflate(R.layout.activity_main_item, parent, false);
MyViewHolder myViewHolder = new MyViewHolder(view);
return myViewHolder;
}
}
自定义ViewHolder的代码
private class MyViewHolder extends RecyclerView.ViewHolder {
private TextView textView;
public MyViewHolder(View itemView) {
super(itemView);
textView = itemView.findViewById(R.id.textItem);
}
}
private class FootViewHolder extends RecyclerView.ViewHolder{
private ContentLoadingProgressBar progressBar;
public FootViewHolder(View itemView) {
super(itemView);
progressBar=itemView.findViewById(R.id.pb_progress);
}
}
activity_main_item.xml
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:cardElevation="2dp"
android:layout_margin="5dp"
tools:context="app.com.swiperefreshlayout.activity.MainActivity">
<TextView
android:id="@+id/textItem"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="45dp"
android:text=""
android:gravity="center"/>
</android.support.v7.widget.CardView>
activity_main_foot.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v4.widget.ContentLoadingProgressBar
android:id="@+id/pb_progress"
style="?android:attr/progressBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal" />
</LinearLayout>
剩下的在onBindViewHolder中进行绑定操作就好了
@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, final int position) {
if (getItemViewType(position)==TYPE_FOOTER){
//可以进行操作
}
else{
MyViewHolder viewHolder= (MyViewHolder) holder;
viewHolder.textView.setText("第" + position + "行");
}
}
上拉加载的Listener
下拉刷新时用的SwipeRefreshLayout的OnRefreshListener（）接口。
而recyclerview没有上拉加载接口，这里我们可以自己定义一个。
RecyclerView.OnScrollListener（）有两个重写方法，一个是onScrolled另一个是onScrollStateChanged我们先来分析一下这两个方法。
onScrollStateChanged：
onScrollStateChanged.png
源码中显示的newState是更新滑动否的状态值。有三个值，
SCROLL_STATE_DRAGGING：拖拽（Recyclerview滑动时返回的状态值）
SCROLL_STATE_SETTLING：停止（Recyclerview停止时返回的状态值，此时手指已经离开屏幕但是recyclerview可能由于惯性依然在滑动）
SCROLL_STATE_IDLE：空闲（Recyclerview空闲时返回的状态值，recyclerview完全停止）
onScrolled：
onScrolled.png
看源码得知，这个方法是recyclerview滑动时调用的方法。dx是水平滑动时的距离，dy是垂直滑动时的距离。
重写OnScrollListener
知道了这两个方法以及参数的作用。我们就要重写滑动接口。
如下图所示：
/**
* @作者JTL.
* @日期2017/12/1.
* @说明：加载更多Listener
*/
public abstract class onLoadMoreListener extends RecyclerView.OnScrollListener {
private int countItem;
private int lastItem;
private boolean isScolled = false;//是否可以滑动
private RecyclerView.LayoutManager layoutManager;
/**
* 加载回调方法
* @param countItem 总数量
* @param lastItem 最后显示的position
*/
protected abstract void onLoading(int countItem, int lastItem);
@Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
/* 测试这三个参数的作用
if (newState==SCROLL_STATE_IDLE){
Log.d("test","SCROLL_STATE_IDLE,空闲");
}
else if (newState==SCROLL_STATE_DRAGGING){
Log.d("test","SCROLL_STATE_DRAGGING,拖拽");
}
else if (newState==SCROLL_STATE_SETTLING){
Log.d("test","SCROLL_STATE_SETTLING,固定");
}
else{
Log.d("test","其它");
}*/
//拖拽或者惯性滑动时isScolled设置为true
if (newState == SCROLL_STATE_DRAGGING || newState == SCROLL_STATE_SETTLING) {
isScolled = true;
} else {
isScolled = false;
}
}
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
if (recyclerView.getLayoutManager() instanceof LinearLayoutManager) {
layoutManager = recyclerView.getLayoutManager();
countItem = layoutManager.getItemCount();
lastItem = ((LinearLayoutManager) layoutManager).findLastCompletelyVisibleItemPosition();
}
if (isScolled && countItem != lastItem && lastItem == countItem - 1) {
onLoading(countItem, lastItem);
}
}
}
调用onLoadMoreListener：
写完这个类之后，我们就可以直接在Activity中调用了。
recyclerView.addOnScrollListener(new onLoadMoreListener() {
@Override
protected void onLoading(int countItem,int lastItem) {
handler.postDelayed(new Runnable() {
@Override
public void run() {
getData("loadMore");
}
},1000);
}
});
下面上两张Gif图看下效果
refresh.gif
loadmore.gif
这样一个简单的下拉加载以及上拉自动刷新就ok了。
有问题的希望大家一起讨论。喜欢的点个喜欢也算是给我的一点小动力。感谢，哈哈！
网友评论