一、概述

本篇博客介绍的是怎样使用SwipeRefreshLayout和RecyclerView实现高仿简书Android端的下拉刷新和上拉载入很多其它的效果。

依据效果图能够发现，本案例实现了例如以下效果：

  • 第一次进入页面显示SwipeRefreshLayout的下拉刷新效果
  • 当内容铺满屏幕时，向下滑动显示“载入中…”效果并载入很多其它数据
  • 当SwipeRefreshLayout正在下拉刷新时，将屏蔽载入很多其它操作
  • 当载入很多其它数据时，屏蔽有可能的反复的上拉操作
  • 当向上滑动RecyclerView时。隐藏Toolbar以获得更好的用户体验

二、代码实现

  • MainActivity
  1. package com.leohan.refresh;
  3. import android.os.Bundle;
  4. import android.os.Handler;
  5. import android.support.v4.widget.SwipeRefreshLayout;
  6. import android.support.v7.app.AppCompatActivity;
  7. import android.support.v7.widget.LinearLayoutManager;
  8. import android.support.v7.widget.RecyclerView;
  9. import android.support.v7.widget.Toolbar;
  10. import android.util.Log;
  11. import android.view.View;
  13. import java.util.ArrayList;
  14. import java.util.HashMap;
  15. import java.util.List;
  16. import java.util.Map;
  18. import butterknife.ButterKnife;
  19. import butterknife.InjectView;
  21. /**
  22.  * @author Leo
  23.  */
  24. public class MainActivity extends AppCompatActivity {
  26.     @InjectView(R.id.toolbar)
  27.     Toolbar toolbar;
  28.     @InjectView(R.id.recyclerView)
  29.     RecyclerView recyclerView;
  30.     @InjectView(R.id.SwipeRefreshLayout)
  31.     SwipeRefreshLayout swipeRefreshLayout;
  33.     boolean isLoading;
  34.     private List<Map<String, Object>> data = new ArrayList<>();
  35.     private MyAdapter adapter = new MyAdapter(this, data);
  36.     private Handler handler = new Handler();
  38.     @Override
  39.     public void onCreate(Bundle savedInstanceState) {
  40.         super.onCreate(savedInstanceState);
  41.         setContentView(R.layout.activity_notice);
  42.         ButterKnife.inject(this);
  43.         initView();
  44.         initData();
  45.     }
  47.     public void initView() {
  48.         setSupportActionBar(toolbar);
  49.         toolbar.setTitle(R.string.notice);
  50.         toolbar.setNavigationOnClickListener(new View.OnClickListener() {
  51.             @Override
  52.             public void onClick(View v) {
  53.                 finish();
  54.             }
  55.         });
  57.         swipeRefreshLayout.setColorSchemeResources(R.color.blueStatus);
  58.         swipeRefreshLayout.post(new Runnable() {
  59.             @Override
  60.             public void run() {
  61.                 swipeRefreshLayout.setRefreshing(true);
  62.             }
  63.         });
  65.         swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
  66.             @Override
  67.             public void onRefresh() {
  68.                 handler.postDelayed(new Runnable() {
  69.                     @Override
  70.                     public void run() {
  71.                         data.clear();
  72.                         getData();
  73.                     }
  74.                 }, 2000);
  75.             }
  76.         });
  77.         final LinearLayoutManager layoutManager = new LinearLayoutManager(this);
  78.         recyclerView.setLayoutManager(layoutManager);
  79.         recyclerView.setAdapter(adapter);
  80.         recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
  81.             @Override
  82.             public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
  83.                 super.onScrollStateChanged(recyclerView, newState);
  84.                 Log.d("test", "StateChanged = " + newState);
  86.             }
  88.             @Override
  89.             public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
  90.                 super.onScrolled(recyclerView, dx, dy);
  91.                 Log.d("test", "onScrolled");
  93.                 int lastVisibleItemPosition = layoutManager.findLastVisibleItemPosition();
  94.                 if (lastVisibleItemPosition + 1 == adapter.getItemCount()) {
  95.                     Log.d("test", "loading executed");
  97.                     boolean isRefreshing = swipeRefreshLayout.isRefreshing();
  98.                     if (isRefreshing) {
  99.                         adapter.notifyItemRemoved(adapter.getItemCount());
  100.                         return;
  101.                     }
  102.                     if (!isLoading) {
  103.                         isLoading = true;
  104.                         handler.postDelayed(new Runnable() {
  105.                             @Override
  106.                             public void run() {
  107.                                 getData();
  108.                                 Log.d("test", "load more completed");
  109.                                 isLoading = false;
  110.                             }
  111.                         }, 1000);
  112.                     }
  113.                 }
  114.             }
  115.         });
  117.         //加入点击事件
  118.         adapter.setOnItemClickListener(new MyAdapter.OnItemClickListener() {
  119.             @Override
  120.             public void onItemClick(View view, int position) {
  121.                 Log.d("test", "item position = " + position);
  122.             }
  124.             @Override
  125.             public void onItemLongClick(View view, int position) {
  127.             }
  128.         });
  129.     }
  131.     public void initData() {
  132.         handler.postDelayed(new Runnable() {
  133.             @Override
  134.             public void run() {
  135.                 getData();
  136.             }
  137.         }, 1500);
  139.     }
  141.     /**
  142.      * 获取測试数据
  143.      */
  144.     private void getData() {
  145.         for (int i = 0; i < 6; i++) {
  146.             Map<String, Object> map = new HashMap<>();
  147.             data.add(map);
  148.         }
  149.         adapter.notifyDataSetChanged();
  150.         swipeRefreshLayout.setRefreshing(false);
  151.         adapter.notifyItemRemoved(adapter.getItemCount());
  152.     }
  154. }
  • RecyclerViewAdapter
  1. package com.leohan.refresh;
  3. import android.content.Context;
  4. import android.support.v7.widget.RecyclerView.Adapter;
  5. import android.support.v7.widget.RecyclerView.ViewHolder;
  6. import android.view.LayoutInflater;
  7. import android.view.View;
  8. import android.view.ViewGroup;
  9. import android.widget.TextView;
  11. import java.util.List;
  13. public class RecyclerViewAdapter extends Adapter<ViewHolder> {
  15.     private static final int TYPE_ITEM = 0;
  16.     private static final int TYPE_FOOTER = 1;
  17.     private Context context;
  18.     private List data;
  20.     public interface OnItemClickListener {
  21.         void onItemClick(View view, int position);
  23.         void onItemLongClick(View view, int position);
  24.     }
  26.     private OnItemClickListener onItemClickListener;
  28.     public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
  29.         this.onItemClickListener = onItemClickListener;
  30.     }
  32.     @Override
  33.     public int getItemCount() {
  34.         return data.size() == 0 ?
  36. 0 : data.size() + 1;
  37.     }
  39.     @Override
  40.     public int getItemViewType(int position) {
  41.         if (position + 1 == getItemCount()) {
  42.             return TYPE_FOOTER;
  43.         } else {
  44.             return TYPE_ITEM;
  45.         }
  46.     }
  48.     public RecyclerViewAdapter(Context context, List data) {
  49.         this.context = context;
  50.         this.data = data;
  51.     }
  53.     @Override
  54.     public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
  55.         if (viewType == TYPE_ITEM) {
  56.             View view = LayoutInflater.from(context).inflate(R.layout.item_notice, parent,
  57.                     false);
  58.             return new ItemViewHolder(view);
  59.         } else if (viewType == TYPE_FOOTER) {
  60.             View view = LayoutInflater.from(context).inflate(R.layout.item_foot, parent,
  61.                     false);
  62.             return new FootViewHolder(view);
  63.         }
  64.         return null;
  65.     }
  67.     @Override
  68.     public void onBindViewHolder(final ViewHolder holder, int position) {
  69.         if (holder instanceof ItemViewHolder) {
  70.             //holder.tv.setText(data.get(position));
  71.             if (onItemClickListener != null) {
  72.                 holder.itemView.setOnClickListener(new View.OnClickListener() {
  73.                     @Override
  74.                     public void onClick(View v) {
  75.                         int position = holder.getLayoutPosition();
  76.                         onItemClickListener.onItemClick(holder.itemView, position);
  77.                     }
  78.                 });
  80.                 holder.itemView.setOnLongClickListener(new View.OnLongClickListener() {
  81.                     @Override
  82.                     public boolean onLongClick(View v) {
  83.                         int position = holder.getLayoutPosition();
  84.                         onItemClickListener.onItemLongClick(holder.itemView, position);
  85.                         return false;
  86.                     }
  87.                 });
  88.             }
  89.         }
  90.     }
  92.     static class ItemViewHolder extends ViewHolder {
  94.         TextView tv;
  96.         public ItemViewHolder(View view) {
  97.             super(view);
  98.             tv = (TextView) view.findViewById(R.id.tv_date);
  99.         }
  100.     }
  102.     static class FootViewHolder extends ViewHolder {
  104.         public FootViewHolder(View view) {
  105.             super(view);
  106.         }
  107.     }
  108. }
  • item_base.xml
  1. <?
  3. xml version="1.0" encoding="utf-8"?
  5. >
  7. <android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
  8.     xmlns:app="http://schemas.android.com/apk/res-auto"
  9.     android:layout_width="match_parent"
  10.     android:layout_height="wrap_content"
  11.     android:layout_marginLeft="@dimen/margin_10"
  12.     android:layout_marginRight="@dimen/margin_10"
  13.     android:foreground="?android:attr/selectableItemBackgroundBorderless"
  14.     android:layout_marginTop="6dp"
  15.     android:orientation="vertical"
  16.     app:cardBackgroundColor="@color/line"
  17.     app:cardPreventCornerOverlap="true"
  18.     app:cardUseCompatPadding="true"
  19.     app:contentPadding="6dp">
  21.     <LinearLayout
  22.         android:layout_width="match_parent"
  23.         android:layout_height="match_parent"
  24.         android:orientation="vertical">
  26.         <TextView
  27.             android:id="@+id/tv_date"
  28.             style="@style/NormalTextView"
  29.             android:layout_width="wrap_content"
  30.             android:layout_height="wrap_content"
  31.             android:text="2015-12-11 12:00" />
  33.         <android.support.v7.widget.CardView
  34.             android:layout_width="match_parent"
  35.             android:layout_height="match_parent"
  36.             android:orientation="vertical"
  37.             app:cardBackgroundColor="@color/white"
  38.             app:cardPreventCornerOverlap="true"
  39.             app:cardUseCompatPadding="true"
  40.             app:contentPadding="10dp">
  42.             <TextView
  43.                 android:id="@+id/tv_title"
  44.                 style="@style/SmallGreyTextView"
  45.                 android:layout_width="wrap_content"
  46.                 android:layout_height="wrap_content"
  47.                 android:ellipsize="end"
  48.                 android:maxLines="2"
  49.                 android:text="视线好转,0729出口开通,0621进口开通。视线好转,0729出口开通,0621进口开通。" />
  51.         </android.support.v7.widget.CardView>
  52.     </LinearLayout>
  54. </android.support.v7.widget.CardView>
  • item_foot.xml
  1. <?
  3. xml version="1.0" encoding="utf-8"?>
  4. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  5.     xmlns:tools="http://schemas.android.com/tools"
  6.     android:layout_width="match_parent"
  7.     android:layout_height="40dp"
  8.     android:gravity="center"
  9.     android:orientation="horizontal"
  10.  >
  12.     <ProgressBar
  13.         android:layout_marginRight="6dp"
  14.         android:id="@+id/progressBar"
  15.         style="?android:attr/progressBarStyleSmall"
  16.         android:layout_width="wrap_content"
  17.         android:layout_height="wrap_content"
  18.         android:layout_gravity="center" />
  20.     <TextView
  21.         style="@style/SmallGreyTextView"
  22.         android:layout_width="wrap_content"
  23.         android:layout_height="wrap_content"
  24.         android:layout_gravity="center"
  25.         android:text="@string/loading" />
  27. </LinearLayout>

三、代码分析

  • 上拉载入很多其它数据通过监听RecyclerView的滚动事件RecyclerView.OnScrollListener()实现的。它提供了两个方法：
  1.         /**
  2.          * 当RecyclerView的滑动状态改变时触发
  3.          */
  4.         public void onScrollStateChanged(RecyclerView recyclerView, int newState){}
  6.         /**
  7.          * 当RecyclerView滑动时触发
  8.          * 相似点击事件的MotionEvent.ACTION_MOVE
  9.          */
  10.         public void onScrolled(RecyclerView recyclerView, int dx, int dy){}
  • RecyclerView的滑动状态有例如以下三种：
  1.     /**
  2.      * The RecyclerView is not currently scrolling.
  3.      * 手指离开屏幕
  4.      */
  5.     public static final int SCROLL_STATE_IDLE = 0;
  7.     /**
  8.      * The RecyclerView is currently being dragged by outside input such as user touch input.
  9.      * 手指触摸屏幕
  10.      */
  11.     public static final int SCROLL_STATE_DRAGGING = 1;
  13.     /**
  14.      * The RecyclerView is currently animating to a final position while not under
  15.      * outside control.
  16.      * 手指加速滑动并放开，此时滑动状态伴随SCROLL_STATE_IDLE
  17.      */
  18.     public static final int SCROLL_STATE_SETTLING = 2;
  • 因为简书APP的上拉载入很多其它的是在滑动到最后一个item时自己主动触发的，与手指是否在屏幕上无关。即与滑动状态无关。

    因此，实现这样的效果仅仅须要在public void onScrolled(RecyclerView recyclerView, int dx, int dy) 方法中操作，无需关注当时的滑动状态：

  1.   @Override
  2.             public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
  3.                 super.onScrolled(recyclerView, dx, dy);
  4.                 Log.d("test", "onScrolled");
  6.                 int lastVisibleItemPosition = layoutManager.findLastVisibleItemPosition();
  7.                 if (lastVisibleItemPosition + 1 == adapter.getItemCount()) {
  8.                     Log.d("test", "loading executed");
  10.                     boolean isRefreshing = swipeRefreshLayout.isRefreshing();
  11.                     if (isRefreshing) {
  12.                         adapter.notifyItemRemoved(adapter.getItemCount());
  13.                         return;
  14.                     }
  15.                     if (!isLoading) {
  16.                         isLoading = true;
  17.                         handler.postDelayed(new Runnable() {
  18.                             @Override
  19.                             public void run() {
  20.                                 getData();
  21.                                 Log.d("test", "load more completed");
  22.                                 isLoading = false;
  23.                             }
  24.                         }, 1000);
  25.                     }
  26.                 }
  27.             }
  • 假设要实现当且仅当滑动到最后一项而且手指上拉抛出时才运行上拉载入很多其它效果的话。须要配合onScrollStateChanged(RecyclerView recyclerView, int newState的使用，能够将代码改为：
  1.  @Override
  2.             public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
  3.                 super.onScrollStateChanged(recyclerView, newState);
  4.                 Log.d("test", "StateChanged = " + newState);
  5.                 if (newState == RecyclerView.SCROLL_STATE_IDLE && lastVisibleItemPosition + 1 == adapter.getItemCount()) {
  6.                     Log.d("test", "loading executed");
  8.                     boolean isRefreshing = swipeRefreshLayout.isRefreshing();
  9.                     if (isRefreshing) {
  10.                         adapter.notifyItemRemoved(adapter.getItemCount());
  11.                         return;
  12.                     }
  13.                     if (!isLoading) {
  14.                         isLoading = true;
  15.                         handler.postDelayed(new Runnable() {
  16.                             @Override
  17.                             public void run() {
  18.                                 getData();
  19.                                 Log.d("test", "load more completed");
  20.                                 isLoading = false;
  21.                             }
  22.                         }, 1000);
  23.                     }
  24.                 }
  25.             }
  27.             @Override
  28.             public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
  29.                 super.onScrolled(recyclerView, dx, dy);
  30.                 Log.d("test", "onScrolled");
  32.                 lastVisibleItemPosition = layoutManager.findLastVisibleItemPosition();
  34.             }
  • 载入很多其它的效果能够通过item_foot.xml自己定义，滑动到最后一项时显示该item并运行载入很多其它。当载入数据完成时须要将该item移除掉
  1. adapter.notifyItemRemoved(adapter.getItemCount());

以下的代码就是RecyclerView的多个item布局的实现方法：

  1.  @Override
  2.     public int getItemCount() {
  3.         return data.size() == 0 ? 0 : data.size() + 1;
  4.     }
  6.     @Override
  7.     public int getItemViewType(int position) {
  8.         if (position + 1 == getItemCount()) {
  9.             return TYPE_FOOTER;
  10.         } else {
  11.             return TYPE_ITEM;
  12.         }
  13.     }
  15.     @Override
  16.     public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
  17.         if (viewType == TYPE_ITEM) {
  18.             View view = LayoutInflater.from(context).inflate(R.layout.item_base, parent,
  19.                     false);
  20.             return new ItemViewHolder(view);
  21.         } else if (viewType == TYPE_FOOTER) {
  22.             View view = LayoutInflater.from(context).inflate(R.layout.item_foot, parent,
  23.                     false);
  24.             return new FootViewHolder(view);
  25.         }
  26.         return null;
  27.     }

该案例源代码：https://github.com/leoleohan/RefreshDemo，欢迎Star、Fork。

使用SwipeRefreshLayout和RecyclerView实现仿“简书”下拉刷新和上拉载入很多其它的更多相关文章

  1. Android 5.X新特性之为RecyclerView添加下拉刷新和上拉加载及SwipeRefreshLayout实现原理

    RecyclerView已经写过两篇文章了,分别是Android 5.X新特性之RecyclerView基本解析及无限复用 和 Android 5.X新特性之为RecyclerView添加Header ...

  2. Android实现RecyclerView的下拉刷新和上拉载入很多其它

    需求 先上效果图, Material Design风格的下拉刷新和上拉载入很多其它. 源代码地址(欢迎star) https://github.com/studychen/SeeNewsV2 假设对于 ...

  3. RecyclerView下拉刷新和上拉加载更多实现

    RecyclerView下拉刷新和上拉加载更多实现 转 https://www.jianshu.com/p/4ea7c2d95ecf   在Android开发中,RecyclerView算是使用频率非 ...

  4. 实现RecyclerView下拉刷新和上拉加载更多以及RecyclerView线性、网格、瀑布流效果演示

    实现RecyclerView下拉刷新和上拉加载更多以及RecyclerView线性.网格.瀑布流效果演示 效果预览 实例APP 小米应用商店 使用方法 build.gradle文件 dependenc ...

  5. 手把手教你实现RecyclerView的下拉刷新和上拉加载更多

    手把手教你实现RecyclerView的下拉刷新和上拉加载更多     版权声明:本文为博主原创文章,遵循CC 4.0 by-sa版权协议,转载请附上原文出处链接和本声明. 本文链接:https:// ...

  6. Android 实现下拉刷新和上拉加载更多的RECYCLERVIEW和SCROLLVIEW

    PullRefreshRecyclerView.java /** * 类说明:下拉刷新上拉加载更多的RecyclerView * Author: gaobaiq * Date: 2016/5/9 18 ...

  7. 给RecyclerView最纯粹的下拉刷新和上拉加载更多

    转自 http://blog.csdn.net/jerrywu145/article/details/52225898 http://www.jianshu.com/p/3bf125b4917d

  8. RecyclerView下拉刷新上拉加载（二）

    listview下拉刷新上拉加载扩展(一) http://blog.csdn.net/baiyuliang2013/article/details/50252561 listview下拉刷新上拉加载扩 ...

  9. RecyclerView下拉刷新上拉加载（一）

    listview下拉刷新上拉加载扩展(一) http://blog.csdn.net/baiyuliang2013/article/details/50252561 listview下拉刷新上拉加载扩 ...

随机推荐

  1. mysql 更改字符集

    Windows: 安装目录下新建my.ini文件,输入一下内容 [mysqld]#修改服务器端默认字符编码格式为utf8character-set-server = utf8 [client]#修改客 ...

  2. vs2017 创建C#类时添加文件头

    C#类模板地址:C:\Program Files (x86)\Microsoft Visual Studio\2017\Professional\Common7\IDE\ItemTemplates\C ...

  3. Vue的特性

    1.数据驱动视图 <div id="app"> <p> {{ message }}<p> </div> var app = new ...

  4. du 命令计算隐藏文件夹或文件

    du -sh * .[^.]*

  5. 调用微信扫一扫功能，踩坑'invalid signature'

    在vue项目中,调用微信扫一扫功能,在安卓系统下完全正常,ios系统下却报错'invalid signature'的错误,这可能令许多小伙伴困惑,经过查询大量博客相关资料,才找到了解决的方法. 原因: ...

  6. idea之快速查看类所在jar包

  7. git 的 基础操作及使用

    /* git svn版本控制器 */ /*git把文件对应的储存空间分为三个区: 1.工作区 2.缓存区 3.历史区 直接操作文件,不做add时,咱们是在工作区做的修改 右键 git bash her ...

  8. 如何同步iframe与嵌入内容的高度

    最近频繁的做一些通过iframe在a页面嵌入b页面需求.总结下来,有以下问题需要解决 1.如何同步iframe与嵌入内容的高度 2.将b页面载入到a页面后,如何隐藏掉b页面上的元素,如左导航,顶部导航 ...

  9. 字符、散列、模拟--P1055 ISBN号码

    题目描述 每一本正式出版的图书都有一个ISBN号码与之对应,ISBN码包括9位数字.1位识别码和3位分隔符,其规定格式如x-xxx-xxxxx-x,其中符号-就是分隔符(键盘上的减号),最后一位是识别 ...

  10. Daydreaming Stockbroker(2016 NCPC 贪心)

    题目: Gina Reed, the famous stockbroker, is having a slow day at work, and between rounds of solitaire ...