PullToRefreshListView 應用講解

轉載於http://blog.csdn.net/mmjiajia132/article/details/40397813

PullToRefreshListView 用法和ListView 沒有什麼區別  listview能用的屬性 pulltorefresh也能用

我一直認爲動手是最好的學習方法...

一：首先看佈局文件

 

<?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="match_parent"
    android:orientation="vertical" >

    <!--     ptr:ptrAnimationStyle="flip"  flip:翻轉  rotate:旋轉-->
    <!--     ptr:ptrShowIndicator="true"  右上角 右下角出現箭頭-->
    <com.handmark.pulltorefresh.library.PullToRefreshListView
        xmlns:ptr="http://schemas.android.com/apk/res-auto"
        android:id="@+id/pullToRefresh"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        ptr:ptrDrawable="@drawable/default_ptr_flip"
        ptr:ptrAnimationStyle="flip"
        ptr:ptrHeaderBackground="#383838"
        ptr:ptrHeaderTextColor="#FFFFFF"
        />

</LinearLayout>

ptr是pullToRefresh的配置屬性 使用是需要添加 xmlns:ptr="http://schemas.android.com/apk/res-auto"

 

ptr:ptrDrawable=“” 上拉下拉圖標
ptr:ptrAnimationStyle=""  圖標動畫  取值： flip:翻轉 rotate旋轉
ptr:ptrHeaderBackground=""  上拉下拉時 頭部的背景色
ptr:ptrHeaderTextColor=""     上拉下拉時 文字顏色

還有一些常用屬性

ptrRefreshableViewBackground 設置整個mPullRefreshListView的背景色

 

ptrScrollingWhileRefreshingEnabled刷新的時候，是否允許ListView或GridView滾動。覺得爲true比較好。

ptrListViewExtrasEnabled 決定了Header，Footer以何種方式加入mPullRefreshListView，true爲headView方式加入，就是滾動時刷新頭部會一起滾動。

注：上述屬性都可以代碼添加，請用pullToRefresh.set查看

二：MainActivity代碼

 

public class MainActivity extends ActionBarActivity {

    private PullToRefreshListView pullToRefresh;
    private List<PullBean> data = new ArrayList<PullBean>();
    MyAdapter adapter;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        pullToRefresh = (PullToRefreshListView) findViewById(R.id.pullToRefresh);
        data = getData();
        adapter = new MyAdapter(this);
        pullToRefresh.setAdapter(adapter);
        /*
         * Mode.BOTH：同時支持上拉下拉
         * Mode.PULL_FROM_START：只支持下拉Pulling Down
         * Mode.PULL_FROM_END：只支持上拉Pulling Up
         */
        /*
         * 如果Mode設置成Mode.BOTH，需要設置刷新Listener爲OnRefreshListener2，並實現onPullDownToRefresh()、onPullUpToRefresh()兩個方法。
         * 如果Mode設置成Mode.PULL_FROM_START或Mode.PULL_FROM_END，需要設置刷新Listener爲OnRefreshListener，同時實現onRefresh()方法。
         * 當然也可以設置爲OnRefreshListener2，但是Mode.PULL_FROM_START的時候只調用onPullDownToRefresh()方法，
         * Mode.PULL_FROM的時候只調用onPullUpToRefresh()方法.
         */
        pullToRefresh.setMode(Mode.BOTH);
        init();

        /*
         * setOnRefreshListener(OnRefreshListener listener):設置刷新監聽器；
         * setOnLastItemVisibleListener(OnLastItemVisibleListener listener):設置是否到底部監聽器；
         * setOnPullEventListener(OnPullEventListener listener);設置事件監聽器；
         * onRefreshComplete()：設置刷新完成
         */
        /*
         * pulltorefresh.setOnScrollListener()
         */
        // SCROLL_STATE_TOUCH_SCROLL(1) 正在滾動
        // SCROLL_STATE_FLING(2) 手指做了拋的動作（手指離開屏幕前，用力滑了一下）
        // SCROLL_STATE_IDLE(0) 停止滾動
        /*
         * setOnLastItemVisibleListener
         * 當用戶拉到底時調用
         */
        /*
         * setOnTouchListener是監控從點下鼠標 （可能拖動鼠標）到放開鼠標（鼠標可以換成手指）的整個過程 ，他的回調函數是onTouchEvent（MotionEvent event）,
         * 然後通過判斷event.getAction()是MotionEvent.ACTION_UP還是ACTION_DOWN還是ACTION_MOVE分別作不同行爲。
         * setOnClickListener的監控時間只監控到手指ACTION_DOWN時發生的行爲
         */
        pullToRefresh.setOnRefreshListener(new OnRefreshListener2<ListView>(){
            @Override
            public void onPullDownToRefresh(
                    PullToRefreshBase<ListView> refreshView) {
                // TODO Auto-generated method stub
                 PullBean bean = new PullBean();
                 bean.setTitle("下拉刷新");
                 bean.setContent("我的神");
                 adapter.addFirst(bean);
                 new FinishRefresh().execute();
                 adapter.notifyDataSetChanged();
            }

            @Override
            public void onPullUpToRefresh(
                    PullToRefreshBase<ListView> refreshView) {
                // TODO Auto-generated method stub
                PullBean bean = new PullBean();
                bean.setTitle("上拉刷新");
                bean.setContent("我的神");
                adapter.addLast(bean);
                new FinishRefresh().execute();
                adapter.notifyDataSetChanged();
            }
        });


//      pullToRefresh.setOnRefreshListener(new OnRefreshListener<ListView>() {
//
//          @Override
//          public void onRefresh(PullToRefreshBase<ListView> refreshView) {
//              // TODO Auto-generated method stub
//              String label = DateUtils.formatDateTime(getApplicationContext(), System.currentTimeMillis(),
//                        DateUtils.FORMAT_SHOW_TIME | DateUtils.FORMAT_SHOW_DATE | DateUtils.FORMAT_ABBREV_ALL);
//
//                // Update the LastUpdatedLabel
//                refreshView.getLoadingLayoutProxy().setLastUpdatedLabel(label);
//                PullBean bean = new PullBean();
//                bean.setTitle("我的神");
//                bean.setContent("我的神");
//                adapter.addFirst(bean);
//                new FinishRefresh().execute();
//          }
//
//      });
    }

    private void init()
    {
        ILoadingLayout startLabels = pullToRefresh
                .getLoadingLayoutProxy(true, false);
        startLabels.setPullLabel("下拉刷新...");// 剛下拉時，顯示的提示
        startLabels.setRefreshingLabel("正在載入...");// 刷新時
        startLabels.setReleaseLabel("放開刷新...");// 下來達到一定距離時，顯示的提示

        ILoadingLayout endLabels = pullToRefresh.getLoadingLayoutProxy(
                false, true);
        endLabels.setPullLabel("上拉刷新...");// 剛下拉時，顯示的提示
        endLabels.setRefreshingLabel("正在載入...");// 刷新時
        endLabels.setReleaseLabel("放開刷新...");// 下來達到一定距離時，顯示的提示

//      // 設置下拉刷新文本
//      pullToRefresh.getLoadingLayoutProxy(false, true)
//              .setPullLabel("上拉刷新...");
//      pullToRefresh.getLoadingLayoutProxy(false, true).setReleaseLabel(
//              "放開刷新...");
//      pullToRefresh.getLoadingLayoutProxy(false, true).setRefreshingLabel(
//              "正在加載...");
//      // 設置上拉刷新文本
//      pullToRefresh.getLoadingLayoutProxy(true, false)
//              .setPullLabel("下拉刷新...");
//      pullToRefresh.getLoadingLayoutProxy(true, false).setReleaseLabel(
//              "放開刷新...");
//      pullToRefresh.getLoadingLayoutProxy(true, false).setRefreshingLabel(
//              "正在加載...");
    }

    private List<PullBean> getData(){
        List<PullBean> list = new ArrayList<PullBean>();
        for(int i = 0;i < 10;i ++){
            PullBean bean = new PullBean();
            bean.setTitle("item " + i + " 搜索業務增速下滑 Google廉頗老矣?");
            bean.setContent("Google於10月17日發佈了2014年第三季度財報");
            list.add(bean);
        }

        return list;
    }

    private class FinishRefresh extends AsyncTask<Void, Void, Void>{
        @Override
        protected Void doInBackground(Void... params) {
             try {
                 Thread.sleep(1000);
             } catch (InterruptedException e) {
             }
            return null;
        }

        @Override
        protected void onPostExecute(Void result){
//          adapter.notifyDataSetChanged();
            pullToRefresh.onRefreshComplete();
        }
    }

    private class MyAdapter extends BaseAdapter{
        private LayoutInflater mInflater;

        public MyAdapter(Context context) {
            // TODO Auto-generated constructor stub
            mInflater = LayoutInflater.from(context);
        }

        public void addFirst(PullBean bean){
            data.add(0, bean);
        }

        public void addLast(PullBean bean){
            data.add(bean);
        }

        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return data.size();
        }

        @Override
        public Object getItem(int position) {
            // TODO Auto-generated method stub
            return data.get(position);
        }

        @Override
        public long getItemId(int position) {
            // TODO Auto-generated method stub
            return 0;
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            // TODO Auto-generated method stub
            ViewHolder viewHolder = null;
            if(convertView == null){
                viewHolder = new ViewHolder();
                convertView = mInflater.inflate(R.layout.item, null);
                viewHolder.title = (TextView) convertView.findViewById(R.id.title);
                viewHolder.content = (TextView) convertView.findViewById(R.id.content);

                convertView.setTag(viewHolder);
            }else{
                viewHolder = (ViewHolder) convertView.getTag();
            }

            viewHolder.title.setText(data.get(position).getTitle());
            viewHolder.content.setText(data.get(position).getContent());

            return convertView;
        }

        class ViewHolder{
            TextView title;
            TextView content;
        }
    }



}

pullToRefresh適配器Adapter和listview也是繼承於BaseAdapter 看一下item的佈局

 

item.xml

 

<?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="match_parent"
    android:padding="5dp"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="18sp"
        android:textColor="#BA55D3"
        android:text="我的神"/>

    <TextView
        android:id="@+id/content"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="14.0sp"
        android:layout_marginTop="5dp"
        android:textColor="#7CFC00"
        android:text="我的神"/>
</LinearLayout>

pullToRefresh 通過setMode來設置是否可以上拉下拉

 

Mode.BOTH：同時支持上拉下拉

Mode.PULL_FROM_START：只支持下拉Pulling Down

Mode.PULL_FROM_END：只支持上拉Pulling Up

也可以用 ptr:ptrMode="both"

可選值爲：disabled（禁用下拉刷新），pullFromStart（僅支持下拉刷新），pullFromEnd（僅支持上拉刷新），both（二者都支持），manualOnly（只允許手動觸發）

如果Mode設置成Mode.BOTH，需要設置刷新Listener爲OnRefreshListener2，並實現onPullDownToRefresh()、onPullUpToRefresh()兩個方法。 

如果Mode設置成Mode.PULL_FROM_START或Mode.PULL_FROM_END，需要設置刷新Listener爲OnRefreshListener，同時實現onRefresh()方法。

當然也可以設置爲OnRefreshListener2，但是Mode.PULL_FROM_START的時候只調用onPullDownToRefresh()方法，Mode.PULL_FROM的時候只調用onPullUpToRefresh()方法.

如果想上拉、下拉刷新的時候 做一樣的操作，那就用OnRefreshListener，上拉下拉的時候都調用

如果想上拉、下拉做不一樣的的操作，那就在setOnRefreshListener時 用new OnRefreshListener2<ListView>

當然如果想自己設置上拉下拉中的文字 可以這樣

 

ILoadingLayout startLabels = pullToRefresh
         .getLoadingLayoutProxy(true, false);
 startLabels.setPullLabel("下拉刷新...");// 剛下拉時，顯示的提示
 startLabels.setRefreshingLabel("正在載入...");// 刷新時
 startLabels.setReleaseLabel("放開刷新...");// 下來達到一定距離時，顯示的提示

 ILoadingLayout endLabels = pullToRefresh.getLoadingLayoutProxy(
         false, true);
 endLabels.setPullLabel("上拉刷新...");// 剛下拉時，顯示的提示
 endLabels.setRefreshingLabel("正在載入...");// 刷新時
 endLabels.setReleaseLabel("放開刷新...");// 下來達到一定距離時，顯示的提示

 

當然也可以這樣

 

             pullToRefresh.getLoadingLayoutProxy(false, true)
        .setPullLabel("上拉刷新...");
pullToRefresh.getLoadingLayoutProxy(false, true).setReleaseLabel(
        "放開刷新...");
pullToRefresh.getLoadingLayoutProxy(false, true).setRefreshingLabel(
        "正在加載...");
// 設置上拉刷新文本
pullToRefresh.getLoadingLayoutProxy(true, false)
        .setPullLabel("下拉刷新...");
pullToRefresh.getLoadingLayoutProxy(true, false).setReleaseLabel(
        "放開刷新...");
pullToRefresh.getLoadingLayoutProxy(true, false).setRefreshingLabel(
        "正在加載...");

 

 

顯然在實際操作的時候也會用到其他監聽

 setOnScrollListener()

 SCROLL_STATE_TOUCH_SCROLL 正在滾動    
 SCROLL_STATE_FLING 手指做了拋的動作（手指離開屏幕前，用力滑了一下）    
 SCROLL_STATE_IDLE 停止滾動     

setOnLastItemVisibleListener

當用戶拉到底時調用  

setOnItemClickListener()

爲pullToRefresh中每一個item設置事件

代碼下載：點擊下載代碼

下拉上拉 圖標和文字 位置改動是在PullToRefresh源代碼中改的即：PullToRefreshListView.handleStyledAttributes 中lp的Gravity改爲CENTER_VERTICAL

如果想要改動圖標和文字的距離和佈局 在這library項目下這兩個文件改

pull_to_refresh_header_horizontal.xml

pull_to_refresh_header_vertical.xml

參考博客：

http://blog.csdn.net/lmj623565791/article/details/38238749

http://blog.csdn.net/harvic880925/article/details/17680305

謝謝原作者