Android下拉刷新上拉加载更多的扩展ListView

Android下拉刷新上拉加载更多的扩展ListView

下拉刷新上拉加载更多的扩展ListView

在很多APP我们都能看到，在一个列表上面，将手指往屏幕下面滑动，列表上方就会出现一个隐藏的View,一般写有“下拉刷新”等字样，意味着，我们将手指往下面滑动，字样又会变成 “放开刷新” 字样，这时候我们将手指放开屏幕，我们就会看到 字样变为 “正在刷新..." 并且旁边还有一个旋转的进度在旋转等待，过了1、2秒后，列表的新的数据加载完成，这个提示的view就又隐藏起来了。这就是Android中下拉刷新的控件，现在我们就自己来实现一个这样的控件，首先我们来讲解一下原理。如下图:

1、listView通过addHeaderView（header）一个方法可以添加头布局View即 header,这个header就是显示下拉刷新的view，然后将header的topMargin设置为它高度header.getHeight（）的负值，那么它就被隐藏在了手机屏幕的顶部，如下图中所示；

2、将listview设置滑动监听setOnscrollListner，用来监听用户手指的滑动状态，可以判断用户手指的按下，滑动，抬起等一整套完整的手指滑动事件，然后根据手指向下滑动的距离，动态的更新到listview的header的margin中，这样整个listview就会往下滑动，此时隐藏在手机屏幕顶部的header也就会从屏幕顶部慢慢的滚动出来，如下图所示。当header完全滚动出来后，这个时候listView向下滑动的距离Height大于了header的高度，这个时候就跟新header的显示状态，header就显示为 "放开刷新"，即放开手指listview就进行刷新操作。

3、当header显示为释放刷新的时候，这个时候手指离开屏幕，即点击事件为MotionEvent.UP,这个时候屏幕就会显示 ”正在刷新...“ 并且左边会有刷新的进度条在进行刷新等待，等到主Acitivity的新数据加载完成后就会隐藏掉header，这样一个完正的下拉刷新原理就讲完了。

我们讲完了下拉刷新，截下拉我们讲讲上拉加载更多。

在很多listview列表数据中，当我们拉到底部时，就会出现一个 圆形进度条和一个”正在加载更多...“，主要是用于分页加载网路数据，在我们访问网络数据时，如果数据较多，基本都会使用分页处理数据，让数据一批一批的加载进来，这样就会缓解手机端访问大量数据的压力，毕竟数据多，加载时间就会长，用户的等待时间也会增加，不利于用户体验。所以上拉加载更多，就在listview中使用了起来，也是android开发必备的知识。

如下图所示，listview通过addFooterView（View view）就可以通过判断是不是滑动到了底部，然后给listview添加底部view。让后让activity实现listview的刷新接口，当listview滑动到了底部，然后响应接口，当加载更多的实现完成之后，就开始设置listiview的loadingComplete()方法，就将加载更多的view给隐藏掉。

好了原理就是那样，现在我们看看效果

下面是 RefreshListView的代码

package com.example.myfirst.pulltorefreshlist;

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.RotateAnimation;
import android.widget.AbsListView;
import android.widget.AbsListView.OnScrollListener;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.ProgressBar;
import android.widget.TextView;

import java.text.SimpleDateFormat;

public class RefreshListView extends ListView implements OnScrollListener {

    /**
     * 下拉刷新部分
     */
    private static final String TAG = "RefreshListView";
    private int firstVisibleItemPosition;//listview中第一个可见item所在的位置position
    private int downY;//手指在Y轴下拉滑动的距离
    private int headerViewHeight;//下拉刷新view的高度
    private View headerView; //下拉刷新的view
    private final int DOWN_PULL_REFERESH = 0;//“下拉刷新”状态
    private final int RELEASE_REFRESH = 1;//“放开刷新”状态
    private final int REFRESHING = 2;//“正在刷新”状态
    private int currentState = DOWN_PULL_REFERESH;//listView当前的状态，默认为”下拉刷新“状态
    private Animation upAnimation; //下拉箭头变为向上箭头的动画
    private Animation downAnimation; //上拉箭头变为向下箭头的动画
    private ImageView ivArrow; //下拉箭头
    private ProgressBar mProgressBar; //进度条
    private TextView tvState; //显示状态的文本
    private TextView tvLastUpdateTimes; //显示最后更新的时间

    /**
     * 底部加载更多部分
     */
    private boolean isScrollToBottom;//判断是不是滑到了底部
    private View footerView; //底部的footer   view
    private int footerViewHeight; //底部view的高度
    private boolean isLoadingMore = false; //判断是不是"加载更多"

    /**
     * listview的接口，监听listview的下来刷新和上拉加载更多
     */
    private OnRefreshListener mOnRefreshListener;

    public RefreshListView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initHeaderView();
        initFooterView();
        this.setOnScrollListener(this);
    }

    /**
     * 初始化底部view
     */
    private void initFooterView() {
        footerView = View.inflate(getContext(), R.layout.footer_layout, null);
        //设置（0，0）以便系统测量footerView的宽高
        footerView.measure(0, 0);
        footerViewHeight = footerView.getMeasuredHeight();
        footerView.setPadding(0, -footerViewHeight, 0, 0);
        this.addFooterView(footerView);
    }

    /**
     * 初始化顶部view
     */
    private void initHeaderView() {
        headerView = View.inflate(getContext(), R.layout.header_layout, null);
        ivArrow = (ImageView) headerView.findViewById(R.id.pull_to_refresh_icon);
        mProgressBar = (ProgressBar) headerView.findViewById(R.id.refresh_progressbar);
        tvState = (TextView) headerView.findViewById(R.id.hint_text);
        tvLastUpdateTimes = (TextView) headerView.findViewById(R.id.refresh_time);

        //最近更新
        tvLastUpdateTimes.setText("最近更新:" + getLastUpdateTime());
        //设置（0，0）以便系统测量footerView的宽高
        headerView.measure(0, 0);
        headerViewHeight = headerView.getMeasuredHeight();
        headerView.setPadding(0, -headerViewHeight, 0, 0);
        this.addHeaderView(headerView);
        initAnimation();
    }

    /**
     * 获取最近更新时间
     */
    private String getLastUpdateTime() {
        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-mm-dd HH:mm:ss");
        return sdf.format(System.currentTimeMillis());
    }

    /**
     * 初始化动画
     */
    private void initAnimation() {
        upAnimation = new RotateAnimation(0f, -180f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
        upAnimation.setDuration(500);
        upAnimation.setFillAfter(true);//设为true,表示动画完成后，保持动画后的状态

        downAnimation = new RotateAnimation(-180f, -360f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
        downAnimation.setDuration(500);
        downAnimation.setFillAfter(true);//设为true,表示动画完成后，保持动画后的状态

    }

    /**
     * listView的touche事件，通过判断手指在listview上面的，按下、滑动、抬起等一套手指动作，来实现
     * 下拉刷新和上拉加载更多
     *
     * @param ev
     * @return
     */
    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        switch (ev.getAction()) {
            case MotionEvent.ACTION_DOWN:
                downY = (int) ev.getY();
                break;
            case MotionEvent.ACTION_MOVE:
                int moveY = (int) ev.getY();
                //获取滑动距离一半长度，以便手指在屏幕上面滑动了很长一段距离，headerview也不是很高，
                //主要为了美观，你可以不用除2，看你自己的设计，不过除2显示效果要好点
                int diff = (moveY - downY) / 2;