Android ListView 下拉刷新 上滑加载

开发项目过程中基本都会用到listView的下拉刷新和上滑加载更多,之前大家最常用的应该是pull to refresh或它的变种版吧,google官方在最新的android.support.v4包中增加了一个新类SwipeRefreshLayout,地址 这个类的作用就是提供官方的下拉刷新,并且效果相当不错,而上拉加载更多则用我们自定义的listview,也是相当简单。

下拉刷新

简单的介绍下:

首先它是一个viewgroup,但是它只允许有一个子控件,子控件能是任何view,使用的时候,所在类实现OnRefreshListener接口,在onRefresh()方法中实现所要完成的任务,

findviewbyid得到SwipeRefreshLayout后,显示刷新动画用SwipeRefreshLayout.setRefreshing(true);取消刷新动画用SwipeRefreshLayout.setRefreshing(false);相当简单。

另外有一些其他的常用方法比如判断时候正在显示刷新动画,用SwipeRefreshLayout.isShown()。

布局:

    <com.example.listviewloadmore.loadmorelistview android:id="@+id/listView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello_world">
    </com.example.listviewloadmore.loadmorelistview>
</android.support.v4.widget.swiperefreshlayout>

上拉加载更多

思路:监听滑动事件并判断是否到达底部,到达底部的时候,回调我们定义好的一个方法,从而达到上拉加载更多的目的。 但是具体怎么监听和回调呢,我们不妨看看Button控件的点击事件的执行流程,Button继承textView,textView继承View 1.实现OnClickListener接口,重写onClick方法 2.设置Button.setOnClickListener(this)或者new一个接口也一样的。 查看View源码,我们可得知 \加载中... View类中有OnClickOistener接口,setOnClickListener方法
那么我们在我们自己的listview中要实现的步骤狠清楚了 1.myListView继承listView 2.实现onLoadMore接口 3.在类中声明onLoadMore接口对象 4.设置点击方法setOnLoadMore 5.在需要的地方调用onLoadMore.loadMore方法。 下面附上MyListView源码:

package com.example.listviewloadmore;
 
import android.annotation.SuppressLint;
import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.AbsListView;
import android.widget.AbsListView.OnScrollListener;
import android.widget.ListView;
 
public class LoadMoreListView extends ListView implements OnScrollListener{
    private View footer;
     
    private int totalItem;
    private int lastItem;
     
    private boolean isLoading;
     
    private OnLoadMore onLoadMore;
     
    private LayoutInflater inflater;
     
    public LoadMoreListView(Context context) {
        super(context);
        init(context);
    }
 
    public LoadMoreListView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }
 
    public LoadMoreListView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context);
    }
 
    @SuppressLint("InflateParams")
    private void init(Context context) {
        inflater = LayoutInflater.from(context);
        footer = inflater.inflate(R.layout.load_more_footer,null ,false);
        footer.setVisibility(View.GONE);
        this.addFooterView(footer);
        this.setOnScrollListener(this);
    }
 
    @Override
    public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
        this.lastItem = firstVisibleItem+visibleItemCount;
        this.totalItem = totalItemCount;
    }
 
    @Override
    public void onScrollStateChanged(AbsListView view, int scrollState) {
        if(this.totalItem == lastItem&&scrollState == SCROLL_STATE_IDLE){
            Log.v("isLoading", "yes");
            if(!isLoading){
                isLoading=true;
                footer.setVisibility(View.VISIBLE);
                onLoadMore.loadMore();
            }
        }
    }
    public void setLoadMoreListen(OnLoadMore onLoadMore){
        this.onLoadMore = onLoadMore;
    }
    /**
     * 加载完成调用此方法
     */
    public void onLoadComplete(){
        footer.setVisibility(View.GONE);
        isLoading = false;
         
    }
     
    public interface OnLoadMore{
        public void loadMore();
    }
 
}

代码不是很复杂,认真看一定能看明白。 底部正在加载布局代码

<!--?xml version="1.0" encoding="utf-8"?-->
<relativelayout android:id="@+id/load_more_footer" android:layout_width="fill_parent" android:layout_height="wrap_content" xmlns:android="http://schemas.android.com/apk/res/android">
 
    <linearlayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerinparent="true">
 
        <progressbar android:id="@+id/load_more_progressBar" android:layout_width="36dp" android:layout_height="36dp" android:visibility="visible" android:padding="3dp">
 
        <textview android:id="@+id/no_more_textView" android:layout_width="wrap_content" android:layout_height="36dp" android:text="正在加载" android:visibility="visible" android:textsize="16sp" android:textcolor="#666666" android:gravity="center">
    </textview></progressbar></linearlayout>
 
</relativelayout>

基本到这上拉加载更多就结束了。 下面就是把下拉上拉结合起来用了 布局文件main.xml

<relativelayout android:layout_width="match_parent" android:layout_height="match_parent" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" tools:context="com.example.listviewloadmore.MainActivity" android:paddingtop="@dimen/activity_vertical_margin" android:paddingright="@dimen/activity_horizontal_margin" android:paddingleft="@dimen/activity_horizontal_margin" android:paddingbottom="@dimen/activity_vertical_margin">
 
     
 
        <com.example.listviewloadmore.loadmorelistview android:id="@+id/listView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello_world">
        </com.example.listviewloadmore.loadmorelistview>
    </android.support.v4.widget.swiperefreshlayout>
 
</relativelayout>
 

MainActivity代码

package com.example.listviewloadmore;
 
import java.util.ArrayList;
 
import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.support.v4.widget.SwipeRefreshLayout;
import android.support.v4.widget.SwipeRefreshLayout.OnRefreshListener;
import android.widget.ArrayAdapter;
import android.widget.Toast;
 
import com.example.listviewloadmore.LoadMoreListView.OnLoadMore;
 
public class MainActivity extends Activity implements OnRefreshListener, OnLoadMore {
    private LoadMoreListView listView;
    private SwipeRefreshLayout swip;
    private int page = 1;
    ArrayList<string> data1 = new ArrayList<string>();
    private ArrayAdapter<string> adapter;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        initData(1);
    }
 
 
    private void initView() {
        listView = (LoadMoreListView) findViewById(R.id.listView);
        listView.setLoadMoreListen(this);
        swip = (SwipeRefreshLayout) findViewById(R.id.swip_index);
        swip.setOnRefreshListener(this);
        swip.setColorSchemeResources(android.R.color.holo_blue_light, android.R.color.holo_red_light, android.R.color.holo_orange_light,
                android.R.color.holo_green_light);
        adapter = new ArrayAdapter<string>(this, android.R.layout.simple_list_item_1, data1);
    }
    /**
     * 加载数据
     * @param page2 页数
     */
    private void initData(int page2) {
        // TODO Auto-generated method stub
        if(page2==1){
            for (int i = 0; i < 10; i++) {
                data1.add((i+1)+"");
                listView.setAdapter(adapter);
            }
        }else{
            data1.add("新加的第"+(9+page2)+"个");
        }
    }
    // 下拉刷新的方法
    @Override
    public void onRefresh() {
        Toast.makeText(this, "开始刷新啦", Toast.LENGTH_SHORT).show();
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                if(swip.isShown()){
                    swip.setRefreshing(false);
                }
                Toast.makeText(MainActivity.this, "刷新完成了", Toast.LENGTH_SHORT).show();
            }
        }, 3000);
    }
 
    // 加载更多的方法
    @Override
    public void loadMore() {
        page++;
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                initData(page);
                listView.onLoadComplete();
                Toast.makeText(MainActivity.this, "加载完成", Toast.LENGTH_SHORT).show();
                adapter.notifyDataSetChanged();
            }
        }, 3000);
    }
 
}
</string></string></string></string>

上一下效果图:

源码地址:点击下载

 

posted @ 2015-05-16 09:55  卧龙传奇  阅读(194)  评论(0编辑  收藏  举报