Android开发艺术探索 第三章View

第三章 View

1.View的基础知识

1.1 什么是View

View是Android所有控件的基类，比如button，listView等的基类都是View。除了View以外，还有一个ViewGroup。ViewGroup代表一组View的集合，ViewGroup也是一种View

1.2 View的参数

view的位置由四个顶点确定，分别对应四个属性top、left、right、bottom，其中top是左上角纵坐标，left是左上角的横坐标，right是右下角的横坐标，bottom是右下角的纵坐标。这些坐标是针对父容器来说的，是相对坐标。横坐标的正方向是向右，纵坐标的正方向是向下。

很容易得到如下的关系式
$$\begin{gathered} width=right-left \\ height=bottom-top \end{gathered}$$
这些参数的获取，可以通过get方法

例如

int left=view.getLeft();

从3.0开始，新增了几个属性，分别是x、y、translationX和translationY。其中xy是左上角的坐标，translationX、translationY是view左上角与父布局的偏移量，translationX和translationY默认是0。他们的换算公式如下
$$\begin{gathered} x=left+translationX \\ y=top+translationY \end{gathered}$$
注意如果发生平移的话，此时变化的是x和y 以及translation，left和top代表原始的view的左上角坐标，不会发生变化。

1.3 MotionEvent和TouchSlop

1.3.1 MotionEvent

代表从手指接触屏幕后的几个事件，有以下几个事件。

ACTION_DOWN——手指接触界面

ACTION_MOVE——手指在界面上移动

ACTION_UP——手指离开界面

点击—>滑动—>松开 会依次调用 ACTION_DOWN—> ACTION_MOVE—> …… ACTION_MOVE—>ACTION_UP

通过MotionEvent对象可以获取点击事件的x，y坐标；getX与getRawX两组，区别在于前者返回的是当前view左上角x、y,后者返回相对于屏幕左上角的坐标

1.3.2 TouchSlop

TouchSlop是能被系统识别的最小移动距离，这是一个常量，与设备有关，可以通过以下代码获得。

ViewConfiguration.get(getContext()).getScaledTouchSlop();

可以在frameworks/base/core/res/res/values/config.xml中找到config_viewConfigurationTouchSlop的定义，更改对应的值就可以增加识别的最小距离，防止过于灵敏。

<dimen name="config_viewConfigurationTouchSlop">8dp</dimen>

1.4 VelocityTracker、GestureDetector和Scroller

1.4.1 VelocityTracker

速度追踪，用于追踪手指滑动的速度，包括了水平和数值的速度。

使用方式：

（1）首先在view的onTouchEvent中追踪事件

@Override 
public boolean onTouchEvent(MotionEvent event) {
    VelocityTracker velocityTracker=VelocityTracker.obtain();
    velocityTracker.addMovement(event);
    ……
}

（2）获取速度。

		velocityTracker.computeCurrentVelocity(1000);
		int x= (int) velocityTracker.getXVelocity();
    int y= (int) velocityTracker.getYVelocity();

这里的速度指的是一段时间内，手指所划过的像素数，computeCurrentVelocity的参数单位是ms，比如将时间设置1000代表的是1秒内划过的像素数。

（3）不使用时，调用clear清空

    velocityTracker.clear();
    velocityTracker.recycle();

1.4.2 GestureDetector

GestureDetector手势检测，用于辅助检测用户的单击、滑动、长按、双击等行为。

使用方式

（1）实现OnGestureListener接口，如果有需要还可以实现OnDoubleTapListener接口

    GestureDetector gestureDetector = new GestureDetector(getContext(),
        new GestureDetector.OnGestureListener() {
            @Override public boolean onDown(MotionEvent e) {
                return false;
            }

            @Override public void onShowPress(MotionEvent e) {

            }

            @Override public boolean onSingleTapUp(MotionEvent e) {
                return false;
            }

            @Override public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
                float distanceY) {
                return false;
            }

            @Override public void onLongPress(MotionEvent e) {

            }

            @Override public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
                float velocityY) {
                return false;
            }
        });
    gestureDetector.setIsLongpressEnabled(false);

（2）接着接管目标view的onTouchEvent

@Override public boolean onTouchEvent(MotionEvent event) {
   	boolean flag=gestureDetector.onTouchEvent(event);
    return flag;
}

（3）

方法名	描述	所属接口
onDown	手指轻轻触摸屏幕的一瞬间，由一个ACTION_DOWN触发	OnGestureListener
onShowPress	手指轻轻触摸屏幕，尚未松开或拖动，由一个ACTION_DOWN触发 *注意和onDown()的区别，它强调的是没有松开或者拖动的状态	OnGestureListener
onSingleTabUp	手指(轻轻触摸屏幕后)松开，伴随着一个MotionEvent.ACTION_UP而触发，这是单击行为	OnGestureListener
onScroll	手指按下屏幕并拖动，由1个ACTION_DOWN，多个ACTION_MOVE触发，这是拖动行为	OnGestureListener
onLongPress	用户长久地按屏幕不放，即长按	OnGestureListener
onFling	当用户按下触摸屏、快速滑动后松开，由一个ACTION，多个ACTION_MOVE和1个ACTION_UP触发，这是快速滑动行为	OnGestureListener
onDoubleTap	双击，由2次连续的单击组成，它不可能和onSingleTapConfirmed共存	OnDoubleTapListener
onSingleTapConfirmed	严格的单击行为 *注意它和onSingleTapUp地区别，如果触发了onSingleTapConfirmed,那么后面不可能再紧跟着另一个单击行为，即这只可能是单击，而不可能使双击中的一次单击	OnDoubleTapListener
onDoubleTabEvent	表示发送了双击行为，再双击期间，ACTION_DOWN、ACTION_MOVE和ACTION_UP都会触发此回调	OnDoubleTapListener

1.4.3 Scroller

弹性滑动对象，用于实现view的弹性滑动。区别于scrollTo和scrollBy方法进行滑动时是瞬时实现的，用户体验感较差，而Scroller可以配合View的computeScroll方法用来实现有过渡效果的滑动。

使用方式

Scroller scroller = new Scroller(mContext);private void smoothScrollTo(int destX,int  destY) {    int scrollX = getScrollX();    int delta = destX - scrollX;    //1000ms内滑向dest，效果就是慢慢滑动    scroller.startScroll(scrollX,0,delta,0,1000);    invalidate();} @Overridepublic void computeScroll() {    if (scroller.computeScrollOffset()){        scrollTo(scroller.getCurrX(), scroller.getCurrY());        postInvalidate();    }}

具体的代码在下一节进行讲解。

2. View滑动

view的滑动有三种实现方式

2.1 使用scrollTo/scrollBy

看一下源码

可以看到scrollTo首先判断一下，首先判断判断mScrollX/Y是否等于 外部设置的x/y，不相等时，进行重新赋值，然后调用invalidateParentCaches()清空父View的缓存，用于强制父View进行视图的重建。然后调用onScrollChanged ()这个方法是scrollBy/scrollTo滚动时而产生的回调。awakenScrollBars()会启动平滑滚动的动画，动画开始时返回true。postInvalidateOnAnimation()用来在下一个动画帧上发生失效。

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();        }    }}

可以看到scrollBy实际上就是调用了scrollTo，scrollTo使用的是绝对坐标，scrollBy是相对之前的坐标。

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

看代码可以发现有两个比较重要的参数mScrollX和mScrollY。

首先在说这个直接要理解一个概念就是，scrollTo和scrollBy只能改变view内容的显示位置，而不能改变view实际在布局中的位置。好比海市蜃楼能显示在很多不同的地方，但是正常这个幻想实体的地方确实固定的。mScrollX和mScrollY代表的是内容边缘到view边缘的距离。他们的关系如下所示。

mScrollX = View的左边缘 - View内容的左边缘mScrollY = View的上边缘 - View内容的上边缘

2.2 通过动画

通过动画可以让一个view进行，使用动画进行平移则是改变translation。而动画有包括了两种，分别是传统的View动画和属性动画。如果使用属性动画，为了兼容3.0以下版本，需要使用开源的动画库nineoldandroid。

（1）view动画

先创建anim的xml文件

<?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="1000"    android:fromXDelta="0"    android:fromYDelta="0"    android:toXDelta="100"    android:toYDelta="100"    android:interpolator="@android:anim/linear_interpolator"    /></set>

（2）属性动画

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

view动画是对动画的影象做操作，不能真正改变位置参数，如果想在动画后保存，需要加上 android:fillAfter=“true”。view动画带来了一个问题，比如一个button被移动了100的距离，然而用户点击button却没有点击事件，而点平移之前button所在位置却能触发点击事件，因为不管怎么移动，button在系统看来它的位置参数没有变动，仍然在原地，因此点击事件自然也在原地触发。而使用属性动画则不会导致这个问题。

2.3改变布局参数

    ViewGroup.MarginLayoutParams layoutParams=        (ViewGroup.MarginLayoutParams) view.getLayoutParams();    layoutParams.leftMargin+=100;    view.requestLayout();    //或者    //view.setLayoutParams(layoutParams);

2.4三种方式的区别

scrollTo/scrollTo 使用简单，不影响点击事件。缺点是只能滑动view的内容而不能移动view。

动画 如果使用属性动画，则没有明显的缺点。如果使用view动画，则会无法和用户交互。比较复杂的动画效果需要动画才能实现。

布局参数 适合交互的view

3.弹性滑动

3.1scroller

    Scroller scroller = new Scroller(mContext);    private void smoothScrollTo(int destX,int  destY) {        int scrollX = getScrollX();        int delta = destX - scrollX;        //1000ms内滑向dest，效果就是慢慢滑动        scroller.startScroll(scrollX,0,delta,0,1000);        invalidate();    }    @Override    public void computeScroll() {        if (scroller.computeScrollOffset()){            scrollTo(scroller.getCurrX(), scroller.getCurrY());            postInvalidate();        }    }

使用时首先创建一个Scroller对象，然后将原坐标和目标坐标传给startScroll()，查看源码可以发现startScroll()什么都没做，只是存储了几个传递的参数。mStartX mFinalX是滑动的起点和终点 mDeltaX 是滑动的距离 mDuration是持续时间。因此可以知道startScroll其实并没有进行滑动，真正的滑动时在下面的invalidate()进行。invalidate方法会导致view的重绘，在draw过程中会调用computeScroll；然后继续这样循环，将一个大的滑动拆分成很多个小的滑动，从而实现弹性过渡的效果。

public void startScroll(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;}

computeScroll在view中是一个空实现，需要自己进行重写。

computeScrollOffset中的代码，很容易理解 首先获取了目前已经过去的时间，在判断滑动的模式。通过Interpolator这个差值器获取动画的完成度，然后随着时间的流逝，不断地增加x、y的坐标，从而达到弹性滑动的效果。返回值为true时代表动画完成，false时代表进行中。

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；}

这样可以知道，就是每次隔一段时间进行位置的计算重绘，循环进行，将一次次小的scrollTo 瞬时滑动在整个时间段上呈现出弹性滑动的效果。

3.2 通过动画

由于动画天生就是带有弹性滑动的效果，比如之前所说的下列代码可以实现100px的弹性滑动。

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

除了这个方式以外，还可以通过下面的方式进行移动。

final int startX=0;final int deltaX=100;ValueAnimator animator=ValueAnimator.ofInt(0,1).setDuration(1000);animator.addUpdateListener(new AnimatorUpdateListener(){    @override    public void onAnimationUpdate(ValueAnimator animator){        //获取当前动画执行时间的百分比        float fraction=animator.getAnimatedFraction();        mButton1.scrollTo(startX+(int)(deltaX*fraction),0)    }});animator.start();

3.3通过延时策略

通过一个循环，不断的发送延时scrollTo达到弹性滑动的功能。