【android】View的事件体系2-滑动方式

2、View 的滑动

通过三种方式可以实现 View 的滑动：

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

2.1、使用 scrollTo/scrollBy

scrollTo 和 scrollBy 只能改变 View 内容的位置而不能改变 View 在布局中的位置

/**     * Set the scrolled position of your view. This will cause a call to     * {@link #onScrollChanged(int, int, int, int)} and the view will be     * invalidated.     * @param x the x position to scroll to     * @param y the y position to scroll to     */    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();            }        }    }    /**     * Move the scrolled position of your view. This will cause a call to     * {@link #onScrollChanged(int, int, int, int)} and the view will be     * invalidated.     * @param x the amount of pixels to scroll by horizontally     * @param y the amount of pixels to scroll by vertically     */    public void scrollBy(int x, int y) {        scrollTo(mScrollX + x, mScrollY + y);    }

从源码可以看出，scrollBy 也是调用 scrollTo 方法，它实现了基于当前位置的相对滑动，而 scrollTo 则实现了基于所传递参数的绝对滑动。

方法内部有两个属性：

• mScrollX :可以通过 getScrollX方法得到。在滑动过程中 mScrollX 的值总是等于 View 左边缘和 View 内容左边缘在水平方向的距离。
• mScrollY :可以通过 getScrollY方法得到。在滑动过程中 mScrollX 的值总是等于 View上边缘 和 View 内容上边缘在竖直方向的距离。
• 这两个属性的单位是像素。

2.2、使用动画

让 View 进行平移，主要是操作 View 的 translationX 和 translationY 属性，既可以采用传统的 View 动画，也可以采用属性动画。

采用 View 动画，是动画可以在100ms内将一个 View 从原始位置向右下角移动100个像素。

<?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>

采用属性动画，在100ms内将一个 View 从原始位置向右平移100个像素。

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

View 动画是对 View 的影像做操作，它并不能真正的改变 View 的位置参数，包括宽/高，并且如果希望动画后的状态得以保留还必须将 fillAfter 的数字那个设置为true，否则动画完成后其动画结果将自动消失。使用属性动画不会存在上述问题。

不能改变位置会带来一个严重的问题，比如说，一个 button，它经过View动画移动之后会无法出发点击事件，因为它的点击事件会在原来的位置触发。

从 Android 3.0开始，使用属性动画可以解决上面的问题。

2.3、改变布局参数

看代码,享有平移100px：

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

2.4、总结和对比

• scrollTo/scrollBy：操作简单，适合对View内容的滑动；
• 动画：操作简单，主要适用于没有交互的View 和 实现复杂的动画效果；
• 改变布局参数：操作稍微复杂，适用于有交互的 View。

2.5、实现跟手滑动的效果

选择动画的方式

新建一个java文件,继承ImageView，重写 onTouchEvent()方法。

注意，这里用到ViewHelper，需要导入 nineoldandroids.jar,官网下载，放到libs下，add as library就可以用了。

package com.chandelier.personalview_slide;import android.content.Context;import android.util.AttributeSet;import android.view.MotionEvent;import android.widget.ImageView;import com.nineoldandroids.view.ViewHelper;public class MyView extends ImageView {    private int lastX;    private int lastY;    public MyView(Context context){        this(context,null);    }    public MyView(Context context, AttributeSet attrs){        super(context,attrs);    }    @Override    public boolean onTouchEvent(MotionEvent event) {        //获取手指坐标        int x = (int)event.getRawX();        int y = (int)event.getRawY();        switch (event.getAction()){            case MotionEvent.ACTION_MOVE:{                int deltaX = x - lastX;                int deltaY = y - lastY;                //计算移动距离                int translationX = (int)(ViewHelper.getTranslationX(this) + deltaX);                int translationY = (int)(ViewHelper.getTranslationY(this) + deltaY);                //设置使View移动                ViewHelper.setTranslationX(this,translationX);                ViewHelper.setTranslationY(this,translationY);                break;            }            default:                break;        }        lastX = x;        lastY = y;        return true;    }}

然后写进布局里：

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context="com.chandelier.personalview_slide.MainActivity">    <com.chandelier.personalview_slide.MyView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_centerInParent="true"        android:background="@mipmap/ic_launcher"/></RelativeLayout>

运行就可以看到效果了。