[置顶] android知识回顾--view的事件体系

1.view的滑动，六种滑动方式：

   一：通过layout来实现滑动效果

    

package com.example.testdragview;

import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;

public class DragView extends View{
    
    
    private int lastX;
    private int lastY;
   

    public DragView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    public DragView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public DragView(Context context) {
        super(context);
    }

    
    
    public boolean onTouchEvent(MotionEvent event) {
        
//        Log.d("付勇焜----->","TouchEvent");
//        Log.d("付勇焜----->",super.onTouchEvent(event)+"");
        
        
        //获取到手指处的横坐标和纵坐标
        int x = (int) event.getX();
        int y = (int) event.getY();
        
        switch(event.getAction())
        {
        case MotionEvent.ACTION_DOWN:
            
            lastX = x;
            lastY = y;
            
            break;
            
        case MotionEvent.ACTION_MOVE:
            
            //计算移动的距离
            int offX = x - lastX;
            int offY = y - lastY;
            //调用layout方法来重新放置它的位置
            layout(getLeft()+offX, getTop()+offY,
                    getRight()+offX    , getBottom()+offY);
        
            break;
        }
        
        return true;
    }
}

二、offsetLeftAndRight()和offsetTopAndBottom()方法来实现

其实这两个方法分别是对左右移动和上下移动的封装，传入的就是偏移量。此时将DragView中的onTouchEvent代码简单替换即可，如下：

 1 public boolean onTouchEvent(MotionEvent event) {
2        
3        //获取到手指处的横坐标和纵坐标
4        int x = (int) event.getX();
5        int y = (int) event.getY();
6        
7        switch(event.getAction())
8         {
9        case MotionEvent.ACTION_DOWN:
10            
11            lastX = x;
12            lastY = y;
13            
14            break;
15            
16        case MotionEvent.ACTION_MOVE:
17            
18            //计算移动的距离
19            int offX = x - lastX;
20            int offY = y - lastY;
21            
22             offsetLeftAndRight(offX);
23            offsetTopAndBottom(offY);
24 
25            break;
26         }
27        
28        return true;
29    }

红色部分就是关键代码了，运行一下程序，跟上面的效果是一样的，不再贴图。

三、使用LayoutParams来实现

依旧修改DragView的onTouchEvent代码，如下：

 1 public boolean onTouchEvent(MotionEvent event) {
2        
3        //获取到手指处的横坐标和纵坐标
4        int x = (int) event.getX();
5        int y = (int) event.getY();
6        
7        switch(event.getAction())
8         {
9        case MotionEvent.ACTION_DOWN:
10            
11            lastX = x;
12            lastY = y;
13            
14            break;
15            
16        case MotionEvent.ACTION_MOVE:
17            
18            //计算移动的距离
19            int offX = x - lastX;
20            int offY = y - lastY;
21            
22            ViewGroup.MarginLayoutParams mlp = 
23                    (MarginLayoutParams) getLayoutParams();
24            
25            mlp.leftMargin = getLeft()+offX;
26            mlp.topMargin = getTop()+offY;
27            
28            setLayoutParams(mlp);
29 
30            break;
31         }
32        
33        return true;
34    }

红色部分依旧是关键代码。注意这里我们一般通过改变view的Margin属性来改变其位置的。

    运行程序，结果依旧，不再贴图。

 

四、通过scrollTo和scrollBy方法，不是弹性滑动，感觉会很突兀

      在一个view中，系统也提供了scrollTo和scrollBy方法来移动view。很好理解，sceollTo(x,y)传入的应该是移动的终点坐标，而scrollBy(dx,dy)传入的是

移动的增量。这两个方法要在view所在的viewGroup中使用！但是一定要注意：通过scrollBy传入的值应该是你需要的那个增量的相反数！这样子才能达到你想

要的效果！！切记切记

      依旧是hi修改DragView的onTouchEvent代码，如下：

public boolean onTouchEvent(MotionEvent event) {
        
        //获取到手指处的横坐标和纵坐标
        int x = (int) event.getX();
        int y = (int) event.getY();
        
        switch(event.getAction())
        {
        case MotionEvent.ACTION_DOWN:
            
            lastX = x;
            lastY = y;
            
            break;
            
        case MotionEvent.ACTION_MOVE:
            
            //计算移动的距离
            int offX = x - lastX;
            int offY = y - lastY;
            
        ((View) getParent()).scrollBy(-offX,- offY);

            break;
        }
        
        return true;
    }

  

五.使用Scroller来实现弹性滑动

上面我们提到了使用scrollTo/scrollBy方法实现View的滑动效果不是平滑的，好消息是我们可以使用Scroller方法来辅助实现View的弹性滑动。使用Scroller实现弹性滑动的惯用代码如下：

 1 Scroller scroller = new Scroller(mContext);
 2 
 3 private void smoothScrollTo(int dstX, int dstY) {
 4     int scrollX = getScrollX();
 5     int delta = dstX - scrollX;
 6     scroller.startScroll(scrollX, 0, delta, 0, 1000);
 7     invalidate();
 8 }
 9 
10 @Override
11 public void computeScroll() {
12     if (scroller.computeScrollOffset()) {
13         scrollTo(scroller.getCurrX(), scroller.getCurY());
14         postInvalidate();
15     }
16 }

 

    我们来看一下以上的代码。第4行中，我们获取到View的mScrollX参数并存到scrollX变量中。然后在第5行计算要滑动的位移量。第6行调用了startScroll方法，我们来看看startScroll方法的源码：

 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     
14     mViscousFluidScale = 8.0f;  
15    
16     mViscousFluidNormalize = 1.0f;  
17     mViscousFluidNormalize = 1.0f / viscousFluid(1.0f);  
18 }  

 

    从以上的源码我们可以看到，startScroll方法中并没有进行实际的滚动操作，而是把startX、startY、deltaX、deltaY等参数都保存了下来。那么究竟怎么实现View的滑动的呢？我们先回到Scroller惯用代码。我们看到第7行调用了invalidate方法，这个方法会请求重绘View，这会导致View的draw的方法被调用，draw的方法内部会调用computeScroll方法。我们来看看第13行，调用了scrollTo方法，并传入mScroller.getCurrX()和mScroller.getCurrY()方法作为参数。那么获取到的这两个参数是什么呢？这两个参数是在第12行调用的computeScrollOffset方法中设置的，我们来看看这个方法中设置这两个参数的相关代码：

 1 public boolean computeScrollOffset() {
 2     ...
 3     int timePassed = (int) (AnimationUtils.currentAnimationTimeMillis() - mStartTime);
 4     if (timePassed < mDuration) {
 5         switch (mMode) {
 6             case SCROLL_MODE:
 7                 final float x = mInterpolator.getInterpolation(timePassed * mDurationReciprocal);
 8                 mCurrX = mStartX + Math.round(x * mDeltaX);
 9                 mCurrY = mStartY + Math.rounc(y * mDeltaY);
10                 break;
11         ...
12         }
13     }
14     return true;
15 }

 

    以上代码中第8行和第9行设置的mCurrX和mCurrY即为以上scrollTo的两个参数，表示本次滑动的目标位置。computeScrollOffset方法返回true表示滑动过程还未结束，否则表示结束。

    通过以上的分析，我们大概了解了Scroller实现弹性滑动的原理：invaldate方法会导致View的draw方法被调用，而draw会调用computeScroll方法，因此重写了computeScroll方法，而computeScrollOffset方法会根据时间的流逝动态的计算出很小的一段时间应该滑动多少距离。也就是把一次滑动拆分成无数次小距离滑动从而实现“弹性滑动”。

    六.使用动画来实现滑动

使用动画来实现View的滑动主要通过改变View的translationX和translationY参数来实现，使用动画的好处在于滑动效果是平滑的。上面我们提到过，View的x、y参数决定View的当前位置，通过改变translationX和translationY，我们就可以改变View的当前位置。我们可以使用属性动画或者补间动画来实现View的平移。

    首先，我们先来看一下如何使用补间动画来实现View的平移。补间动画资源定义如下（anim.xml):

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:fillAfter="true">

    <translate
        android:duration="100"
        android:fromXDelta="0"
        android:fromYDelta="0"
        android:interpolator="@android:anim/linear_interpolator"
        android:toXDelta="100"
        android:toYDelta="100"/>

</set>

 

 

    然后在onCreat方法中调用startAnimation方法即可。使用补间动画实现View的滑动有一个缺陷，那就是移动的知识View的“影像”，这意味着其实View并未真正的移动，只是我们看起来它移动了而已。拿Button来举例，假若我们通过补间动画移动了一个Button，我们会发现，在Button的原来位置点击屏幕会出发点击事件，而在移动后的Button上点击不会触发点击事件。

    接下来，我们看看如何用属性动画来实现View的平移。使用属性动画实现View的平移更加简单，只需要以下一条语句：

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

 

    以上代码即实现了使用属性动画把targetView在100ms内向右平移100px。使用属性动画的限制在于真正的属性动画只可以在Android 3.0+使用（一些第三方库实现的兼容低版本的属性动画不是真正的属性动画），优点就是它可以真正的移动View而不是仅仅移动View的影像。

   经过以上的描述，使用属性动画实现View的滑动看起来是个不错的选择，而且一些View的复杂的滑动效果只有通过动画才能比较方便的实现。

2.View的滑动冲突

在Android开发中，如果是一些简单的布局，都很容易搞定，但是一旦涉及到复杂的页面，特别是为了兼容小屏手机而使用了ScrollView以后，就会出现很多点击事件的冲突，最经典的就是ScrollView中嵌套了ListView。我想大部分刚开始接触Android的同学们都踩到过这个坑，下面跟着小编一起来看看解决方案吧。。

同方向滑动冲突

比如ScrollView嵌套ListView，或者是ScrollView嵌套自己

这里先看一张效果图

上图是在购物软件上常见的上拉查看图文详情，关于这中动画效果的实现，其实实现整体的效果，办法是有很多的，网上有很多相关的例子，但是对某些细节的处理不是很清晰，比如，下拉之后显示的部分（例如底部的图文详情）又是一个类ScrollView的控件（比如WebView）的话，又会产生新的问题。这里就以下拉查看图文详情为背景做一下同方向滑动冲突的分析。

整体思路
这里看下图

北大青鸟IT就业班 免费试学

【点击进入】

java和 .NET开发,SEO,SEM,电商,互动营销等 软件开发、网络营销等专业,学完推荐就业

查 看

多个ScrollView嵌套示意图

首先，关于这张图做一些设定：

     1.黑色的框代表手机屏幕

     2.绿色的框代表一个外层的ScrollView

     3.两个红色的框代表嵌套在里面的两个类ScrollView控件，这里我们就暂时简称为 SUp,SDown

好了，接下来就分析一下实现整个流程的过程。

这里必须明确的一点，无论何时，SUp和SDown可见的部分始终是手机屏幕的高度。知道了这一点，我们就可以按以下步骤展开

首先，我们确保外部的ScrollView不拦截滑动事件，这样SUp必然获得此次事件，然后根据其Action_Move事件，当其为向下滑动且自身滑动距离+屏幕高度=其自身高度 时，即可认为SUp滑动到了底部，此时外部ScrollView可拦截滑动事件，从而保证整个视图能够继续向下滑动，这个时候底部SDown就显示出来了。

同理，这时候不允许外部ScrollView拦截滑动事件，由SDown处理，根据其Action_move事件，当其为向上滑动，且自身可滑动距离为0时，就说明SDown已经滑动到了顶部，这时外部ScrollView又可以获得拦截滑动事件的权利，从而保证整个视图能够向上继续滑动，此时SUp再次显示，又开始新一轮循环拦截。

这样整体的一个流程就可以实现动图中的效果。好了，说完原理，还是看代码。

代码实现

SUp实现

public class UpScrollView extends ScrollView {
 /**
 * 屏幕高度
 */
 private int mScreenHeight;
 /**
 * 上一次的坐标
 */
 private float mLastY;
 /**
 * 当前View滑动距离
 */
 private int mScrollY;
 /**
 * 当前View内子控件高度
 */
 private int mChildH;

 public UpScrollView(Context context) {
 super (context);
 init(context);
 }

 public UpScrollView(Context context, AttributeSet attrs) {
 super (context, attrs);
 init(context);
 }

 public UpScrollView(Context context, AttributeSet attrs, int defStyleAttr) {
 super (context, attrs, defStyleAttr);
 init(context);

 }

 private void init(Context context) {
 WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
 DisplayMetrics dm = new DisplayMetrics();
 wm.getDefaultDisplay().getMetrics(dm);
 mScreenHeight = dm.heightPixels;
 }

 @Override
 public boolean onTouchEvent(MotionEvent ev) {
 //默认设定顶层View不拦截

 getParent().getParent().requestDisallowInterceptTouchEvent( true );

 switch (ev.getAction()) {
  case MotionEvent.ACTION_DOWN:
  mLastY = ( int ) ev.getY();
  break ;
  case MotionEvent.ACTION_MOVE:
  float y = ev.getY();
  float deltaY = y - mLastY;

  mChildH = this .getChildAt( 0 ).getMeasuredHeight();

  int translateY = mChildH - mScrollY;

  //向上滑动时，如果translateY等于屏幕高度时，即表明滑动到底部，可又顶层View控制滑动
  if (deltaY < 0 && translateY == mScreenHeight) {
   getParent().getParent().requestDisallowInterceptTouchEvent( false );
  }
  break ;
  default :
  break ;

 }

 return super .onTouchEvent(ev);
 }

 @Override
 protected void onScrollChanged( int l, int t, int oldl, int oldt) {
 super .onScrollChanged(l, t, oldl, oldt);
 mScrollY = t;
 }
}

这里在ACTION_MOVE里做了减法，其实道理是一样的。

onScrollChanged 是在View类中实现，查看其API可以看到其第二个参数t解释

@param t Current vertical scroll origin.

即为当前View此次滑动的距离

SDown实现

public class MyWebView extends WebView {
 public float oldY;
 private int t;

 public MyWebView(Context context) {
 super (context);
 init();
 }

 public MyWebView(Context context, AttributeSet attrs) {
 super (context, attrs);
 init();
 }

 public MyWebView(Context context, AttributeSet attrs, int defStyleAttr) {
 super (context, attrs, defStyleAttr);
 init();
 }

 private void init() {
 WebSettings settings = getSettings();
 settings.setJavaScriptEnabled( true );
 setWebViewClient( new WebViewClient() {
  @Override
  public boolean shouldOverrideUrlLoading(WebView view, String url) {
  view.loadUrl(url);
  return true ;
  }
 });
 }

 @Override
 public boolean onTouchEvent(MotionEvent ev) {
 getParent().getParent().requestDisallowInterceptTouchEvent( true );
 switch (ev.getAction()) {
  case MotionEvent.ACTION_DOWN:
  oldY = ev.getY();
  break ;
  case MotionEvent.ACTION_MOVE:

  float Y = ev.getY();
  float Ys = Y - oldY;
  if (Ys > 0 && t == 0 ) {
   getParent().getParent().requestDisallowInterceptTouchEvent( false );
  }
  break ;

 }

 return super .onTouchEvent(ev);
 }

 @Override
 protected void onScrollChanged( int l, int t, int oldl, int oldt) {
 this .t = t;
 super .onScrollChanged(l, t, oldl, oldt);
 }

}

以上看到，这里底部的View并没有继承ScrollView，而是选择继承了WebView，这里只是为了方便，当然继承ScrollView也是没有问题。这里只是需要按实际情况考虑，因为底部图文详情的内容就是一个WebView加载数据。

这个类的实现，按照之前说的原理应该很好理解。

外部ScrollView

public class CustomerScrollViews extends ScrollView {
 /**
 * 屏幕高度
 */
 private int mScreenHeight;

 private UpScrollView upScrollView;
 private MyWebView myWebView;
 private boolean init = false ;

 private float fator = 0 .2f;
 private int factorHeight;

 private boolean upShow = true ;

 public CustomerScrollViews(Context context) {
 super (context);
 init(context);
 }

 public CustomerScrollViews(Context context, AttributeSet attrs) {
 super (context, attrs);
 init(context);
 }

 public CustomerScrollViews(Context context, AttributeSet attrs, int defStyleAttr) {
 super (context, attrs, defStyleAttr);
 init(context);

 }

 private void init(Context context) {
 WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
 DisplayMetrics dm = new DisplayMetrics();
 wm.getDefaultDisplay().getMetrics(dm);
 mScreenHeight = dm.heightPixels;
 factorHeight = ( int ) (mScreenHeight * fator);
 }

 @Override
 protected void onMeasure( int widthMeasureSpec, int heightMeasureSpec) {
 if (!init) {

  LinearLayout parentView = (LinearLayout) getChildAt( 0 );
  //获得内部的两个子view
  upScrollView = (UpScrollView) parentView.getChildAt( 0 );
  myWebView = (MyWebView) parentView.getChildAt( 2 );
//  //并设定其高度为屏幕高度
  upScrollView.getLayoutParams().height = mScreenHeight;
  myWebView.getLayoutParams().height = mScreenHeight;
  init = true ;
 }

 super .onMeasure(widthMeasureSpec, heightMeasureSpec);
 }

 @Override
 protected void onLayout( boolean changed, int l, int t, int r, int b) {
 super .onLayout(changed, l, t, r, b);
 if (changed) {
  scrollTo( 0 , 0 );
 }
 }

 @Override
 public boolean onTouchEvent(MotionEvent ev) {
 switch (ev.getAction()) {
  case MotionEvent.ACTION_UP:
  int scrollY = getScrollY();
  if (upShow) {
   if (scrollY <= factorHeight) {
   smoothScrollTo( 0 , 0 );
   } else {
   smoothScrollTo( 0 , mScreenHeight);
   upShow = false ;

   }
  } else {
   int scrollpadding = mScreenHeight - scrollY;
   if (scrollpadding >= factorHeight) {
   this .smoothScrollTo( 0 , 0 );
   upShow = true ;

   } else {
   this .smoothScrollTo( 0 , mScreenHeight);
   }

  }

  return true ;

 }
 return super .onTouchEvent(ev);
 }

}

这个类的实现，就很灵活了，在onMeasure方法中初始化完内部的View之后，在OnTouch方法中就可以根据实际需求完成不同的逻辑实现，这里只是为了仿照查看图文详情的效果，对整个视图通过ScrollView的smoothScrollTo方法进行位移变化，这个逻辑很简单。

这里重点说一下一个地方：

upScrollView = (UpScrollView) parentView.getChildAt( 0 );
myWebView = (MyWebView) parentView.getChildAt( 2 );

你可能会奇怪中间的child(1)去了哪里？这里还要从MainActivity的布局文件说起

dual_scrollview_activity_layout1.xml

<? xml version = "1.0" encoding = "utf-8" ?>
< LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android"
 android:layout_width = "match_parent"
 android:layout_height = "match_parent"
 android:orientation = "vertical" >

 < com.example.dreamwork.activity.superscrollview.CustomerScrollViews
 android:layout_width = "match_parent"
 android:layout_height = "match_parent" >

 < LinearLayout
  android:layout_width = "match_parent"
  android:layout_height = "wrap_content"
  android:orientation = "vertical" >

  < com.example.dreamwork.activity.superscrollview.UpScrollView

  android:layout_width = "match_parent"
  android:layout_height = "wrap_content"
  android:scrollbars = "vertical" >

  < LinearLayout
   android:layout_width = "match_parent"
   android:layout_height = "wrap_content"
   android:orientation = "vertical" >

   < ImageView
   android:layout_width = "match_parent"
   android:layout_height = "wrap_content"
   android:scaleType = "fitXY"
   android:src = "@drawable/taobao" />
   < ImageView
   android:layout_width = "match_parent"
   android:layout_height = "wrap_content"
   android:scaleType = "fitXY"
   android:src = "@drawable/taobao" />

   < TextView
   android:textSize = "20sp"
   android:padding = "10dp"
   android:gravity = "center"
   android:layout_marginTop = "20dp"
   android:layout_marginBottom = "60dp"
   android:text = "查看图文详情"
   android:layout_width = "match_parent"
   android:layout_height = "wrap_content" />

  </ LinearLayout >
  </ com.example.dreamwork.activity.superscrollview.UpScrollView >

  < include layout = "@layout/selector_tab_items" />

  < com.example.dreamwork.activity.superscrollview.MyWebView
  android:id = "@+id/web"
  android:layout_width = "match_parent"
  android:layout_height = "match_parent" />

 </ LinearLayout >
 </ com.example.dreamwork.activity.superscrollview.CustomerScrollViews >

</ LinearLayout >

整个布局文件可以看出，我们在CustomerScrollViews这个最外层的自定义ScrollView内部又放置了两个自定义的ScrollView（就如我们看到的原理图那样），只不过在这两个ScrollView类控件的中间通过layout又放置一个LinearLayout，里面的内容就是在动图中看到的那个中间的写着qq,baidu字样的用于切换WebView内容的一个View。这里就不贴代码了。

这样，你就可以理解之前的child(1)为什么被跳过了吧。

使用

?