Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> 關於Android編程 >> [Android]下拉刷新控件RefreshableView的實現

[Android]下拉刷新控件RefreshableView的實現

編輯:關於Android編程

我們的目的是不管什麼控件,只要在xml中外面包一層標簽,那這個標簽下面的所有子標簽所在的控件都被支持可以下拉刷新了。所以,我們可以使用ViewGroup來實現,這裡我選擇的是繼承LinearLayout,當然其他的(FrameLayout等)也一樣了。   因為根據手指下滑,需要有一個刷新的view被顯示出來,所以這裡需要添加一個子view(稱為refreshHeaderView),並放置在最頂部,使用LinearLayout的好處是可以設置為VERTICAL,這樣可以直接“this.addView(refreshHeaderView, 0);”搞定了。然後就要根據手指滑動的距離,動態地去改變refreshHeaderView的高度。同時檢測是否到達了可以刷新的高度了,如果達到了,更新當前的刷新狀態。手指放開時,根據之前移動的刷新狀態,執行刷新或者回歸正常狀態。   RefreshableView代碼如下:       1 /**   2  * 下拉刷新控件   3  * Author: wangjie   4  * Email: [email protected]   5  * Date: 12/13/14.   6  */   7 public class RefreshableView extends LinearLayout {   8     private static final String TAG = RefreshableView.class.getSimpleName();   9   10     public RefreshableView(Context context) {  11         super(context);  12         init(context);  13     }  14   15     public RefreshableView(Context context, AttributeSet attrs) {  16         super(context, attrs);  17   18         TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.refreshableView);  19         for (int i = 0, len = a.length(); i < len; i++) {  20             int attrIndex = a.getIndex(i);  21             switch (attrIndex) {  22                 case R.styleable.refreshableView_interceptAllMoveEvents:  23                     interceptAllMoveEvents = a.getBoolean(i, false);  24                     break;  25             }  26         }  27         a.recycle();  28   29         init(context);  30     }  31   32     public RefreshableView(Context context, AttributeSet attrs, int defStyle) {  33         super(context, attrs, defStyle);  34         init(context);  35     }  36   37     /**  38      * 刷新狀態  39      */  40     public static final int STATE_REFRESH_NORMAL = 0x21;  41     public static final int STATE_REFRESH_NOT_ARRIVED = 0x22;  42     public static final int STATE_REFRESH_ARRIVED = 0x23;  43     public static final int STATE_REFRESHING = 0x24;  44     private int refreshState;  45     // 刷新狀態監聽  46     private RefreshableHelper refreshableHelper;  47   48     public void setRefreshableHelper(RefreshableHelper refreshableHelper) {  49         this.refreshableHelper = refreshableHelper;  50     }  51   52     private Context context;  53     /**  54      * 刷新的view  55      */  56     private View refreshHeaderView;  57     /**  58      * 刷新的view的真實高度  59      */  60     private int originRefreshHeight;  61     /**  62      * 有效下拉刷新需要達到的高度  63      */  64     private int refreshArrivedStateHeight;  65     /**  66      * 刷新時顯示的高度  67      */  68     private int refreshingHeight;  69     /**  70      * 正常未刷新高度  71      */  72     private int refreshNormalHeight;  73   74   75     /**  76      * 默認不允許攔截(即,往子view傳遞事件),該屬性只有在interceptAllMoveEvents為false的時候才有效  77      */  78     private boolean disallowIntercept = true;  79     /**  80      * xml中可設置它的值為false,表示不把移動的事件傳遞給子控件  81      */  82     private boolean interceptAllMoveEvents;  83   84     private void init(Context context) {  85         this.context = context;  86         this.setOrientation(VERTICAL);  87   88 //        Log.d(TAG, "[init]originRefreshHeight: " + refreshHeaderView.getMeasuredHeight());  89     }  90   91     @Override  92     protected void onSizeChanged(int w, int h, int oldw, int oldh) {  93         super.onSizeChanged(w, h, oldw, oldh);  94   95         if (null != refreshableHelper) {  96             refreshHeaderView = refreshableHelper.onInitRefreshHeaderView();  97         }  98 //        refreshHeaderView = LayoutInflater.from(context).inflate(R.layout.refresh_head, null);  99         if (null == refreshHeaderView) { 100             Log.e(TAG, "refreshHeaderView is null!"); 101             return; 102         } 103         this.removeView(refreshHeaderView); 104         this.addView(refreshHeaderView, 0); 105  106         // 計算refreshHeadView尺寸 107         int width = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED); 108         int expandSpec = View.MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2, View.MeasureSpec.AT_MOST); 109         refreshHeaderView.measure(width, expandSpec); 110  111         Log.d(TAG, "[onSizeChanged]w: " + w + ", h: " + h); 112         Log.d(TAG, "[onSizeChanged]oldw: " + oldw + ", oldh: " + oldh); 113         Log.d(TAG, "[onSizeChanged]child counts: " + this.getChildCount()); 114         originRefreshHeight = refreshHeaderView.getMeasuredHeight(); 115  116         boolean isUseDefault = true; 117         if (null != refreshableHelper) { 118             isUseDefault = refreshableHelper.onInitRefreshHeight(originRefreshHeight); 119         } 120  121         // 初始化各個高度 122         if (isUseDefault) { 123             refreshArrivedStateHeight = originRefreshHeight; 124             refreshingHeight = originRefreshHeight; 125             refreshNormalHeight = 0; 126         } 127         Log.d(TAG, "[onSizeChanged]refreshHeaderView origin height: " + originRefreshHeight); 128         changeViewHeight(refreshHeaderView, refreshNormalHeight); 129  130         // 初始化為正常狀態 131         setRefreshState(STATE_REFRESH_NORMAL); 132  133     } 134  135     @Override 136     public boolean dispatchTouchEvent(MotionEvent ev) { 137         Log.d(TAG, "[dispatchTouchEvent]ev action: " + ev.getAction()); 138         return super.dispatchTouchEvent(ev); 139     } 140  141     @Override 142     public boolean onInterceptTouchEvent(MotionEvent ev) { 143         Log.d(TAG, "[onInterceptTouchEvent]ev action: " + ev.getAction()); 144         if (!interceptAllMoveEvents) { 145             return !disallowIntercept; 146         } 147         // 如果設置了攔截所有move事件,即interceptAllMoveEvents為true 148         if (MotionEvent.ACTION_MOVE == ev.getAction()) { 149             return true; 150         } 151         return false; 152     } 153  154     @Override 155     public void requestDisallowInterceptTouchEvent(boolean disallowIntercept) { 156         if (this.disallowIntercept == disallowIntercept) { 157             return; 158         } 159         this.disallowIntercept = disallowIntercept; 160         super.requestDisallowInterceptTouchEvent(disallowIntercept); 161     } 162  163     private float downY = Float.MAX_VALUE; 164  165     @Override 166     public boolean onTouchEvent(MotionEvent event) { 167 //        super.onTouchEvent(event); 168         Log.d(TAG, "[onTouchEvent]ev action: " + event.getAction()); 169         switch (event.getAction()) { 170             case MotionEvent.ACTION_DOWN: 171                 downY = event.getY(); 172                 Log.d(TAG, "Down --> downY: " + downY); 173                 requestDisallowInterceptTouchEvent(true); // 保證事件可往下傳遞 174                 break; 175             case MotionEvent.ACTION_MOVE: 176  177                 float curY = event.getY(); 178                 float deltaY = curY - downY; 179                 // 是否是有效的往下拖動事件(則需要顯示加載header) 180                 boolean isDropDownValidate = Float.MAX_VALUE != downY; 181                 /** 182                  * 修改攔截設置 183                  * 如果是有效往下拖動事件,則事件需要在本ViewGroup中處理,所以需要攔截不往子控件傳遞,即不允許攔截設為false 184                  * 如果是有效往下拖動事件,則事件傳遞給子控件處理,所以不需要攔截,並往子控件傳遞,即不允許攔截設為true 185                  */ 186                 requestDisallowInterceptTouchEvent(!isDropDownValidate); 187  188                 downY = curY; 189                 Log.d(TAG, "Move --> deltaY(curY - downY): " + deltaY); 190                 int curHeight = refreshHeaderView.getMeasuredHeight(); 191                 int exceptHeight = curHeight + (int) (deltaY / 2); 192  193                 // 如果當前沒有處在正在刷新狀態,則更新刷新狀態 194                 if (STATE_REFRESHING != refreshState) { 195                     if (curHeight >= refreshArrivedStateHeight) { // 達到可刷新狀態 196                         setRefreshState(STATE_REFRESH_ARRIVED); 197                     } else { // 未達到可刷新狀態 198                         setRefreshState(STATE_REFRESH_NOT_ARRIVED); 199                     } 200                 } 201                 if (isDropDownValidate) { 202                     changeViewHeight(refreshHeaderView, Math.max(refreshNormalHeight, exceptHeight)); 203                 } else { // 防止從子控件修改攔截後引發的downY為Float.MAX_VALUE的問題 204                     changeViewHeight(refreshHeaderView, Math.max(curHeight, exceptHeight)); 205                 } 206  207                 break; 208             case MotionEvent.ACTION_UP: 209                 downY = Float.MAX_VALUE; 210                 Log.d(TAG, "Up --> downY: " + downY); 211                 requestDisallowInterceptTouchEvent(true); // 保證事件可往下傳遞 212                 // 如果是達到刷新狀態,則設置正在刷新狀態的高度 213                 if (STATE_REFRESH_ARRIVED == refreshState) { // 達到了刷新的狀態 214                     startHeightAnimation(refreshHeaderView, refreshHeaderView.getMeasuredHeight(), refreshingHeight); 215                     setRefreshState(STATE_REFRESHING); 216                 } else if (STATE_REFRESHING == refreshState) { // 正在刷新的狀態 217                     startHeightAnimation(refreshHeaderView, refreshHeaderView.getMeasuredHeight(), refreshingHeight); 218                 } else { 219                     // 執行動畫後回歸正常狀態 220                     startHeightAnimation(refreshHeaderView, refreshHeaderView.getMeasuredHeight(), refreshNormalHeight, normalAnimatorListener); 221                 } 222  223                 break; 224             case MotionEvent.ACTION_CANCEL: 225                 Log.d(TAG, "cancel"); 226                 break; 227         } 228         return true; 229     } 230  231     /** 232      * 刷新完畢後調用此方法 233      */ 234     public void onCompleteRefresh() { 235         if (STATE_REFRESHING == refreshState) { 236             setRefreshState(STATE_REFRESH_NORMAL); 237             startHeightAnimation(refreshHeaderView, refreshHeaderView.getMeasuredHeight(), refreshNormalHeight); 238         } 239     } 240  241     /** 242      * 修改當前的刷新狀態 243      * 244      * @param expectRefreshState 245      */ 246     private void setRefreshState(int expectRefreshState) { 247         if (expectRefreshState != refreshState) { 248             refreshState = expectRefreshState; 249             if (null != refreshableHelper) { 250                 refreshableHelper.onRefreshStateChanged(refreshHeaderView, refreshState); 251             } 252         } 253     } 254  255  256     /** 257      * 改變某控件的高度 258      * 259      * @param view 260      * @param height 261      */ 262     private void changeViewHeight(View view, int height) { 263         Log.d(TAG, "[changeViewHeight]change Height: " + height); 264         ViewGroup.LayoutParams lp = view.getLayoutParams(); 265         lp.height = height; 266         view.setLayoutParams(lp); 267     } 268  269     /** 270      * 改變某控件的高度動畫 271      * 272      * @param view 273      * @param fromHeight 274      * @param toHeight 275      */ 276     private void startHeightAnimation(final View view, int fromHeight, int toHeight) { 277         startHeightAnimation(view, fromHeight, toHeight, null); 278     } 279  280     private void startHeightAnimation(final View view, int fromHeight, int toHeight, Animator.AnimatorListener animatorListener) { 281         if (toHeight == view.getMeasuredHeight()) { 282             return; 283         } 284         ValueAnimator heightAnimator = ValueAnimator.ofInt(fromHeight, toHeight); 285         heightAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { 286             @Override 287             public void onAnimationUpdate(ValueAnimator valueAnimator) { 288                 Integer value = (Integer) valueAnimator.getAnimatedValue(); 289                 if (null == value) return; 290                 changeViewHeight(view, value); 291             } 292         }); 293         if (null != animatorListener) { 294             heightAnimator.addListener(animatorListener); 295         } 296         heightAnimator.setInterpolator(new LinearInterpolator()); 297         heightAnimator.setDuration(300/*ms*/); 298         heightAnimator.start(); 299     } 300  301     AnimatorListenerAdapter normalAnimatorListener = new AnimatorListenerAdapter() { 302         @Override 303         public void onAnimationEnd(Animator animation) { 304             super.onAnimationEnd(animation); 305             setRefreshState(STATE_REFRESH_NORMAL); // 回歸正常狀態 306         } 307     }; 308  309     public void setRefreshArrivedStateHeight(int refreshArrivedStateHeight) { 310         this.refreshArrivedStateHeight = refreshArrivedStateHeight; 311     } 312  313     public void setRefreshingHeight(int refreshingHeight) { 314         this.refreshingHeight = refreshingHeight; 315     } 316  317     public void setRefreshNormalHeight(int refreshNormalHeight) { 318         this.refreshNormalHeight = refreshNormalHeight; 319     } 320  321     public int getOriginRefreshHeight() { 322         return originRefreshHeight; 323     }     originRefreshHeight,表示頭部刷新view的實際高度。   refreshArrivedStateHeight,表示下拉多少距離可以執行刷新了   refreshingHeight,表示刷新的時候顯示的高度時多少   refreshNormalHeight,表示正常狀態下refreshHeaderView顯示的高度是多少       主要的核心代碼應該是在onTouchEvent方法中,   先簡單分析裡面的主要代碼:在ACTION_DOWN的時候,紀錄當前手指下落的y坐標,然後再ACTION_MOVE的時候,去計算滑動的距離,並且判斷如果滑動的距離大於refreshArrivedStateHeight,更新處於已經達到可刷新的狀態,反之就更新處於未達到可刷新的狀態。然後再ACTION_UP中,如果已經達到了可刷新的狀態,則更新當前狀態為正在刷新狀態,並且回調狀態改變的方法。       如果裡面有ScrollView等可以滾動的控件的時候,應該怎麼處理裡面的事件呢?     xml布局如下:      1 <com.wangjie.refreshableview.RefreshableView  2             xmlns:rv="http://schemas.android.com/apk/res/com.wangjie.refreshableview"  3             android:id="@+id/main_refresh_view"  4             android:layout_width="match_parent"  5             android:layout_height="match_parent"  6             rv:interceptAllMoveEvents="false"  7             >  8         <com.wangjie.refreshableview.NestScrollView android:layout_width="match_parent" android:layout_height="wrap_content"  9                 android:fillViewport="true" 10                 > 11  12             <TextView 13                     android:id="@+id/main_tv" 14                     android:layout_width="fill_parent" 15                     android:layout_height="wrap_content" 16                     android:gravity="center" 17                     android:padding="20dp" 18                     android:textSize="18sp" 19                     android:text="Drop Down For Refresh\n\n\n\n\n\n\n\n\n\n\nDrop Down For Refresh\nDrop Down For Refresh\n\n\n\n\n\n\n\n\n\n\nDrop Down For Refresh\nDrop Down For Refresh\n\n\n\n\n\n\n\n\n\n\nDrop Down For Refresh\nDrop Down For Refresh\n\n\n\n\n\n\n\n\n\n\nDrop Down For Refresh" 20                     /> 21  22         </com.wangjie.refreshableview.NestScrollView> 23     </com.wangjie.refreshableview.RefreshableView>   如上,最外面是一個RefreshableView,然後裡面是一個NestScrollView,NestScrollView裡面是TextView,其中TextView中因為文字較多,所以使用NestScrollView來實現滾動(NestScrollView擴展自ScrollView,下面會講到)。這個時候的邏輯應該是,當NestScrollView處於頂部的時候,手指向下滑動,這時這個touch事件應該交給RefreshableView處理;當手指向上滑動時,也就是ScrollView向下滾動,這時,需要把touch事件給RefreshableView來處理。       RefreshableView的interceptAllMoveEvents表示是否需要RefreshableView阻止所有MOVE的事件(也就是說由RefreshableView自己處理所有MOVE事件),如果自控件中沒有ScrollView等需要處理MOVE事件的控件,則可以設置為true;如果有類似ScrollView等控件,則需要設置為false,這樣的話,RefreshableView會把MOVE事件傳遞給子類,由子類去處理。顯然,現在例子中的情況是需要把interceptAllMoveEvents設置為false。設置的方法可以看上面的xml文件,使用rv:interceptAllMoveEvents="false"這個屬性即可。   onInterceptTouchEvent()方法中,我們返回的是disallowIntercept,這個disallowIntercept是根據requestDisallowInterceptTouchEvent()方法的調用來動態變化的,這樣可以做到切換touch事件的處理對象。   在手指落下的時候,先調用requestDisallowInterceptTouchEvent()方法,保證當前的事件可以正常往子控件傳遞,也就是現在的ScrollView。然後手指會開始移動,在ACTION_MOVE中,先計算出當前滑動的距離。   如果是有效往下拖動事件,則事件需要在RefreshableView中處理,所以需要攔截不往子控件傳遞,即不允許攔截設為false;如果不是有效往下拖動事件,則事件傳遞給子控件處理,所以不需要攔截,並往子控件傳遞,即不允許攔截設為true。   怎麼去判斷是否有效呢?根據downY,如果downY是原來的初始值Float.MAX_VALUE,說明,這個MOVE事件剛開始DOWN的時候是被子控件處理的,而不是RefreshableView處理的,說明對於RefreshableView來說,是一個無效的往下拖動事件;如果downY不是原來的初始值Float.MAX_VALUE,說明,這個MOVE事件在DOWN的時候就已經是RefreshableView處理的了,所以是有效的。   然後,計算refreshHeaderView的高度,根據滑動的差量對refreshHeaderView的高度進行變換。   如果當前的狀態是正在刷新,那MOVE事件直接無效。   否則,再去判斷當前的高度是不是達到了可刷新狀態,或者沒有達到可刷新狀態,更新狀態值。   在UP的時候,還是先保證事件往下傳遞。並重置downY。然後根據當前的狀態,如果達到了刷新的狀態,則開始刷新,並更新當前的額狀態時正在刷新狀態;如果沒有達到刷新狀態,則執行動畫返回到正常狀態;如果本來就是正在刷新狀態,也執行動畫回歸到正在刷新的高度。       然後分析下NestScrollView:      1 /**  2  * Author: wangjie  3  * Email: [email protected]  4  * Date: 12/13/14.  5  */  6 public class NestScrollView extends ScrollView {  7     private static final String TAG = NestScrollView.class.getSimpleName();  8   9     public NestScrollView(Context context) { 10         super(context); 11     } 12  13     public NestScrollView(Context context, AttributeSet attrs) { 14         super(context, attrs); 15     } 16  17     public NestScrollView(Context context, AttributeSet attrs, int defStyle) { 18         super(context, attrs, defStyle); 19     } 20  21     @Override 22     public boolean dispatchTouchEvent(MotionEvent ev) { 23         Log.d(TAG, "___[dispatchTouchEvent]ev action: " + ev.getAction()); 24         return super.dispatchTouchEvent(ev); 25     } 26  27     @Override 28     public boolean onInterceptTouchEvent(MotionEvent ev) { 29         super.onInterceptTouchEvent(ev); 30         Log.d(TAG, "___[onInterceptTouchEvent]ev action: " + ev.getAction()); 31         if (MotionEvent.ACTION_MOVE == ev.getAction()) { 32             return true; 33         } 34         return false; 35     } 36  37     float lastDownY; 38  39     @Override 40     public boolean onTouchEvent(MotionEvent event) { 41         super.onTouchEvent(event); 42         switch (event.getAction()) { 43             case MotionEvent.ACTION_DOWN: 44                 lastDownY = event.getY(); 45                 parentRequestDisallowInterceptTouchEvent(true); // 保證事件可往下傳遞 46                 Log.d(TAG, "___Down"); 47                 return true; 48 //                break; 49             case MotionEvent.ACTION_MOVE: 50                 Log.d(TAG, "___move, this.getScrollY(): " + this.getScrollY()); 51                 boolean isTop = event.getY() - lastDownY > 0 && this.getScrollY() == 0; 52                 if (isTop) { // 允許父控件攔截,即不允許父控件攔截設為false 53                     parentRequestDisallowInterceptTouchEvent(false); 54                     return false; 55                 } else { // 不允許父控件攔截,即不允許父控件攔截設為true 56                     parentRequestDisallowInterceptTouchEvent(true); 57                     return true; 58                 } 59 //                break; 60             case MotionEvent.ACTION_UP: 61                 Log.d(TAG, "___up, this.getScrollY(): " + this.getScrollY()); 62                 parentRequestDisallowInterceptTouchEvent(true); // 保證事件可往下傳遞 63                 break; 64             case MotionEvent.ACTION_CANCEL: 65                 Log.d(TAG, "___cancel"); 66                 break; 67         } 68         return false; 69     } 70  71     /** 72      * 是否允許父控件攔截事件 73      * @param disallowIntercept 74      */ 75     private void parentRequestDisallowInterceptTouchEvent(boolean disallowIntercept) { 76         ViewParent vp = getParent(); 77         if (null == vp) { 78             return; 79         } 80         vp.requestDisallowInterceptTouchEvent(disallowIntercept); 81     } 82  83 }   如上所示,也需要重寫onInterceptTouchEvent()方法,它需要把除了MOVE事件外的所有事件傳遞下去,這樣最裡面的TextView才有OnClick等事件。   在onTouchEvent方法中,在ACTION_DOWN的時候,先紀錄down的y坐標,然後保證parent(即,RefreshableView)的事件可以傳遞過來,所以需要調用getParent().requestDisallowInterceptTouchEvent()方法。因為下拉刷新只能發生在ScrollView滾動條在頂部的時候,所以在MOVE中,如果當前狀態在頂部,那就需要讓父控件(RefreshableView)攔截,然後直接返回false,讓當前的事件傳遞到RefreshableView中的onTouchEvent方法中處理。如果不是在top,那就屏蔽調用父控件(RefreshableView)的處理,直接自己處理。最後在UP的時候再確保事件可以傳遞到ScrollView這裡來。
  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved