探索SwipeRefreshLayout配合自定义ListView完成下拉刷新、滑到底部自动加载更多

在Android开发过程中经常需要实现上下拉刷新功能，Google推出的下拉刷新控件SwipeRefreshLayout（彩虹条），由于官方版本只有下拉刷新而没有上拉加载更多的功能，很多人也尝试在这个基础上进行改写。今天尝试一下使用SwipeRefreshLayout配合自定义ListView实现下拉刷新、滑到底部自动加载更多的功能。

效果图如下所示，在进入页面的时候加载自动刷新，滑到底部自动加载更多，当数据已经加载完成则显示已经加载完成，，否则上拉任可继续加载

先贴一下项目结构图吧，这样可能对于整个项目的了解会比较清晰一些

1.在效果图中我们可以看到在头部刷新时候的进度条ProgressBar的颜色本身是可以改变的，所以在color.xml中定义头部刷新时候的四种颜色，用于通过此颜色资源文件设置进度条动画的颜色

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- 灰色 -->
    <color name="grey">#FF999999</color>
    <!--头部刷新时候的四种颜色-->
    <color name="refresh_color_1">#ff00ddff</color>
    <color name="refresh_color_2">#ff99cc00</color>
    <color name="refresh_color_3">#ffffbb33</color>
    <color name="refresh_color_4">#ffff4444</color>
</resources>

2.重写SwipeRefreshLayout下拉刷新控件

package com.xiaolijuan.swiperefreshlayoutdome.widget;

import android.content.Context;
import android.content.res.Resources;
import android.support.v4.widget.SwipeRefreshLayout;
import android.util.AttributeSet;
import android.view.MotionEvent;

import com.xiaolijuan.swiperefreshlayoutdome.R;

/**
 * 项目名称：SwipeRefreshLayoutDome
 * 类描述：配合LoadMoreListView 完成下拉刷新、滑到底部自动加载更多
 * 创建人：xiaolijuan
 * 创建时间：2015/12/12 9:00
 */
public class RefreshAndLoadMoreView extends SwipeRefreshLayout {
    private LoadMoreListView mLoadMoreListView;

    /**
     * 构造方法，用于在布局文件中用到这个自定义SwipeRefreshLayout控件
     * @param context
     * @param attrs
     */
    public RefreshAndLoadMoreView(Context context, AttributeSet attrs) {
        super(context, attrs);
        Resources res = getResources();
        //通过颜色资源文件设置进度动画的颜色资源
        setColorSchemeColors(res.getColor(R.color.refresh_color_1),
                res.getColor(R.color.refresh_color_2),
                res.getColor(R.color.refresh_color_3),
                res.getColor(R.color.refresh_color_4));
    }
    public void setLoadMoreListView(LoadMoreListView mLoadMoreListView) {
        this.mLoadMoreListView = mLoadMoreListView;
    }

    /**
     * 触屏事件,如果ListView不为空且数据还在加载中，则继续加载直至完成加载才触摸此事件
     * @param ev
     * @return
     */
    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        if (mLoadMoreListView != null && mLoadMoreListView.isLoading()) {
            return false;
        }
        return super.onTouchEvent(ev);
    }
}

3.在update_loading_progressbar.xml定义进度条旋转的动画效果，用于设置绘制不显示进度的进度条的Drawable对象

<?xml version="1.0" encoding="utf-8"?>
<!--画面转移旋转动画效果：以组件的中点为中心顺时针从0度旋转到720度-->
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@mipmap/default_ptr_rotate_gray"
    android:duration="700"
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="720" />

4.pull_to_load_footer.xml这是在ListView中载入的头部布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:orientation="vertical">

    <View style="@style/horizontalDivider" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:gravity="center">

        <ProgressBar
            android:id="@+id/footer_progressbar"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:layout_marginRight="8dp"
            android:gravity="center"
            android:indeterminateDrawable="@anim/update_loading_progressbar"
            android:visibility="visible" />

        <TextView
            android:id="@+id/footer_hint_textview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="正在加载中"
            android:textColor="#999999"
            android:textSize="14dp" />
    </LinearLayout>
</LinearLayout>

5.重写ListView，用于配合RefreshAndLoadMoreView 完成下拉刷新、滑到底部自动加载更多

package com.xiaolijuan.swiperefreshlayoutdome.widget;

import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.AbsListView;
import android.widget.ListView;
import android.widget.ProgressBar;
import android.widget.TextView;

import com.xiaolijuan.swiperefreshlayoutdome.R;

/**
 * 项目名称：SwipeRefreshLayoutDome
 * 类描述：配合RefreshAndLoadMoreView 完成下拉刷新、滑到底部自动加载更多
 * 创建人：xiaolijuan
 * 创建时间：2015/12/12 9:02
 */
public class LoadMoreListView extends ListView implements AbsListView.OnScrollListener {
    private View rooterView;
    private boolean isHaveMoreData = true;// 是否有更多数据(默认为有)
    private ProgressBar progressBar;
    private TextView tipContext;

    private RefreshAndLoadMoreView mRefreshAndLoadMoreView;
    private boolean isLoading = false;// 是否正在加载

    private OnLoadMoreListener mOnLoadMoreListener;

    public LoadMoreListView(Context context, AttributeSet attrs) {
        super(context, attrs);
        //动态载入底部布局
        rooterView = LayoutInflater.from(context).inflate(
                R.layout.pull_to_load_footer, null);
        progressBar = (ProgressBar) rooterView.findViewById(R.id.footer_progressbar);
        tipContext = (TextView) rooterView.findViewById(R.id.footer_hint_textview);
        //向listView的底部添加布局(此时当给listView设置Item点击事件的时候，默认不触发这个添加的布局的点击事件)
        addFooterView(rooterView, null, false);
        setOnScrollListener(this);
    }

    public void setRefreshAndLoadMoreView(RefreshAndLoadMoreView mRefreshAndLoadMoreView) {
        this.mRefreshAndLoadMoreView = mRefreshAndLoadMoreView;
    }

    /**
     * 设置是否还有更多数据
     *
     * @param isHaveMoreData
     */
    public void setHaveMoreData(boolean isHaveMoreData) {
        this.isHaveMoreData = isHaveMoreData;
        if (!isHaveMoreData) {
            tipContext.setText("只有这么多啦");
            progressBar.setVisibility(View.GONE);
        } else {
            tipContext.setText("正在加载");
            progressBar.setVisibility(View.VISIBLE);
        }
    }

    /**
     * 加载完成
     */
    public void onLoadComplete() {
        isLoading = false;
    }

    public boolean isLoading() {
        return isLoading;
    }

    @Override
    public void onScrollStateChanged(AbsListView view, int scrollState) {
        if (scrollState == OnScrollListener.SCROLL_STATE_IDLE) {
            if (view.getLastVisiblePosition() == view.getCount() - 1 && (mRefreshAndLoadMoreView != null &&
                    !mRefreshAndLoadMoreView.isRefreshing()) && !isLoading && mOnLoadMoreListener != null && isHaveMoreData) {
                isLoading = true;
                mOnLoadMoreListener.onLoadMore();
            }
        }
    }

    @Override
    public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {

    }

    /**
     * 加载更多的监听
     */
    public static interface OnLoadMoreListener {
        public void onLoadMore();
    }

    /**
     * 设置加载监听
     *
     * @param mOnLoadMoreListener
     */
    public void setOnLoadMoreListener(OnLoadMoreListener mOnLoadMoreListener) {
        this.mOnLoadMoreListener = mOnLoadMoreListener;
    }
}

6.MyAdapter

package com.xiaolijuan.swiperefreshlayoutdome.adapter;

import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;

import com.xiaolijuan.swiperefreshlayoutdome.R;

import java.util.List;

/**
 * 项目名称：SwipeRefreshLayoutDome
 * 类描述：适配器
 * 创建人：xiaolijuan
 * 创建时间：2015/12/12 22:09
 */
public class MyAdapter extends BaseAdapter {
    private Context context;
    private List<String> mTitleArray;// 标题数组
    private int layoutId;

    /**
     * 构造方法
     * @param context 上下文对象
     * @param mTitleArray 标题数组
     * @param layoutId 布局Id
     */
    public MyAdapter(Context context, List<String> mTitleArray, int layoutId) {
        this.context = context;
        this.mTitleArray = mTitleArray;
        this.layoutId = layoutId;
    }

    /**
     * 获取Item总数
     * @return
     */
    @Override
    public int getCount() {
        return mTitleArray.size();
    }

    /**
     * 获取一个Item对象
     * @param position
     * @return
     */
    @Override
    public Object getItem(int position) {
        return mTitleArray.get(position);
    }

    /**
     * 获取指定item的Id
     * @param position
     * @return
     */
    @Override
    public long getItemId(int position) {
        return position;
    }

    /**
     * 绘制的内容均在此实现
     * @param position position就是位置从0开始
     * @param convertView convertView是Spinner中每一项要显示的view
     * @param parent parent就是父窗体了，也就是ListView
     * @return
     */
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View item = convertView != null ? convertView : View.inflate(context, layoutId, null);
        TextView txt_name = (TextView) item.findViewById(R.id.txt_title);
        txt_name.setText(mTitleArray.get(position));
        return item;
    }
}

7.具体代码，代码写的很详细

package com.xiaolijuan.swiperefreshlayoutdome.activits;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.os.Handler;
import android.support.v4.widget.SwipeRefreshLayout;
import android.view.View;
import android.widget.AdapterView;
import android.widget.Toast;

import com.xiaolijuan.swiperefreshlayoutdome.R;
import com.xiaolijuan.swiperefreshlayoutdome.adapter.MyAdapter;
import com.xiaolijuan.swiperefreshlayoutdome.widget.LoadMoreListView;
import com.xiaolijuan.swiperefreshlayoutdome.widget.RefreshAndLoadMoreView;

import java.util.ArrayList;
import java.util.List;

/**
 * 项目名称：SwipeRefreshLayoutDome
 * 类描述：主界面
 * 创建人：xiaolijuan
 * 创建时间：2015/12/12 20:00
 */
public class MainActivity extends Activity {
    private Context mContext;
    private int pageIndex = 0;
    private MyAdapter adapter;
    private LoadMoreListView mLoadMoreListView;
    private RefreshAndLoadMoreView mRefreshAndLoadMoreView;
    private List<String> datas = new ArrayList<String>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mContext = this;
        mLoadMoreListView = (LoadMoreListView) findViewById(R.id.load_more_list);
        mRefreshAndLoadMoreView = (RefreshAndLoadMoreView) findViewById(R.id.refresh_and_load_more);
        adapter = new MyAdapter(mContext, datas, R.layout.item_layout);
        mLoadMoreListView.setAdapter(adapter);
        initData();
    }

    private void initData() {
        //程序开始就加载第一页数据
        loadData(1);
        mRefreshAndLoadMoreView.setLoadMoreListView(mLoadMoreListView);
        mLoadMoreListView.setRefreshAndLoadMoreView(mRefreshAndLoadMoreView);
        //设置下拉刷新监听
        mRefreshAndLoadMoreView.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
            @Override
            public void onRefresh() {
                loadData(1);
            }
        });
        //设置加载监听
        mLoadMoreListView.setOnLoadMoreListener(new LoadMoreListView.OnLoadMoreListener() {
            @Override
            public void onLoadMore() {
                loadData(pageIndex + 1);
            }
        });
        mLoadMoreListView.setOnItemClickListener(new ItemClickListener());
    }

    /**
     * 加载数据
     */
    private void loadData(final int tempPageIndex) {
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                if (tempPageIndex == 1) {
                    datas.clear();
                }
                getDatas(tempPageIndex);
                //在这里我设置当加载到第三页时设置已经加载完成
                if (tempPageIndex == 3) {
                    mLoadMoreListView.setHaveMoreData(false);
                } else {
                    mLoadMoreListView.setHaveMoreData(true);
                }
                pageIndex = tempPageIndex;
                adapter.notifyDataSetChanged();
                //当加载完成之后设置此时不在刷新状态
                mRefreshAndLoadMoreView.setRefreshing(false);
                mLoadMoreListView.onLoadComplete();
            }
        }, 1000);
    }

    /**
     * 模拟一些数据源
     *
     * @return
     */
    private List<String> getDatas(final int tempPageIndex) {
        switch (tempPageIndex) {
            case 1:
                for (int i = 0; i < 10; i++) {
                    datas.add("这是第" + (i + 1) + "个Item");
                }
                break;
            case 2:
                for (int i = 0; i < 10; i++) {
                    datas.add("这是第" + (i + 11) + "个Item");
                }
                break;
            case 3:
                for (int i = 0; i < 10; i++) {
                    datas.add("这是第" + (i + 21) + "个Item");
                }
                break;
            default:
                break;
        }

        return datas;
    }

    /**
     * 为ListView每个Item添加点击事件
     */
    public class ItemClickListener implements AdapterView.OnItemClickListener {

        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
            Toast.makeText(getApplicationContext(), datas.get(position), Toast.LENGTH_LONG).show();
        }
    }
}

8.结束啦，由于代码里边都有注释哒，我就不做解释咯，有不足的还望指导

Dome下载：探索SwipeRefreshLayout配合自定义ListView完成下拉刷新、滑到底部自动加载更多

时间： 2024-10-25 13:24:42

探索SwipeRefreshLayout配合自定义ListView完成下拉刷新、滑到底部自动加载更多的相关文章

android 安卓自定义listview实现下拉刷新

[1].重写listView public class MyListView extends ListView implements OnScrollListener {          private final static int RELEASE_To_REFRESH = 0;// 下拉过程的状态值       private final static int PULL_To_REFRESH = 1; // 从下拉返回到不刷新的状态值       private final static

自定义ListView实现下拉刷新,下拉加载的功能

package com.loaderman.myrefreshlistviewdemo; import android.content.Context; import android.util.AttributeSet; import android.util.Log; import android.view.MotionEvent; import android.view.View; import android.view.animation.Animation; import android

JRoll 2 使用文档（史上最强大的下拉刷新，滚动，无限加载插件）

概述 说明 JRoll,一款能滚起上万条数据,具有滑动加速.回弹.缩放.滚动条.滑动事件等功能,兼容CommonJS/AMD/CMD模块规范,开源,免费的轻量级html5滚动插件. JRoll第二版是在JRoll第一版基础上重写JRoll滑动算法,基于时间运动,解决帧频降低时滑动缓慢的问题,更改垂直水平方向判断方法,使捕获垂直水平方向更准确灵敏. JRoll第二版增减了一些api不完全兼容JRoll第一版. 先睹为快 http://www.chjtx.com/JRoll/demos/ 运行示例

ListView下拉刷新，上拉自动加载更多

下拉刷新,Android中非常普遍的功能.为了方便便重写的ListView来实现下拉刷新,同时添加了上拉自动加载更多的功能.设计最初是参考开源中国的Android客户端源码.先看示例图.          图1                                                                                                             图2          图3                      

Android listview的下拉刷新

<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">好久没有写博客了,今天我就写一个listview的下拉刷新分享给大家,希望对大家学习或者工作上有所帮助,其实呢,大家都知道,在现在的app当中,下拉刷新是比较常用的功能,用到的地方太多了,所以,今天我也就结合自己的思想给家真理一下,那么好,接下来,让我们一起学习,让你分分钟写出自己想要的

Android PullToRefresh （ListView GridView 下拉刷新） 使用详解

Android PullToRefresh (ListView GridView 下拉刷新) 使用详解 标签: Android下拉刷新pullToRefreshListViewGridView 版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[+] 转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/38238749,本文出自:[张鸿洋的博客] 群里一哥们今天聊天偶然提到这个git hub上的控件:pull-to-r

Android自定义控件——ListView的下拉刷新与上拉加载

转载请注明出处:http://blog.csdn.net/allen315410/article/details/39965327 1.简介 无疑,在Android开发中,ListView是使用非常频繁的控件之一,ListView提供一个列表的容易,允许我们以列表的形式将数据展示到界面上,但是Google给我们提供的原生ListView的控件,虽然在功能上很强大,但是在用户体验和动态效果上,还是比较差劲的.为了改善用户体验,市面上纷纷出现了各种各样的自定义的ListView,他们功能强大,界面美

Android UI--自定义ListView(实现下拉刷新+加载更多）

http://blog.csdn.net/wwj_748/article/details/12512885 Android UI--自定义ListView(实现下拉刷新+加载更多) 关于实现ListView下拉刷新和加载更多的实现,我想网上一搜就一堆.不过我就没发现比较实用的,要不就是实现起来太复杂,要不就是不健全的.因为小巫近期要开发新浪微博客户端,需要实现ListView的下拉刷新,所以就想把这个UI整合到项目当中去,这里只是一个demo,可以根据项目的需要进行修改. 就不要太在乎界面了哈:

ListView实现下拉刷新（一）建立头布局

一.效果演示 ListView实现下拉刷新,是很常见的功能.下面是一个模拟的效果,如下图:                                   效果说明:当往下拉ListView的时候,顶部就会有一个“下拉刷新”的标识被拉 出来,再往下拉的时候,标识就会变成”松开刷新“,期间还伴随一个箭头的变化.此时松开手指,则会变成进度条提示正在刷新,刷新完成后,则加载进来刷新的数据.如此反复,就是下拉刷新的功能. 二.准备Demo 其实本质上,ListView实现下拉刷新和实现分页加载都是一