当前位置: 开发笔记 > Android > 正文

AndroidRefreshLayout实现下拉刷新布局

作者：我的明天谁2502931447 | 来源：互联网 | 2022-05-07 19:15

这篇文章主要为大家详细介绍了AndroidRefreshLayout实现下拉刷新布局,具有一定的参考价值，感兴趣的小伙伴们可以参考一下

项目中需要下拉刷新的功能，但是这个View不是ListView这类的控件，需要ViewGroup实现这个功能，一开始网上大略找了一下，没发现特别合适的，代码也是没怎么看懂，所以决定还是自己写一个。

于是翻出XlistView的源码看是一点一点看，再大致理解了XLisview源码，终于决定自己动手啦

为了省事，headView还是用了XListView的HeadView，省了很多事：）

下拉刷新，下拉刷新，肯定是先实现下拉功能，最开始我是打算通过 extends ScrollView 来实现，因为有现成的滚动效果嘛，可是实际因为两个原因放弃了：

1、ScrollView下只能有一个子控件View ,虽然在 Scroll下添加一个ViewGroup，然后讲headView动态添加进前面的ViewGroup，但是我还是比较习惯studio的可视化预览，总觉得不直观！

2、 ScrollView内嵌ListView时会发生冲突，还需要去重写ListView。于是放弃换个思路！

关于上面的原因1：动态添加headView进ScrollView的中GroupView中，可以在重写ScrollView的onViewAdded（）方法，将初始化时解析的headView添加进子GroupView

@Override 
public void onViewAdded(View child) { 
  super.onViewAdded(child); 
  //因为headView要在最上面，最先想到的就是Vertical的LinearLayout 
  LinearLayout linearLayout = (LinearLayout) getChildAt(0); 
  linearLayout.addView(view, 0); 
}

换个思路，通过extends LinearLayout来实现吧！
先做准备工作，我们需要一个HeaderView以及要获取到HeaderView的高度，还有初始时Layout的高度

private void initView(Context context) { 
   mHeaderView = new SRefreshHeader(context); 
   mHeaderViewCOntent= (RelativeLayout) mHeaderView.findViewById(R.id.slistview_header_content); 
   setOrientation(VERTICAL); 
   addView(mHeaderView, 0); 
   getHeaderViewHeight(); 
   getViewHeight(); 
 }

mHeaderView = new SRefreshHeader(context);
通过构造方法实例化HeaderView

mHeaderViewCOntent= (RelativeLayout)

mHeaderView.findViewById(R.id.slistview_header_content);

这是解析headerView内容区域iew,等会儿要获取这个view的高度，你肯定会问为啥不用上面的mHeaderView来获取高度，点进构造方法里可以看到如下代码

// 初始情况，设置下拉刷新view高度为0 
LayoutParams lp = new LayoutParams(LayoutParams.MATCH_PARENT, 0); 
mCOntainer= (LinearLayout) LayoutInflater.from(context).inflate(R.layout.listview_head_view_layout, null); 
w(mContainer, lp);

如果直接获取mHeaderView的高度那肯定是0
getHeaderViewHeight();
getViewHeight();
分别是获取HeaderView的高度和Layout的初始高度

/** 
  * 获取headView高度 
  */ 
  private void getHeaderViewHeight() { 
    ViewTreeObserver vto2 = mHeaderViewContent.getViewTreeObserver(); 
    vto2.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { 
      @Override 
      public void onGlobalLayout() { 
        mHeaderViewHeight = mHeaderViewContent.getHeight(); 
        mHeaderViewContent.getViewTreeObserver().removeGlobalOnLayoutListener(this); 
      } 
    }); 
  } 
 
  /** 
  * 获取SRefreshLayout当前实例的高度 
  */ 
  private void getViewHeight() { 
    ViewTreeObserver thisView = getViewTreeObserver(); 
    thisView.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { 
      @Override 
      public void onGlobalLayout() { 
        SRefreshLayout.this.mHeight = SRefreshLayout.this.getHeight(); 
        SRefreshLayout.this.getViewTreeObserver().removeGlobalOnLayoutListener(this); 
      } 
    }); 
  }

准备工作完成了，接下来就是要成下拉操作了
到这里，肯定一下就想到了onTouchEvent（）方法，是的！现在就开始在这里施工

实现下拉一共会经历三个过程
ACTION_UP→ACTION_MOVE→ACTION_UP
在ACTION_UP事件中，也就是手指按下的时候，我们需要做的只是记录按下时候的坐标

switch (ev.getAction()) { 
      case MotionEvent.ACTION_DOWN: 
        //记录起始高度 
        mLastY = ev.getRawY();//记录按下时的Y坐标 
        break;

然后就是ACTION_MOVE事件了，这里是最重要的，因为下拉时HeadView和Layout的高度变化都在这里进行

case MotionEvent.ACTION_MOVE: 
       if (!isRefreashing) 
         isRefreashing = true; 
       final float deltaY = ev.getRawY() - mLastY; 
       mLastY = ev.getRawY(); 
       updateHeaderViewHeight(deltaY / 1.8f);//按一定比例缩小移动距离 
       updateHeight(); 
       break;

里面的updateHeaderViewHeight和updateHeight分别是改变HeaderView的高度和Layout的高度

 private void updateHeight() { 
    ViewGroup.LayoutParams lp = getLayoutParams(); 
    //更新当前layout实例高度为headerView高度加上最初的layout高度 
    //如果不更新layout 会造成内容高度压缩 无法保持比例 
    lp.height = (mHeight + mHeaderView.getVisiableHeight()); 
    setLayoutParams(lp); 
  } 
 
  private void updateHeaderViewHeight(float space) { 
//    if (space <0) 
//      space = 0; 
//    int factHeight = (int) (space - mHeaderViewHeight); 
    if (mHeaderView.getStatus() != SRefreshHeader.STATE_REFRESHING) { 
      //如果不处于刷新中同时如果高度 
      if (mHeaderView.getVisiableHeight()  mHeaderViewHeight * 2 && mHeaderView.getStatus() != SRefreshHeader.STATE_READY) { 
        mHeaderView.setState(SRefreshHeader.STATE_READY); 
      } 
    } 
    mHeaderView.setVisiableHeight((int) space 
        + mHeaderView.getVisiableHeight()); 
  }

更新Header高度时，通过下拉的距离来判断是否到达刷新的距离，上面代码中我设定的是到达mHeaderView初始高度的两倍，就进入“释放刷新”的状态，如果没有达到则保持“下拉刷新”的状态
HeaderView中的状态一共设定了3个分别是

public final static int STATE_NORMAL = 0;//下拉刷新 
 public final static int STATE_READY = 1;//释放刷新 
 public final static int STATE_REFRESHING = 2;//刷新中

更新高度的方法headerView和layout都是相同的，就是原高度加上移动的距离重新赋给headerView或者layout

mHeaderView.setVisiableHeight((int) space
+ mHeaderView.getVisiableHeight());

最后就是ACTION_UP事件了就是手指离开屏幕的时候，在这里我们需要根据headerView目前状态来决定headerView的最终状态！

case MotionEvent.ACTION_UP: 
        //松开时 
        //避免点击事件触发 
        if (!isRefreashing) 
          break; 
        //如果headView状态处于READY状态 则说明松开时应该进入REFRESHING状态 
        if (mHeaderView.getStatus() == SRefreshHeader.STATE_READY) { 
          mHeaderView.setState(SRefreshHeader.STATE_REFRESHING); 
        } 
        //根据状态重置SrefreshLayout当前实例和headView高度 
        resetHeadView(mHeaderView.getStatus()); 
        reset(mHeaderView.getStatus()); 
        mLastY = -1;//重置坐标 
        break;

resetHeadView和reset分别是重置headerView高度和layout高度的方法

private void reset(int status) { 
    ViewGroup.LayoutParams lp = getLayoutParams(); 
    switch (status) { 
      case SRefreshHeader.STATE_REFRESHING: 
        lp.height = mHeight + mHeaderViewHeight; 
        break; 
      case SRefreshHeader.STATE_NORMAL: 
        lp.height = mHeight; 
        break; 
    } 
    setLayoutParams(lp); 
  } 
 
  private void resetHeadView(int status) { 
    switch (status) { 
      case SRefreshHeader.STATE_REFRESHING: 
        mHeaderView.setVisiableHeight(mHeaderViewHeight); 
        break; 
      case SRefreshHeader.STATE_NORMAL: 
        mHeaderView.setVisiableHeight(0); 
        break; 
    } 
  }

实现方式也是一样的。根据状态来判断，如果是处于刷新中，那headerView应该正常显示，并且高度是初始的高度，如果处于NORMAL，也就是"下拉刷新"状态，那么说未触发刷新，重置时，headerView应该被隐藏，也就是高度重置为0

到这里下拉刷新操作也基本完成了，还需要加一个回调接口进行通知

interface OnRefreshListener { 
    void onRefresh(); 
  }

case MotionEvent.ACTION_UP: 
        //松开时 
        //避免点击事件触发 
        if (!isRefreashing) 
          break; 
        //如果headView状态处于READY状态 则说明松开时应该进入REFRESHING状态 
        if (mHeaderView.getStatus() == SRefreshHeader.STATE_READY) { 
          mHeaderView.setState(SRefreshHeader.STATE_REFRESHING); 
          if (mOnRefreshListener != null) 
            mOnRefreshListener.onRefresh(); 
        } 
        //根据状态重置SrefreshLayout当前实例和headView高度 
        resetHeadView(mHeaderView.getStatus()); 
        reset(mHeaderView.getStatus()); 
        mLastY = -1;//重置坐标 
        break;

好，到这里就基本完成了，试试效果吧。咦，发现一个问题，嵌套ListView的时候为什么这个Layout不能执行下拉刷新！仔细想想应该是事件分发的问题，还需要处理一下事件的拦截！
关于事件拦截的处理，阅读了鸿洋大神写的viewgroup事件分发的博客和Android-Ultra-Pull-To-Refresh的部分源码，从中找到了解决办法：

@Override 
  public boolean onInterceptTouchEvent(MotionEvent ev) { 
    AbsListView absListView = null; 
    for (int n = 0; n  0 && !absListView.canScrollVertically(-1) && absListView.getFirstVisiblePosition() == 0) { 
          Logs.v("拦截成功"); 
          return true; 
        } else { 
          Logs.v("不拦截"); 
          return false; 
        } 
    } 
    return super.onInterceptTouchEvent(ev); 
  }

其中

if (space > 0 && !absListView.canScrollVertically(-1) && absListView.getFirstVisiblePosition() == 0)
space即移动的距离 canScrollVertically（）是判断ListView能否在垂直方向上滚动，参数为负数时代表向上，为正数时代码向下滚动，最后一个就是ListView第一个可见的item的postion

加上上面的事件拦截处理，一个可以满足开头提到的需求的Viewgroup也就完成了！

下面贴上Layout的源码和HeaderView(直接使用的XlistView的HeaderView)的源码

public class SRefreshLayout extends LinearLayout { 
  private SRefreshHeader mHeaderView; 
  private RelativeLayout mHeaderViewContent; 
  private boolean isRefreashing; 
  private float mLastY = -1;//按下的起始高度 
  private int mHeaderViewHeight;//headerView内容高度 
  private int mHeight;//布局高度 
  private float mStartY; 
 
  interface OnRefreshListener { 
    void onRefresh(); 
  } 
 
  public OnRefreshListener mOnRefreshListener; 
 
  public SRefreshLayout(Context context) { 
    super(context); 
    initView(context); 
  } 
 
  public SRefreshLayout(Context context, AttributeSet attrs) { 
    super(context, attrs); 
    initView(context); 
  } 
 
  public SRefreshLayout(Context context, AttributeSet attrs, int defStyleAttr) { 
    super(context, attrs, defStyleAttr); 
    initView(context); 
  } 
 
  private void initView(Context context) { 
    mHeaderView = new SRefreshHeader(context); 
    mHeaderViewCOntent= (RelativeLayout) mHeaderView.findViewById(R.id.slistview_header_content); 
    setOrientation(VERTICAL); 
    addView(mHeaderView, 0); 
    getHeaderViewHeight(); 
    getViewHeight(); 
  } 
 
  /** 
   * 获取headView高度 
   */ 
  private void getHeaderViewHeight() { 
    ViewTreeObserver vto2 = mHeaderViewContent.getViewTreeObserver(); 
    vto2.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { 
      @Override 
      public void onGlobalLayout() { 
        mHeaderViewHeight = mHeaderViewContent.getHeight(); 
        mHeaderViewContent.getViewTreeObserver().removeGlobalOnLayoutListener(this); 
      } 
    }); 
  } 
 
  /** 
   * 获取SRefreshLayout当前实例的高度 
   */ 
  private void getViewHeight() { 
    ViewTreeObserver thisView = getViewTreeObserver(); 
    thisView.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { 
      @Override 
      public void onGlobalLayout() { 
        SRefreshLayout.this.mHeight = SRefreshLayout.this.getHeight(); 
        SRefreshLayout.this.getViewTreeObserver().removeGlobalOnLayoutListener(this); 
      } 
    }); 
  } 
 
  @Override 
  public boolean onInterceptTouchEvent(MotionEvent ev) { 
    AbsListView absListView = null; 
    for (int n = 0; n  0 && !absListView.canScrollVertically(-1) && absListView.getFirstVisiblePosition() == 0) { 
          Logs.v("拦截成功"); 
          return true; 
        } else { 
          Logs.v("不拦截"); 
          return false; 
        } 
    } 
    return super.onInterceptTouchEvent(ev); 
  } 
 
  @Override 
  public boolean onTouchEvent(MotionEvent ev) { 
    if (mLastY == -1) 
      mLastY = ev.getRawY(); 
    switch (ev.getAction()) { 
      case MotionEvent.ACTION_DOWN: 
        //记录起始高度 
        mLastY = ev.getRawY();//记录按下时的Y坐标 
        break; 
      //手指离开屏幕时 
      case MotionEvent.ACTION_UP: 
        //松开时 
        //避免点击事件触发 
        if (!isRefreashing) 
          break; 
        //如果headView状态处于READY状态 则说明松开时应该进入REFRESHING状态 
        if (mHeaderView.getStatus() == SRefreshHeader.STATE_READY) { 
          mHeaderView.setState(SRefreshHeader.STATE_REFRESHING); 
          if (mOnRefreshListener != null) 
            mOnRefreshListener.onRefresh(); 
        } 
        //根据状态重置SrefreshLayout当前实例和headView高度 
        resetHeadView(mHeaderView.getStatus()); 
        reset(mHeaderView.getStatus()); 
        mLastY = -1;//重置坐标 
        break; 
      case MotionEvent.ACTION_MOVE: 
        if (!isRefreashing) 
          isRefreashing = true; 
        final float deltaY = ev.getRawY() - mLastY; 
        mLastY = ev.getRawY(); 
        updateHeaderViewHeight(deltaY / 1.8f);//按一定比例缩小移动距离 
        updateHeight(); 
        break; 
    } 
    return super.onTouchEvent(ev); 
  } 
 
 
  private void reset(int status) { 
    ViewGroup.LayoutParams lp = getLayoutParams(); 
    switch (status) { 
      case SRefreshHeader.STATE_REFRESHING: 
        lp.height = mHeight + mHeaderViewHeight; 
        break; 
      case SRefreshHeader.STATE_NORMAL: 
        lp.height = mHeight; 
        break; 
    } 
    setLayoutParams(lp); 
  } 
 
  private void resetHeadView(int status) { 
    switch (status) { 
      case SRefreshHeader.STATE_REFRESHING: 
        mHeaderView.setVisiableHeight(mHeaderViewHeight); 
        break; 
      case SRefreshHeader.STATE_NORMAL: 
        mHeaderView.setVisiableHeight(0); 
        break; 
    } 
  } 
 
  private void updateHeight() { 
    ViewGroup.LayoutParams lp = getLayoutParams(); 
    //更新当前layout实例高度为headerView高度加上最初的layout高度 
    //如果不更新layout 会造成内容高度压缩 无法保持比例 
    lp.height = (mHeight + mHeaderView.getVisiableHeight()); 
    setLayoutParams(lp); 
  } 
 
  private void updateHeaderViewHeight(float space) { 
//    if (space <0) 
//      space = 0; 
//    int factHeight = (int) (space - mHeaderViewHeight); 
    if (mHeaderView.getStatus() != SRefreshHeader.STATE_REFRESHING) { 
      //如果不处于刷新中同时如果高度 
      if (mHeaderView.getVisiableHeight()  mHeaderViewHeight * 2 && mHeaderView.getStatus() != SRefreshHeader.STATE_READY) { 
        mHeaderView.setState(SRefreshHeader.STATE_READY); 
      } 
    } 
    mHeaderView.setVisiableHeight((int) space 
        + mHeaderView.getVisiableHeight()); 
  } 
 
 
  public void stopRefresh() { 
    if (mHeaderView.getStatus() == SRefreshHeader.STATE_REFRESHING) { 
      mHeaderView.setState(SRefreshHeader.STATE_NORMAL); 
      resetHeadView(SRefreshHeader.STATE_NORMAL); 
      reset(SRefreshHeader.STATE_NORMAL); 
    } 
  } 
 
  public void setOnRefreshListener(OnRefreshListener onRefreshListener) { 
    this.mOnRefreshListener= onRefreshListener; 
  } 
}

public class SRefreshHeader extends LinearLayout { 
  private LinearLayout mContainer; 
  private int mState = STATE_NORMAL; 
 
  private Animation mRotateUpAnim; 
  private Animation mRotateDownAnim; 
 
  private final int ROTATE_ANIM_DURATION = 500; 
 
  public final static int STATE_NORMAL = 0;//下拉刷新 
  public final static int STATE_READY = 1;//释放刷新 
  public final static int STATE_REFRESHING = 2;//刷新中 
  private ImageView mHeadArrowImage; 
  private TextView mHeadLastRefreashTimeTxt; 
  private TextView mHeadHintTxt; 
  private TextView mHeadLastRefreashTxt; 
  private ProgressBar mRefreshingProgress; 
 
  public SRefreshHeader(Context context) { 
    super(context); 
    initView(context); 
  } 
 
  /** 
   * @param context 
   * @param attrs 
   */ 
  public SRefreshHeader(Context context, AttributeSet attrs) { 
    super(context, attrs); 
    initView(context); 
  } 
 
  private void initView(Context context) { 
    // 初始情况，设置下拉刷新view高度为0 
    LayoutParams lp = new LayoutParams(LayoutParams.MATCH_PARENT, 0); 
    mCOntainer= (LinearLayout) LayoutInflater.from(context).inflate(R.layout.listview_head_view_layout, null); 
    addView(mContainer, lp); 
    setGravity(Gravity.BOTTOM); 
 
    mHeadArrowImage = (ImageView) findViewById(R.id.slistview_header_arrow); 
    mHeadLastRefreashTimeTxt = (TextView) findViewById(R.id.slistview_header_time); 
    mHeadHintTxt = (TextView) findViewById(R.id.slistview_header_hint_text); 
    mHeadLastRefreashTxt = (TextView) findViewById(R.id.slistview_header_last_refreash_txt); 
    mRefreshingProgress = (ProgressBar) findViewById(R.id.slistview_header_progressbar); 
 
    mRotateUpAnim = new RotateAnimation(0.0f, -180.0f, 
        Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 
        0.5f); 
    mRotateUpAnim.setDuration(ROTATE_ANIM_DURATION); 
    mRotateUpAnim.setFillAfter(true); 
    mRotateDownAnim = new RotateAnimation(-180.0f, 0.0f, 
        Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 
        0.5f); 
    mRotateDownAnim.setDuration(ROTATE_ANIM_DURATION); 
    mRotateDownAnim.setFillAfter(true); 
  } 
 
  public void setState(int state) { 
    if (state == mState) return; 
 
    if (state == STATE_REFRESHING) {  // 显示进度 
      mHeadArrowImage.clearAnimation(); 
      mHeadArrowImage.setVisibility(View.INVISIBLE); 
      mRefreshingProgress.setVisibility(View.VISIBLE); 
    } else {  // 显示箭头图片 
      mHeadArrowImage.setVisibility(View.VISIBLE); 
      mRefreshingProgress.setVisibility(View.INVISIBLE); 
    } 
    switch (state) { 
      case STATE_NORMAL: 
        if (mState == STATE_READY) { 
          mHeadArrowImage.startAnimation(mRotateDownAnim); 
        } 
        if (mState == STATE_REFRESHING) { 
          mHeadArrowImage.clearAnimation(); 
        } 
        mHeadHintTxt.setText("下拉刷新"); 
        break; 
      case STATE_READY: 
        if (mState != STATE_READY) { 
          mHeadArrowImage.clearAnimation(); 
          mHeadArrowImage.startAnimation(mRotateUpAnim); 
          mHeadHintTxt.setText("松开刷新"); 
        } 
        break; 
      case STATE_REFRESHING: 
        mHeadHintTxt.setText("正在刷新"); 
        break; 
      default: 
    } 
 
    mState = state; 
  } 
 
  public void setVisiableHeight(int height) { 
    if (height <0) 
      height = 0; 
    LayoutParams lp = (LayoutParams) mContainer 
        .getLayoutParams(); 
    lp.height = height; 
    mContainer.setLayoutParams(lp); 
  } 
 
 
  public int getStatus() { 
    return mState; 
  } 
 
  public int getVisiableHeight() { 
    return mContainer.getHeight(); 
  } 
}

最后是布局文件

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。