1. 程式人生 > >TwinklingRefreshLayout 簡單實現實現下拉重新整理,上拉載入

TwinklingRefreshLayout 簡單實現實現下拉重新整理,上拉載入

支援下拉重新整理和上拉載入的RefreshLayout,自帶越界回彈效果,支援RecyclerView,AbsListView,ScrollView,WebView

本文以ListView為例,實現上拉重新整理和下拉載入,其他的就不在舉例,原理是一樣的。

先看一下效果(效果比較粗糙,主要是功能的實現。)

下拉獲取資料

鬆手獲取

上拉獲取

獲取資料

 

專案結構

 主要就是一個主Activity,一個實體,兩個xml檔案

實現過程

1.新增 gradle 依賴

將 libray 模組複製到專案中,或者直接在 build.gradle 中依賴:

compile 'com.lcodecorex:tkrefreshlayout:1.0.7'

2在 xml 中新增 TwinklingRefreshLayout

<?xml version="1.0" encoding="utf-8"?>
<com.lcodecore.tkrefreshlayout.TwinklingRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/refreshLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:tr_head_height="100dp">

   <ListView
       android:id="@+id/list"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content">

   </ListView>

</com.lcodecore.tkrefreshlayout.TwinklingRefreshLayout>

 3.在Activity或者Fragment中配置

TwinklingRefreshLayout不會自動結束重新整理或者載入更多,需要手動控制

refreshLayout = (TwinklingRefreshLayout) findViewById(R.id.refreshLayout);
    //下拉重新整理頭部view設定
        SinaRefreshView headerView = new SinaRefreshView(this);
        headerView.setArrowResource(R.drawable.arrow);
        refreshLayout.setHeaderView(headerView);
    //上拉載入底部view設定
        LoadingView loadingView = new LoadingView(this);
        refreshLayout.setBottomView(loadingView);
    //下拉重新整理上拉載入事件監聽
        refreshLayout.setOnRefreshListener(new RefreshListenerAdapter(){
            @Override
            public void onRefresh(final TwinklingRefreshLayout refreshLayout) {
                new Handler().postDelayed(new Runnable() {
                    @Override
                    public void run() {
                        
                        refreshLayout.finishRefreshing();
                    }
                },2000);
            }

            @Override
            public void onLoadMore(final TwinklingRefreshLayout refreshLayout) {
                new Handler().postDelayed(new Runnable() {
                    @Override
                    public void run() {
                       
                        refreshLayout.finishLoadmore();
                    }
                },2000);
            }
        });

    }

finishRefreshing()方法結束重新整理,finishLoadmore()方法結束載入更多。此外OnRefreshListener還有其它方法,可以選擇需要的來重寫。

如果你想進入到介面的時候主動呼叫下重新整理,可以呼叫startRefresh()/startLoadmore()方法。(會自動執行RefreshListenerAdapter監聽事件中的onRefresh()/onLoadMore())

其他屬性

setWaveHeight、setHeaderHeight、setBottomHeight、setOverScrollHeight
setWaveHeight 設定頭部可拉伸的最大高度。
setHeaderHeight 頭部固定高度(在此高度上顯示重新整理狀態)
setBottomHeight 底部高度
setOverScrollHeight 設定最大的越界高度

setEnableRefresh、setEnableLoadmore
靈活的設定是否禁用上下拉。

setHeaderView(IHeaderView headerView)、setBottomView(IBottomView bottomView)
設定頭部/底部個性化重新整理效果,頭部需要實現IHeaderView,底部需要實現IBottomView。

setEnableOverScroll
是否允許越界回彈。

setOverScrollTopShow、setOverScrollBottomShow、setOverScrollRefreshShow
是否允許在越界的時候顯示重新整理控制元件,預設是允許的,也就是Fling越界的時候Header或Footer照常顯示,反之就是不顯示;可能有特殊的情況,重新整理控制元件會影響顯示體驗才設立了這個狀態。

setPureScrollModeOn()
開啟純淨的越界回彈模式,也就是所有重新整理相關的View都不顯示,只顯示越界回彈效果

setAutoLoadMore
是否在底部越界的時候自動切換到載入更多模式

addFixedExHeader
新增一個固定在頂部的Header(效果還需要優化)

startRefresh、startLoadMore、finishRefreshing、finishLoadmore、setFloatRefresh(boolean)
支援切換到像SwipeRefreshLayout一樣的懸浮重新整理模式了。

 拓展屬性

tr_max_head_height 頭部拉伸允許的最大高度
tr_head_height 頭部高度
tr_max_bottom_height 底部拉伸允許的最大高度
tr_bottom_height 底部高度
tr_overscroll_height 允許越界的最大高度
tr_enable_refresh 是否允許重新整理,預設為true
tr_enable_loadmore 是否允許載入更多,預設為true
tr_pureScrollMode_on 是否開啟純淨的越界回彈模式
tr_overscroll_top_show - 否允許頂部越界時顯示頂部View
tr_overscroll_bottom_show 是否允許底部越界時顯示底部View
tr_enable_overscroll 是否允許越界回彈
tr_floatRefresh 開啟懸浮重新整理模式
tr_autoLoadMore 越界時自動載入更多
tr_enable_keepIView 是否在開始重新整理之後保持狀態,預設為true;若需要保持原來的操作邏輯,這裡設定為false即可
tr_showRefreshingWhenOverScroll 越界時直接顯示正在重新整理中的頭部
tr_showLoadingWhenOverScroll 越界時直接顯示正在載入更多中的底部

 adapter介面卡

//listview介面卡
    class myListAdapter extends BaseAdapter{

        private List<Student> lists;
        private LayoutInflater inflater;
        public myListAdapter() {}
        public myListAdapter(List<Student> lists,Context context) {
            this.lists = lists;
            this.inflater=LayoutInflater.from(context);
        }
        @Override
        public int getCount() {
            return lists==null?0:lists.size();
        }

        @Override
        public Object getItem(int position) {
            return lists.get(position);
        }

        @Override
        public long getItemId(int position) {
            return position;
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            //載入佈局為一個檢視
            View view=inflater.inflate(R.layout.list_item,null);
            Student lst= (Student) getItem(position);
            TextView txt=view.findViewById(R.id.txt);
            txt.setText(lst.getStuName());
            return view;
        }
    }

上拉重新整理和下拉載入方法

  //上拉重新整理資料
    private void Data1(){
        for (int i=0;i<=5;i++){
           Student stu=new Student();
            stu.setStuName("上拉資料:  張三"+i);
            list.add(stu);
        }
        adapter=new myListAdapter(list,MainActivity.this);
        listview.setAdapter(adapter);
    }


//下拉載入資料
    private void Data2(){
        for (int i=0;i<=5;i++){
            Student stu=new Student();
            stu.setStuName("下拉資料:  李四"+i);
            list.add(stu);
        }
        adapter=new myListAdapter(list,MainActivity.this);
        listview.setAdapter(adapter);
    }

基本上就這些了,我的部落格地址希望大家多多支援,謝謝大家。