【轉】Android 帶你從源碼的角度解析Scroller的滾動實現原理

時間 2019-11-11

標籤 android 源碼角度解析 scroller 滾動實現原理欄目 Android 简体版

原文原文鏈接

轉帖請註明本文出自xiaanming的博客（http://blog.csdn.net/xiaanming/article/details/17483273），請尊重他人的辛勤勞動成果，謝謝！android

今天給你們講解的是Scroller類的滾動實現原理，可能不少朋友不太瞭解該類是用來幹嗎的，可是研究Launcher的朋友應該對他很熟悉，Scroller類是滾動的一個封裝類，能夠實現View的平滑滾動效果，什麼是實現View的平滑滾動效果呢，舉個簡單的例子，一個View從在咱們指定的時間內從一個位置滾動到另一個位置，咱們利用Scroller類能夠實現勻速滾動，能夠先加速後減速，能夠先減速後加速等等效果，而不是瞬間的移動的效果，因此Scroller能夠幫咱們實現不少滑動的效果。canvas

在介紹Scroller類以前，咱們先去了解View的scrollBy() 和scrollTo()方法的區別，在區分這兩個方法的以前，咱們要先理解View 裏面的兩個成員變量mScrollX， mScrollY，X軸方向的偏移量和Y軸方向的偏移量，這個是一個相對距離，相對的不是屏幕的原點，而是View的左邊緣，舉個通俗易懂的例子，一列火車從吉安到深圳，途中通過贛州，那麼原點就是贛州，偏移量就是負的吉安到贛州的距離，你們從getScrollX()方法中的註釋中就能看出答案來app

 1  /**
 2      * Return the scrolled left position of this view. This is the left edge of
 3      * the displayed part of your view. You do not need to draw any pixels
 4      * farther left, since those are outside of the frame of your view on
 5      * screen.
 6      *
 7      * @return The left edge of the displayed part of your view, in pixels.
 8      */
 9     public final int getScrollX() {
10         return mScrollX;
11     }

如今咱們知道了向右滑動 mScrollX就爲負數，向左滑動mScrollX爲正數，接下來咱們先來看看 scrollTo()方法的源碼ide

 1   /**
 2      * Set the scrolled position of your view. This will cause a call to
 3      * {@link #onScrollChanged(int, int, int, int)} and the view will be
 4      * invalidated.
 5      * @param x the x position to scroll to
 6      * @param y the y position to scroll to
 7      */
 8     public void scrollTo(int x, int y) {
 9         if (mScrollX != x || mScrollY != y) {
10             int oldX = mScrollX;
11             int oldY = mScrollY;
12             mScrollX = x;
13             mScrollY = y;
14             onScrollChanged(mScrollX, mScrollY, oldX, oldY);
15             if (!awakenScrollBars()) {
16                 invalidate();
17             }
18         }
19     }

從該方法中咱們能夠看出，先判斷傳進來的(x, y)值是否和View的X, Y偏移量相等，若是不相等，就調用onScrollChanged()方法來通知界面發生改變，而後重繪界面，因此這樣子就實現了移動效果啦，如今咱們知道了scrollTo()方法是滾動到(x, y)這個偏移量的點，他是相對於View的開始位置來滾動的。在看看scrollBy()這個方法的代碼post

 1  /**
 2      * Move the scrolled position of your view. This will cause a call to
 3      * {@link #onScrollChanged(int, int, int, int)} and the view will be
 4      * invalidated.
 5      * @param x the amount of pixels to scroll by horizontally
 6      * @param y the amount of pixels to scroll by vertically
 7      */
 8     public void scrollBy(int x, int y) {
 9         scrollTo(mScrollX + x, mScrollY + y);
10     }

原來他裏面調用了scrollTo()方法，那就好辦了，他就是相對於View上一個位置根據(x, y)來進行滾動，可能你們腦海中對這兩個方法還有點模糊，不要緊，仍是舉個通俗的例子幫你們理解下，假如一個View,調用兩次scrollTo(-10, 0)，第一次向右滾動10，第二次就不滾動了，由於mScrollX和x相等了，當咱們調用兩次scrollBy(-10, 0),第一次向右滾動10，第二次再向右滾動10，他是相對View的上一個位置來滾動的。動畫

對於scrollTo()和scrollBy()方法還有一點須要注意，這點也很重要，假如你給一個LinearLayout調用scrollTo()方法，並非LinearLayout滾動，而是LinearLayout裏面的內容進行滾動，好比你想對一個按鈕進行滾動，直接用Button調用scrollTo()必定達不到你的需求，你們能夠試一試，若是真要對某個按鈕進行scrollTo()滾動的話，咱們能夠在Button外面包裹一層Layout，而後對Layout調用scrollTo()方法。ui

瞭解了scrollTo()和scrollBy()方法以後咱們就瞭解下Scroller類了，先看其構造方法this

 1     /**
 2      * Create a Scroller with the default duration and interpolator.
 3      */
 4     public Scroller(Context context) {
 5         this(context, null);
 6     }
 7 
 8     /**
 9      * Create a Scroller with the specified interpolator. If the interpolator is
10      * null, the default (viscous) interpolator will be used.
11      */
12     public Scroller(Context context, Interpolator interpolator) {
13         mFinished = true;
14         mInterpolator = interpolator;
15         float ppi = context.getResources().getDisplayMetrics().density * 160.0f;
16         mDeceleration = SensorManager.GRAVITY_EARTH   // g (m/s^2)
17                       * 39.37f                        // inch/meter
18                       * ppi                           // pixels per inch
19                       * ViewConfiguration.getScrollFriction();
20     }

只有兩個構造方法，第一個只有一個Context參數，第二個構造方法中指定了Interpolator，什麼Interpolator呢？中文意思插補器，瞭解Android動畫的朋友都應該熟悉
Interpolator，他指定了動畫的變化率，好比說勻速變化，先加速後減速，正弦變化等等，不一樣的Interpolator能夠作出不一樣的效果出來，第一個使用默認的Interpolator(viscous) spa

接下來咱們就要在Scroller類裏面找滾動的方法，咱們從名字上面能夠看出startScroll()應該是個滾動的方法，咱們來看看其源碼吧.net

 1     public void startScroll(int startX, int startY, int dx, int dy, int duration) {
 2         mMode = SCROLL_MODE;
 3         mFinished = false;
 4         mDuration = duration;
 5         mStartTime = AnimationUtils.currentAnimationTimeMillis();
 6         mStartX = startX;
 7         mStartY = startY;
 8         mFinalX = startX + dx;
 9         mFinalY = startY + dy;
10         mDeltaX = dx;
11         mDeltaY = dy;
12         mDurationReciprocal = 1.0f / (float) mDuration;
13         // This controls the viscous fluid effect (how much of it)
14         mViscousFluidScale = 8.0f;
15         // must be set to 1.0 (used in viscousFluid())
16         mViscousFluidNormalize = 1.0f;
17         mViscousFluidNormalize = 1.0f / viscousFluid(1.0f);
18     }

在這個方法中咱們只看到了對一些滾動的基本設置動做，好比設置滾動模式，開始時間，持續時間等等，並無任何對View的滾動操做，也許你正納悶，不是滾動的方法幹嗎還叫作startScroll(),稍安勿躁，既然叫開始滾動，那就是對滾動的滾動以前的基本設置咯。

 1     /**
 2      * Call this when you want to know the new location.  If it returns true,
 3      * the animation is not yet finished.  loc will be altered to provide the
 4      * new location.
 5      */ 
 6     public boolean computeScrollOffset() {
 7         if (mFinished) {
 8             return false;
 9         }
10 
11         int timePassed = (int)(AnimationUtils.currentAnimationTimeMillis() - mStartTime);
12     
13         if (timePassed < mDuration) {
14             switch (mMode) {
15             case SCROLL_MODE:
16                 float x = (float)timePassed * mDurationReciprocal;
17     
18                 if (mInterpolator == null)
19                     x = viscousFluid(x); 
20                 else
21                     x = mInterpolator.getInterpolation(x);
22     
23                 mCurrX = mStartX + Math.round(x * mDeltaX);
24                 mCurrY = mStartY + Math.round(x * mDeltaY);
25                 break;
26             case FLING_MODE:
27                 float timePassedSeconds = timePassed / 1000.0f;
28                 float distance = (mVelocity * timePassedSeconds)
29                         - (mDeceleration * timePassedSeconds * timePassedSeconds / 2.0f);
30                 
31                 mCurrX = mStartX + Math.round(distance * mCoeffX);
32                 // Pin to mMinX <= mCurrX <= mMaxX
33                 mCurrX = Math.min(mCurrX, mMaxX);
34                 mCurrX = Math.max(mCurrX, mMinX);
35                 
36                 mCurrY = mStartY + Math.round(distance * mCoeffY);
37                 // Pin to mMinY <= mCurrY <= mMaxY
38                 mCurrY = Math.min(mCurrY, mMaxY);
39                 mCurrY = Math.max(mCurrY, mMinY);
40                 
41                 break;
42             }
43         }
44         else {
45             mCurrX = mFinalX;
46             mCurrY = mFinalY;
47             mFinished = true;
48         }
49         return true;
50     }

咱們在startScroll()方法的時候獲取了當前的動畫毫秒賦值給了mStartTime，在computeScrollOffset()中再一次調用AnimationUtils.currentAnimationTimeMillis()來獲取動畫
毫秒減去mStartTime就是持續時間了，而後進去if判斷，若是動畫持續時間小於咱們設置的滾動持續時間mDuration，進去switch的SCROLL_MODE，而後根據Interpolator來計算出在該時間段裏面移動的距離，賦值給mCurrX， mCurrY，因此該方法的做用是，計算在0到mDuration時間段內滾動的偏移量，而且判斷滾動是否結束，true表明還沒結束，false則表示滾動介紹了，Scroller類的其餘的方法我就不提了，大都是一些get(), set()方法。

看了這麼多，到底要怎麼才能觸發滾動，你內心確定有不少疑惑，在說滾動以前我要先提另一個方法computeScroll()，該方法是滑動的控制方法，在繪製View時，會在draw()過程調用該方法。咱們先看看computeScroll()的源碼

1  /**
2      * Called by a parent to request that a child update its values for mScrollX
3      * and mScrollY if necessary. This will typically be done if the child is
4      * animating a scroll using a {@link android.widget.Scroller Scroller}
5      * object.
6      */
7     public void computeScroll() {
8     }

沒錯，他是一個空的方法，須要子類去重寫該方法來實現邏輯，到底該方法在哪裏被觸發呢。咱們繼續看看View的繪製方法draw()

 1  public void draw(Canvas canvas) {
 2         final int privateFlags = mPrivateFlags;
 3         final boolean dirtyOpaque = (privateFlags & PFLAG_DIRTY_MASK) == PFLAG_DIRTY_OPAQUE &&
 4                 (mAttachInfo == null || !mAttachInfo.mIgnoreDirtyState);
 5         mPrivateFlags = (privateFlags & ~PFLAG_DIRTY_MASK) | PFLAG_DRAWN;
 6 
 7         /*
 8          * Draw traversal performs several drawing steps which must be executed
 9          * in the appropriate order:
10          *
11          *      1. Draw the background
12          *      2. If necessary, save the canvas' layers to prepare for fading
13          *      3. Draw view's content
14          *      4. Draw children
15          *      5. If necessary, draw the fading edges and restore layers
16          *      6. Draw decorations (scrollbars for instance)
17          */
18 
19         // Step 1, draw the background, if needed
20         int saveCount;
21 
22         if (!dirtyOpaque) {
23             final Drawable background = mBackground;
24             if (background != null) {
25                 final int scrollX = mScrollX;
26                 final int scrollY = mScrollY;
27 
28                 if (mBackgroundSizeChanged) {
29                     background.setBounds(0, 0,  mRight - mLeft, mBottom - mTop);
30                     mBackgroundSizeChanged = false;
31                 }
32 
33                 if ((scrollX | scrollY) == 0) {
34                     background.draw(canvas);
35                 } else {
36                     canvas.translate(scrollX, scrollY);
37                     background.draw(canvas);
38                     canvas.translate(-scrollX, -scrollY);
39                 }
40             }
41         }
42 
43         // skip step 2 & 5 if possible (common case)
44         final int viewFlags = mViewFlags;
45         boolean horizontalEdges = (viewFlags & FADING_EDGE_HORIZONTAL) != 0;
46         boolean verticalEdges = (viewFlags & FADING_EDGE_VERTICAL) != 0;
47         if (!verticalEdges && !horizontalEdges) {
48             // Step 3, draw the content
49             if (!dirtyOpaque) onDraw(canvas);
50 
51             // Step 4, draw the children
52             dispatchDraw(canvas);
53 
54             // Step 6, draw decorations (scrollbars)
55             onDrawScrollBars(canvas);
56 
57             // we're done...
58             return;
59         }
60 
61         ......
62         ......
63         ......

咱們只截取了draw()的部分代碼，這上面11-16行爲咱們寫出了繪製一個View的幾個步驟，咱們看看第四步繪製孩子的時候會觸發dispatchDraw()這個方法，來看看源碼是什麼內容

1  /**
2      * Called by draw to draw the child views. This may be overridden
3      * by derived classes to gain control just before its children are drawn
4      * (but after its own view has been drawn).
5      * @param canvas the canvas on which to draw the view
6      */
7     protected void dispatchDraw(Canvas canvas) {
8 
9     }

好吧，又是定義的一個空方法，給子類來重寫的方法,因此咱們找到View的子類ViewGroup來看看該方法的具體實現邏輯

  1     @Override
  2     protected void dispatchDraw(Canvas canvas) {
  3         final int count = mChildrenCount;
  4         final View[] children = mChildren;
  5         int flags = mGroupFlags;
  6 
  7         if ((flags & FLAG_RUN_ANIMATION) != 0 && canAnimate()) {
  8             final boolean cache = (mGroupFlags & FLAG_ANIMATION_CACHE) == FLAG_ANIMATION_CACHE;
  9 
 10             final boolean buildCache = !isHardwareAccelerated();
 11             for (int i = 0; i < count; i++) {
 12                 final View child = children[i];
 13                 if ((child.mViewFlags & VISIBILITY_MASK) == VISIBLE) {
 14                     final LayoutParams params = child.getLayoutParams();
 15                     attachLayoutAnimationParameters(child, params, i, count);
 16                     bindLayoutAnimation(child);
 17                     if (cache) {
 18                         child.setDrawingCacheEnabled(true);
 19                         if (buildCache) {                        
 20                             child.buildDrawingCache(true);
 21                         }
 22                     }
 23                 }
 24             }
 25 
 26             final LayoutAnimationController controller = mLayoutAnimationController;
 27             if (controller.willOverlap()) {
 28                 mGroupFlags |= FLAG_OPTIMIZE_INVALIDATE;
 29             }
 30 
 31             controller.start();
 32 
 33             mGroupFlags &= ~FLAG_RUN_ANIMATION;
 34             mGroupFlags &= ~FLAG_ANIMATION_DONE;
 35 
 36             if (cache) {
 37                 mGroupFlags |= FLAG_CHILDREN_DRAWN_WITH_CACHE;
 38             }
 39 
 40             if (mAnimationListener != null) {
 41                 mAnimationListener.onAnimationStart(controller.getAnimation());
 42             }
 43         }
 44 
 45         int saveCount = 0;
 46         final boolean clipToPadding = (flags & CLIP_TO_PADDING_MASK) == CLIP_TO_PADDING_MASK;
 47         if (clipToPadding) {
 48             saveCount = canvas.save();
 49             canvas.clipRect(mScrollX + mPaddingLeft, mScrollY + mPaddingTop,
 50                     mScrollX + mRight - mLeft - mPaddingRight,
 51                     mScrollY + mBottom - mTop - mPaddingBottom);
 52 
 53         }
 54 
 55         // We will draw our child's animation, let's reset the flag
 56         mPrivateFlags &= ~PFLAG_DRAW_ANIMATION;
 57         mGroupFlags &= ~FLAG_INVALIDATE_REQUIRED;
 58 
 59         boolean more = false;
 60         final long drawingTime = getDrawingTime();
 61 
 62         if ((flags & FLAG_USE_CHILD_DRAWING_ORDER) == 0) {
 63             for (int i = 0; i < count; i++) {
 64                 final View child = children[i];
 65                 if ((child.mViewFlags & VISIBILITY_MASK) == VISIBLE || child.getAnimation() != null) {
 66                     more |= drawChild(canvas, child, drawingTime);
 67                 }
 68             }
 69         } else {
 70             for (int i = 0; i < count; i++) {
 71                 final View child = children[getChildDrawingOrder(count, i)];
 72                 if ((child.mViewFlags & VISIBILITY_MASK) == VISIBLE || child.getAnimation() != null) {
 73                     more |= drawChild(canvas, child, drawingTime);
 74                 }
 75             }
 76         }
 77 
 78         // Draw any disappearing views that have animations
 79         if (mDisappearingChildren != null) {
 80             final ArrayList<View> disappearingChildren = mDisappearingChildren;
 81             final int disappearingCount = disappearingChildren.size() - 1;
 82             // Go backwards -- we may delete as animations finish
 83             for (int i = disappearingCount; i >= 0; i--) {
 84                 final View child = disappearingChildren.get(i);
 85                 more |= drawChild(canvas, child, drawingTime);
 86             }
 87         }
 88 
 89         if (debugDraw()) {
 90             onDebugDraw(canvas);
 91         }
 92 
 93         if (clipToPadding) {
 94             canvas.restoreToCount(saveCount);
 95         }
 96 
 97         // mGroupFlags might have been updated by drawChild()
 98         flags = mGroupFlags;
 99 
100         if ((flags & FLAG_INVALIDATE_REQUIRED) == FLAG_INVALIDATE_REQUIRED) {
101             invalidate(true);
102         }
103 
104         if ((flags & FLAG_ANIMATION_DONE) == 0 && (flags & FLAG_NOTIFY_ANIMATION_LISTENER) == 0 &&
105                 mLayoutAnimationController.isDone() && !more) {
106             // We want to erase the drawing cache and notify the listener after the
107             // next frame is drawn because one extra invalidate() is caused by
108             // drawChild() after the animation is over
109             mGroupFlags |= FLAG_NOTIFY_ANIMATION_LISTENER;
110             final Runnable end = new Runnable() {
111                public void run() {
112                    notifyAnimationListener();
113                }
114             };
115             post(end);
116         }
117     }

這個方法代碼有點多，可是咱們仍是挑重點看吧，從65-79行能夠看出在dispatchDraw()裏面會對ViewGroup裏面的子View調用drawChild()來進行繪製，接下來咱們來看看drawChild()方法的代碼

 1  protected boolean drawChild(Canvas canvas, View child, long drawingTime) {
 2     ......
 3     ......
 4 
 5     if (!concatMatrix && canvas.quickReject(cl, ct, cr, cb, Canvas.EdgeType.BW) &&
 6                 (child.mPrivateFlags & DRAW_ANIMATION) == 0) {
 7             return more;
 8         }
 9 
10         child.computeScroll();
11 
12         final int sx = child.mScrollX;
13         final int sy = child.mScrollY;
14 
15         boolean scalingRequired = false;
16         Bitmap cache = null;
17 
18     ......
19     ......
20 
21 }

只截取了部分代碼，看到child.computeScroll()你大概明白什麼了吧，轉了老半天終於找到了computeScroll()方法被觸發，就是ViewGroup在分發繪製本身的孩子的時候，會對其子View調用computeScroll()方法

整理下思路，來看看View滾動的實現原理，咱們先調用Scroller的startScroll()方法來進行一些滾動的初始化設置，而後迫使View進行繪製，咱們調用View的invalidate()或postInvalidate()就能夠從新繪製View，繪製View的時候會觸發computeScroll()方法，咱們重寫computeScroll()，在computeScroll()裏面先調用Scroller的computeScrollOffset()方法來判斷滾動有沒有結束，若是滾動沒有結束咱們就調用scrollTo()方法來進行滾動，該scrollTo()方法雖然會從新繪製View,可是咱們仍是要手動調用下invalidate()或者postInvalidate()來觸發界面重繪，從新繪製View又觸發computeScroll()，因此就進入一個循環階段，這樣子就實現了在某個時間段裏面滾動某段距離的一個平滑的滾動效果
也許有人會問，幹嗎還要調用來調用去最後在調用scrollTo()方法，還不如直接調用scrollTo()方法來實現滾動，其實直接調用是能夠，只不過scrollTo()是瞬間滾動的，給人的用戶體驗不太好，因此Android提供了Scroller類實現平滑滾動的效果。爲了方面你們理解，我畫了一個簡單的調用示意圖

好了，講到這裏就已經講完了Scroller類的滾動實現原理啦，不知道你們理解了沒有，Scroller能實現不少滾動的效果，因爲考慮到這篇文章的篇幅有點長，因此這篇文章就不帶領你們來使用Scroller類了，我將在下一篇文章將會帶來Scroller類的使用，但願你們到時候關注下，有疑問的同窗在下面留言，我會爲你們解答的！