Android中View的知识体系——（2）View的滑动

作者：黑衣侠客

一、前言

在Android设备上，滑动几乎是应用的标配，不论是下拉刷新还是SlidingMenu，它们的基础都是滑动。所谓滑动效果，归根结底它们都是由不同的滑动外加一些特效所组成的。因此，掌握滑动的方法是实现绚丽自定义控件的基础。通常通过三种方法来实现View的滑动：

通过View本身提供的scrollTo/scrollBy方法来实现滑动
通过动画给View施加平移效果来实现滑动
通过改变View的LayoutParams使得View重新布局从而实现滑动

下面我们就来一一分析学习。

二、View的滑动

1.使用scrollTo/scrollBy

public void scrollTo(int x,int y){if(mScrollX!=x||mScrollY!=y){int oldX = mScrollX;int oldY = mScrollY;mScrollX = x;mScrollY = y;invalidateParentCaches();onScrollChanged(mScrollX,mScrollY,oldX,oldY);if(!awakenScrollBars()){postInvalidateOnAnimation();}}}

public void scrollBy(int x,int y){scrollTo(mScrollX + x , mScrollY + y);}

从源码中可以看见，scrollBy实际上也是调用了scrollTo方法，它实现了基于当前位置的相对滑动，而scrollTo则是实现了基于所传递参数的绝对滑动，这个不难理解。重点是我们要明白mScrollX和mScrollY的改变规则：

这两个属性了可以通过getScrollX和getScrollY方法分别得到，在滑动过程中，mScrollX的值总是等于View左边缘和View内容左边缘在水平方向的距离，而mScrollY的值总是等于View上边缘和View内容上边缘在竖直方向的距离

View边缘是指View的位置，由四个顶点组成，而View内容边缘是指View中的内容的边缘，scrollTo和scrollBy只能改变View内容的位置而不能改变View在布局中的位置。mScrollX和mScrollY的单位为像素，当View左边缘在View内容左边缘右边时，mScrollX为正值，反之为负值；当View上边缘在View内容上边缘的下边时，mScrollY为正值，反之为负值。换句话说：当从左向右滑动时，mScrollX为负值，反之，为正值。当从上往下滑动时，mScrollY为负值，反之，为正值。

Android中View的知识体系——（2）View的滑动_第1张图片

2.使用动画

通过动画，我们能够让一个View进行平移，而平移就是一种滑动，使用动画来移动View，主要是操作View的translationX和translationY属性，既可以采用传统的View动画，也可以采用属性动画，如果采用属性动画的话，为了能够兼容3.0以下的版本，需要采用开源动画库nineoldandroids(http://nineoldandroids.com/)。

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"android:fillAfter="true"android:zAdjustment="normal">   <translate   android:duration="100"   android:fromXDelta="0"   android:fromYDelta="0"   android:interpolator="@android:anim/linear_interpolator"   android:toXDelta="100"   android:toYDelta="100" /></set>

属性动画：

 ObjectAnimator.ofFloat(targetView,"translationX",0,100).setDuration(100).start();

作用：将一个View在100ms内从原始位置向右平移100像素
关于动画的详细介绍请参考：

注意：

View动画是对View的影像做操作，它并不能真正改变View的位置参数，包括宽/高，并且如果希望动画后的状态保留下来，还必须将fillAfter的属性设置为true，否则，动画效果会消失

比如：

fillAfter为false，那么在动画完成的一刹那，View会瞬间恢复到动画前的状态

fillAfter为true，在动画完成后，View会停留在距原始位置100像素的右边

使用属性动画并不会出现上述问题，但是在Android3.0以下无法使用属性动画，这时我们可以使用动画兼容库nineoldandroids来实现属性动画，尽管如此，Android3.0以下的手机上通过nineoldandroids来实现的属性动画本质上仍是View动画。

但是现在还存在一个问题：

假如我们通过View动画将一个Button向右移动100px，并且这个View设置有点击事件，然后你会发现，点击新位置无法触发onClick事件，而点击原位置仍然可以触发onClick事件，尽管Button已经不再原位置了。在系统眼里，这个Button没有发生任何变化，而新位置只是Button的影像而已

3.改变布局参数

改变布局参数，即改变LayoutParams

比如：我们想把一个Button向右平移100px，我们只需将这个Button的LayoutParams里的marginLeft参数的值增加100px即可

MarginLayoutParams params = (MarginLayoutparamsmButton1.getLayoutParams();params.width + = 100;params.leftMargin + = 100;mButton1.requestLayout();//或者 mButton1.setLayoutParams(params);

同时，还有一种方法：

在将要移动的View前面，设置一个空的，默认宽度为0的View，若想要平均移动View，只需要设置空View的宽度即可

改变LayoutParams的方式去实现View的滑动是一种很灵活的方法，需要根据不同的情况去做不同的处理

4.各类滑动的区别

scrollTo/scrollBy：它是View提供的原生方法，其作用是专门用于View的滑动，它可以比较方便的实现滑动效果，并且不影响内部元素的单击事件。但是他的缺点在于：它只能滑动View的内容，并不能滑动View本身。
动画：在Android3.0以上并采用属性动画，那么采用这种方式没有明显的缺点；如果是使用View动画或者在Android3.0以下使用属性动画，均不能改变View本身的属性。在实际使用中，如果动画元素不需要响应用户的交互，那么使用动画来做滑动是比较合适的，反之，就不大合适。但是动画有一个明显的优点，那就是，一些复杂的效果必须要通过动画才能实现。
改变布局：除了操作稍微复杂，也没有什么明显的缺点。它主要适用的对象是一些具有交互性的View，因为这些View需要和用户交互，直接通过动画实现会有很大的问题，这时，我们可以使用直接改变布局参数的方式去实现。

总结：

scrollTo/scrollBy:操作简单，适合对View内容的滑动；

动画：操作简单，主要适用于没有交互的View和实现复杂的动画效果；

改变布局参数：操作稍微复杂，适用于有交互的View；6

三、弹性滑动

所有滑动都有一个共同的思想：

将一次大的滑动分成若干次小的滑动并在一个时间段内完成，弹性滑动的具体实现方法有很多，比如通过Scroller、Handler#postDelayed以及Thread#sleep等。

1.使用Scroller

Scroller源码:

Scroller scroller = new Scroller(mContext);//缓慢滚动到指定位置private void smoothScrollTo(int destX,int destY){int scrollerX = getScrollX();int deltaX = destX - scrollX;//1000ms内滑向destX，效果就是慢慢滑动mScroller.startScroll(scrollX,0,deltaX,0,1000);invalidate();}@Overridepublic void computeScroll(){if(mScroller.computeScrollOffset()){scrollTo(mScroller.getCurrX(),mScroller.getCurrY());postInvalidate();}}

上面是Scroller的典型使用方法

startScroll方法：

public void startScroller(int startX,int startY,int dx,int dy,int duration){mMode = SCROLL_MODE;mFinished = false;mDuration = duration;mStartTime = AnimationUtils.currentAnimationTimeMillis();mStartX = startX;mStartY = startY;mFinalX = startX + dx;mFinalY = startY + dy;mDeltaX = dx;mDeltaY = dy;mDurationReciprocal = 1.0f/(float) mDuration;}

startX和startY表示的是滑动的起点，dx和dy表示的是要滑动的距离，而duration表示的是滑动的时间，即整个滑动过程完成所需要的时间，注意：这里的滑动指的是View内容的滑动，而非是View本身位置的改变。

但是，仅仅调用startScroll方法是无法让View滑动的，因为它内部并没有做滑动相关的事。

接下来我们说一下Scroller究竟是如何让View滑动的：

原因在于startScroll方法下的invalidate方法。
invalidate方法会导致View重绘，在View的draw方法中又会去调用computeScroll方法，computeScroll方法在View中是一个空实现，因此需要我们自己去实现，上面的代码已经实现了computeScroll方法。也正是这个computeScroll方法，View才能实现弹性滑动。

当View重绘后，会在draw方法中调用computeScroll，而computeScroll又会去向Scroller获取当前的scrollX和scrollY；然后通过scrollTo方法实现滑动；接着又调用postInvalidate方法被调用；然后继续向Scroller获取当前的scrollX和scrollY，并通过scrollTo方法滑动到新位置，如此反复，直到整个滑动过程结束。

Scroller的computeScrollOffset方法：

public boolean computeScrollOffset(){...int timePassed = (int)(AnimationUtils.currentAnimationTimeMillis() - mStartTime);if(timePassed < mDuration){switch(mMode){case SCROLL_MODE:final float x = mInterpolator.getInterpolation(timePassed * mDurationReciprocal);mCurrX = mStartX + Math.round(x*mDeltaX);mCurrY = mStartY + Math.round(x*mDeltaY);break;... }}return true;}

这个方法会根据时间的流逝来计算出当前的scrollX和 scrollY的值。
根据时间流逝的百分比来算出scrollX和scrollY改变的百分比并计算出当前的值，这个过程类似于动画中的插值器的概念。方法的返回值也很重要，它返回true时，表示滑动还未结束，返回false则表示滑动已经结束，因此，当方法返回true时，我们还要继续进行View的滑动。

总结：

Scroller本身并不能实现View的滑动，它需要配合View的computeScroll方法才能完成弹性滑动的效果，它不断地让View重绘，而每一次重绘距滑动起始时间有一个时间间隔，通过这个时间间隔Scroller就可以得出View当前的滑动位置，知道了滑动位置就可以通过scrollTo方法来完成View的滑动，就这样，View的每一次重绘都会导致View进行小幅度的滑动，而多次的小幅度滑动就组成了弹性滑动，这就是Scroller的工作机制。

由此可见，Scroller的设计思想是多么值得称赞，整个过程中它对View没有丝毫的引用，甚至在它内部连计时器都没有。

2.通过动画

动画本身就是一种渐进的过程，因此通过它来实现的滑动，天然就具有弹性效果，例如：

//让一个View的内容在100ms内向左移动100像素ObjectAnimator.ofFloat(targetView,"translationX",0,100).setDuration(100).start();

拿scrollTo来说，我们也想模仿Scroller来实现View的弹性滑动，利用动画的特性：

final int startX = 0;final int deltaX = 100;ValueAnimator animator = ValueAnimator.ofInt(0,1).setDuration(1000);animator.addUpdateListener(new AnimatorUpdateListener)(){@Overridepublic void onAnimationUpdate(ValueAnimator animator){float fraction = animator.getAnimatedFraction();mButton1.scrollTo(startX + (int) (deltaX * fraction),0);}});animator.start();

我们的动画本质上没有作用于任何对象上，它只是在1000ms内完成了整个动画过程。

利用这个特性，我们就可以在动画的每一帧到来时获取动画完成的比例，然后再根据这个比例计算出当前View所要滑动的距离。注意，这里的滑动针对的是View的内容而非是View本身。可以发现，这个方法的思想其实和Scroller比较类似，都是通过改变一个百分比配合scrollTo方法来完成View的滑动。

需要说明的是：采用这种方法除了能够完成弹性滑动以外，还可以实现其他动画效果，我们完全可以在onAnimationUpdate方法中加上我们想要的其他操作。

3.延时策略

使用延时策略实现弹性滑动

核心思想：

通过发送一系列延时消息从而达到一种渐进式的效果，具体说可以使用Handler或View的postDelayed方法，也可以使用线程的sleep方法。对于postDelayed方法来说，我们可以通过它来延时发送一个消息，然后在消息中来进行View的滑动，如果接连不断地发送这种延时消息，那么就可以实现弹性滑动的效果，对于sleep方法来说，通过在while循环中不断地滑动View和sleep，就可以实现弹性滑动的效果。

下面采用Handler做个示例：

在1000ms内将View的内容向左移动了100个像素
之所以说1000ms内，是因为采用这种方式无法精确地定时，原因是系统的消息调度也是需要时间的，并且所需时间不定。

private static final int MESSAGE_SCROLL_TO = 1;private static final int FRAME_COUNT = 30;private static final int DELAYED_TIME = 33;private int mCount = 0;@SuppressLint("HandlerLeak")private Handler mHandler = new Handler() {    public void handleMessage(Message msg){        switch(msg.what){            case MESSAGE_SCROLL_TO: {                mCount++;                if(mCount <= FRAME_COUNT){                    float fraction = mCount / (float) FRAME_COUNT;                    int scrollX = (int) (fraction * 100);                    mButton1.scrollTo(scrollX,0);                    mHandler.sendEmptyMessageDelayed(MESSAGE_SCROLL_TO,DELAYED_TIME);                }                break;            }            default:                break;        }    };};

感谢收看

Android中View的知识体系——（2）View的滑动

Android中View的知识体系——（2）View的滑动

一、前言

下面我们就来一一分析学习。

二、View的滑动

1.使用scrollTo/scrollBy

从源码中可以看见，scrollBy实际上也是调用了scrollTo方法，它实现了基于当前位置的相对滑动，而scrollTo则是实现了基于所传递参数的绝对滑动，这个不难理解。重点是我们要明白mScrollX和mScrollY的改变规则：

2.使用动画

注意：

但是现在还存在一个问题：

3.改变布局参数

改变布局参数，即改变LayoutParams

改变LayoutParams的方式去实现View的滑动是一种很灵活的方法，需要根据不同的情况去做不同的处理

4.各类滑动的区别

总结：

三、弹性滑动

所有滑动都有一个共同的思想：

1.使用Scroller

startScroll方法：

startX和startY表示的是滑动的起点，dx和dy表示的是要滑动的距离，而duration表示的是滑动的时间，即整个滑动过程完成所需要的时间，注意：这里的滑动指的是View内容的滑动，而非是View本身位置的改变。

但是，仅仅调用startScroll方法是无法让View滑动的，因为它内部并没有做滑动相关的事。

接下来我们说一下Scroller究竟是如何让View滑动的：

总结：

2.通过动画

动画本身就是一种渐进的过程，因此通过它来实现的滑动，天然就具有弹性效果，例如：

拿scrollTo来说，我们也想模仿Scroller来实现View的弹性滑动，利用动画的特性：

我们的动画本质上没有作用于任何对象上，它只是在1000ms内完成了整个动画过程。

3.延时策略

使用延时策略实现弹性滑动

核心思想：

下面采用Handler做个示例：

更多相关文章

随机推荐