欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android應(yīng)用開發(fā)中自定義ViewGroup的究極攻略

 更新時(shí)間:2016年05月20日 14:58:14   作者:風(fēng)荷舉  
這里我們要演示的自定義ViewGroup中將實(shí)現(xiàn)多種方式排列和滑動(dòng)等效果,并且涵蓋子View之間Touch Event的攔截與處理等問題,完全干貨,下面就為大家送上Android應(yīng)用開發(fā)中自定義ViewGroup的究極實(shí)例攻略

支持margin,gravity以及水平,垂直排列
最近在學(xué)習(xí)android的view部分,于是動(dòng)手實(shí)現(xiàn)了一個(gè)類似ViewPager的可上下或者左右拖動(dòng)的ViewGroup,中間遇到了一些問題(例如touchEvent在onInterceptTouchEvent和onTouchEvent之間的傳遞流程),現(xiàn)在將我的實(shí)現(xiàn)過程記錄下來。

首先,要實(shí)現(xiàn)一個(gè)ViewGroup,必須至少重寫onLayout()方法(當(dāng)然還有構(gòu)造方法啦:))。onLayout()主要是用來安排子View在我們這個(gè)ViewGroup中的擺放位置的。除了onLayout()方法之外往往還需要重寫onMeasure()方法,用于測(cè)算我們所需要占用的空間。

首先,我們來重寫onMeasure()方法:(先只考慮水平方向)

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
 // 計(jì)算所有child view 要占用的空間
 desireWidth = 0;
 desireHeight = 0;
 int count = getChildCount();
 for (int i = 0; i < count; ++i) {
  View v = getChildAt(i);
  if (v.getVisibility() != View.GONE) {
   measureChild(v, widthMeasureSpec,
     heightMeasureSpec);
   desireWidth += v.getMeasuredWidth();
   desireHeight = Math
     .max(desireHeight, v.getMeasuredHeight());
  }
 }

 // count with padding
 desireWidth += getPaddingLeft() + getPaddingRight();
 desireHeight += getPaddingTop() + getPaddingBottom();

 // see if the size is big enough
 desireWidth = Math.max(desireWidth, getSuggestedMinimumWidth());
 desireHeight = Math.max(desireHeight, getSuggestedMinimumHeight());

 setMeasuredDimension(resolveSize(desireWidth, widthMeasureSpec),
   resolveSize(desireHeight, heightMeasureSpec));
}


我們計(jì)算出所有Visilibity不是Gone的View的寬度的總和作為viewgroup的最大寬度,以及這些view中的最高的一個(gè)作為viewgroup的高度。這里需要注意的是要考慮咱們viewgroup自己的padding。(目前先忽略子View的margin)。
onLayout():

@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
 final int parentLeft = getPaddingLeft();
 final int parentRight = r - l - getPaddingRight();
 final int parentTop = getPaddingTop();
 final int parentBottom = b - t - getPaddingBottom();

 if (BuildConfig.DEBUG)
  Log.d("onlayout", "parentleft: " + parentLeft + " parenttop: "
    + parentTop + " parentright: " + parentRight
    + " parentbottom: " + parentBottom);

 int left = parentLeft;
 int top = parentTop;

 int count = getChildCount();
 for (int i = 0; i < count; ++i) {
  View v = getChildAt(i);
  if (v.getVisibility() != View.GONE) {
   final int childWidth = v.getMeasuredWidth();
   final int childHeight = v.getMeasuredHeight();
    v.layout(left, top, left + childWidth, top + childHeight);
    left += childWidth;
  }
 }
}


上面的layout方法寫的比較簡(jiǎn)單,就是簡(jiǎn)單的計(jì)算出每個(gè)子View的left值,然后調(diào)用view的layout方法即可。
現(xiàn)在我們加上xml布局文件,來看一下效果:

<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.testslidelistview.SlideGroup
  android:id="@+id/sl"
  android:layout_width="match_parent"
  android:layout_height="500dp"
  android:layout_marginTop="50dp"
  android:background="#FFFF00" >

  <ImageView
   android:id="@+id/iv1"
   android:layout_width="150dp"
   android:layout_height="300dp"
   android:scaleType="fitXY"
   android:src="@drawable/lead_page_1" />

  <ImageView
   android:layout_width="150dp"
   android:layout_height="300dp"
   android:scaleType="fitXY"
   android:src="@drawable/lead_page_2" />

  <ImageView
   android:layout_width="150dp"
   android:layout_height="300dp"
   android:scaleType="fitXY"
   android:src="@drawable/lead_page_3" />
 </com.example.testslidelistview.SlideGroup>

</LinearLayout>


效果圖如下:

2016520144858588.jpg (270×480)

從效果圖中我們看到,3個(gè)小圖連在一起(因?yàn)楝F(xiàn)在不支持margin),然后我們也沒辦法讓他們垂直居中(因?yàn)楝F(xiàn)在還不支持gravity)。

現(xiàn)在我們首先為咱們的ViewGroup增加一個(gè)支持margin和gravity的LayoutParams。

@Override
 protected android.view.ViewGroup.LayoutParams generateDefaultLayoutParams() {
  return new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
    ViewGroup.LayoutParams.MATCH_PARENT);
 }

 @Override
 public android.view.ViewGroup.LayoutParams generateLayoutParams(
   AttributeSet attrs) {
  return new LayoutParams(getContext(), attrs);
 }

 @Override
 protected android.view.ViewGroup.LayoutParams generateLayoutParams(
   android.view.ViewGroup.LayoutParams p) {
  return new LayoutParams(p);
 }

 public static class LayoutParams extends MarginLayoutParams {
  public int gravity = -1;

  public LayoutParams(Context c, AttributeSet attrs) {
   super(c, attrs);

   TypedArray ta = c.obtainStyledAttributes(attrs,
     R.styleable.SlideGroup);

   gravity = ta.getInt(R.styleable.SlideGroup_layout_gravity, -1);

   ta.recycle();
  }

  public LayoutParams(int width, int height) {
   this(width, height, -1);
  }

  public LayoutParams(int width, int height, int gravity) {
   super(width, height);
   this.gravity = gravity;
  }

  public LayoutParams(android.view.ViewGroup.LayoutParams source) {
   super(source);
  }

  public LayoutParams(MarginLayoutParams source) {
   super(source);
  }
 }


xml的自定義屬性如下:

<?xml version="1.0" encoding="utf-8"?>
<resources>
 <attr name="layout_gravity">
  <!-- Push object to the top of its container, not changing its size. -->
  <flag name="top" value="0x30" />
  <!-- Push object to the bottom of its container, not changing its size. -->
  <flag name="bottom" value="0x50" />
  <!-- Push object to the left of its container, not changing its size. -->
  <flag name="left" value="0x03" />
  <!-- Push object to the right of its container, not changing its size. -->
  <flag name="right" value="0x05" />
  <!-- Place object in the vertical center of its container, not changing its size. -->
  <flag name="center_vertical" value="0x10" />
  <!-- Place object in the horizontal center of its container, not changing its size. -->
  <flag name="center_horizontal" value="0x01" />
 </attr>
 
 <declare-styleable name="SlideGroup">
  <attr name="layout_gravity" />
 </declare-styleable>
</resources>


現(xiàn)在基本的準(zhǔn)備工作差不多了,然后需要修改一下onMeasure()和onLayout()。
onMeasure():(上一個(gè)版本,我們?cè)谟?jì)算最大寬度和高度時(shí)忽略了margin)

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
 // 計(jì)算所有child view 要占用的空間
 desireWidth = 0;
 desireHeight = 0;
 int count = getChildCount();
 for (int i = 0; i < count; ++i) {
  View v = getChildAt(i);
  if (v.getVisibility() != View.GONE) {

   LayoutParams lp = (LayoutParams) v.getLayoutParams();
   //將measureChild改為measureChildWithMargin
   measureChildWithMargins(v, widthMeasureSpec, 0,
     heightMeasureSpec, 0);
   //這里在計(jì)算寬度時(shí)加上margin
   desireWidth += v.getMeasuredWidth() + lp.leftMargin + lp.rightMargin;
   desireHeight = Math
     .max(desireHeight, v.getMeasuredHeight() + lp.topMargin + lp.bottomMargin);
  }
 }

 // count with padding
 desireWidth += getPaddingLeft() + getPaddingRight();
 desireHeight += getPaddingTop() + getPaddingBottom();

 // see if the size is big enough
 desireWidth = Math.max(desireWidth, getSuggestedMinimumWidth());
 desireHeight = Math.max(desireHeight, getSuggestedMinimumHeight());

 setMeasuredDimension(resolveSize(desireWidth, widthMeasureSpec),
   resolveSize(desireHeight, heightMeasureSpec));
}


onLayout()(加上margin和gravity)

@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
 final int parentLeft = getPaddingLeft();
 final int parentRight = r - l - getPaddingRight();
 final int parentTop = getPaddingTop();
 final int parentBottom = b - t - getPaddingBottom();

 if (BuildConfig.DEBUG)
  Log.d("onlayout", "parentleft: " + parentLeft + " parenttop: "
    + parentTop + " parentright: " + parentRight
    + " parentbottom: " + parentBottom);

 int left = parentLeft;
 int top = parentTop;

 int count = getChildCount();
 for (int i = 0; i < count; ++i) {
  View v = getChildAt(i);
  if (v.getVisibility() != View.GONE) {
   LayoutParams lp = (LayoutParams) v.getLayoutParams();
   final int childWidth = v.getMeasuredWidth();
   final int childHeight = v.getMeasuredHeight();
   final int gravity = lp.gravity;
   final int horizontalGravity = gravity
     & Gravity.HORIZONTAL_GRAVITY_MASK;
   final int verticalGravity = gravity
     & Gravity.VERTICAL_GRAVITY_MASK;

   left += lp.leftMargin;
   top = parentTop + lp.topMargin;
   if (gravity != -1) {
    switch (verticalGravity) {
    case Gravity.TOP:
     break;
    case Gravity.CENTER_VERTICAL:
     top = parentTop
       + (parentBottom - parentTop - childHeight)
       / 2 + lp.topMargin - lp.bottomMargin;
     break;
    case Gravity.BOTTOM:
     top = parentBottom - childHeight - lp.bottomMargin;
     break;
    }
   }

   if (BuildConfig.DEBUG) {
    Log.d("onlayout", "child[width: " + childWidth
      + ", height: " + childHeight + "]");
    Log.d("onlayout", "child[left: " + left + ", top: "
      + top + ", right: " + (left + childWidth)
      + ", bottom: " + (top + childHeight));
   }
   v.layout(left, top, left + childWidth, top + childHeight);
   left += childWidth + lp.rightMargin;
   
  }
 }
}


現(xiàn)在修改一下xml布局文件,加上例如xmlns:ly="http://schemas.android.com/apk/res-auto",的xml命名空間,來引用我們?cè)O(shè)置的layout_gravity屬性。(這里的“res-auto”其實(shí)還可以使用res/com/example/testslidelistview來代替,但是前一種方法相對(duì)簡(jiǎn)單,尤其是當(dāng)你將某個(gè)ui組件作為library來使用的時(shí)候)
現(xiàn)在的效果圖如下:有了margin,有了gravity。

2016520145018412.jpg (270×480)

其實(shí)在這個(gè)基礎(chǔ)上,我們可以很容易的添加一個(gè)方向?qū)傩裕沟盟梢酝ㄟ^設(shè)置一個(gè)xml屬性或者一個(gè)java api調(diào)用來實(shí)現(xiàn)垂直排列。

下面我們?cè)黾右粋€(gè)用于表示方向的枚舉類型:

public static enum Orientation {
  HORIZONTAL(0), VERTICAL(1);
  
  private int value;
  private Orientation(int i) {
   value = i;
  }
  public int value() {
   return value;
  }
  public static Orientation valueOf(int i) {
   switch (i) {
   case 0:
    return HORIZONTAL;
   case 1:
    return VERTICAL;
   default:
    throw new RuntimeException("[0->HORIZONTAL, 1->VERTICAL]");
   }
  }
 }


然后我們需要改變onMeasure(),來正確的根據(jù)方向計(jì)算需要的最大寬度和高度。

@Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  // 計(jì)算所有child view 要占用的空間
  desireWidth = 0;
  desireHeight = 0;
  int count = getChildCount();
  for (int i = 0; i < count; ++i) {
   View v = getChildAt(i);
   if (v.getVisibility() != View.GONE) {
    LayoutParams lp = (LayoutParams) v.getLayoutParams();
    measureChildWithMargins(v, widthMeasureSpec, 0,
      heightMeasureSpec, 0);

    //只是在這里增加了垂直或者水平方向的判斷
    if (orientation == Orientation.HORIZONTAL) {
     desireWidth += v.getMeasuredWidth() + lp.leftMargin
       + lp.rightMargin;
     desireHeight = Math.max(desireHeight, v.getMeasuredHeight()
       + lp.topMargin + lp.bottomMargin);
    } else {
     desireWidth = Math.max(desireWidth, v.getMeasuredWidth()
       + lp.leftMargin + lp.rightMargin);
     desireHeight += v.getMeasuredHeight() + lp.topMargin
       + lp.bottomMargin;
    }
   }
  }

  // count with padding
  desireWidth += getPaddingLeft() + getPaddingRight();
  desireHeight += getPaddingTop() + getPaddingBottom();

  // see if the size is big enough
  desireWidth = Math.max(desireWidth, getSuggestedMinimumWidth());
  desireHeight = Math.max(desireHeight, getSuggestedMinimumHeight());

  setMeasuredDimension(resolveSize(desireWidth, widthMeasureSpec),
    resolveSize(desireHeight, heightMeasureSpec));
 }


onLayout():

@Override
 protected void onLayout(boolean changed, int l, int t, int r, int b) {
  final int parentLeft = getPaddingLeft();
  final int parentRight = r - l - getPaddingRight();
  final int parentTop = getPaddingTop();
  final int parentBottom = b - t - getPaddingBottom();

  if (BuildConfig.DEBUG)
   Log.d("onlayout", "parentleft: " + parentLeft + " parenttop: "
     + parentTop + " parentright: " + parentRight
     + " parentbottom: " + parentBottom);

  int left = parentLeft;
  int top = parentTop;

  int count = getChildCount();
  for (int i = 0; i < count; ++i) {
   View v = getChildAt(i);
   if (v.getVisibility() != View.GONE) {
    LayoutParams lp = (LayoutParams) v.getLayoutParams();
    final int childWidth = v.getMeasuredWidth();
    final int childHeight = v.getMeasuredHeight();
    final int gravity = lp.gravity;
    final int horizontalGravity = gravity
      & Gravity.HORIZONTAL_GRAVITY_MASK;
    final int verticalGravity = gravity
      & Gravity.VERTICAL_GRAVITY_MASK;

    if (orientation == Orientation.HORIZONTAL) {
     // layout horizontally, and only consider vertical gravity

     left += lp.leftMargin;
     top = parentTop + lp.topMargin;
     if (gravity != -1) {
      switch (verticalGravity) {
      case Gravity.TOP:
       break;
      case Gravity.CENTER_VERTICAL:
       top = parentTop
         + (parentBottom - parentTop - childHeight)
         / 2 + lp.topMargin - lp.bottomMargin;
       break;
      case Gravity.BOTTOM:
       top = parentBottom - childHeight - lp.bottomMargin;
       break;
      }
     }

     if (BuildConfig.DEBUG) {
      Log.d("onlayout", "child[width: " + childWidth
        + ", height: " + childHeight + "]");
      Log.d("onlayout", "child[left: " + left + ", top: "
        + top + ", right: " + (left + childWidth)
        + ", bottom: " + (top + childHeight));
     }
     v.layout(left, top, left + childWidth, top + childHeight);
     left += childWidth + lp.rightMargin;
    } else {
     // layout vertical, and only consider horizontal gravity

     left = parentLeft;
     top += lp.topMargin;
     switch (horizontalGravity) {
     case Gravity.LEFT:
      break;
     case Gravity.CENTER_HORIZONTAL:
      left = parentLeft
        + (parentRight - parentLeft - childWidth) / 2
        + lp.leftMargin - lp.rightMargin;
      break;
     case Gravity.RIGHT:
      left = parentRight - childWidth - lp.rightMargin;
      break;
     }
     v.layout(left, top, left + childWidth, top + childHeight);
     top += childHeight + lp.bottomMargin;
    }
   }
  }
 }


現(xiàn)在我們可以增加一個(gè)xml屬性:

<attr name="orientation">
   <enum name="horizontal" value="0" />
   <enum name="vertical" value="1" />
</attr>


現(xiàn)在就可以在布局文件中加入ly:orientation="vertical"來實(shí)現(xiàn)垂直排列了(ly是自定義的xml命名空間)
布局文件如下:

<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.testslidelistview.SlideGroup
  xmlns:gs="http://schemas.android.com/apk/res-auto"
  android:id="@+id/sl"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:layout_marginTop="50dp"
  android:background="#FFFF00" >

  <ImageView
   android:id="@+id/iv1"
   android:layout_width="300dp"
   android:layout_height="200dp"
   android:layout_marginBottom="20dp"
   gs:layout_gravity="left"
   android:scaleType="fitXY"
   android:src="@drawable/lead_page_1" />

  <ImageView
   android:layout_width="300dp"
   android:layout_height="200dp"
   android:layout_marginBottom="20dp"
   gs:layout_gravity="center_horizontal"
   android:scaleType="fitXY"
   android:src="@drawable/lead_page_2" />

  <ImageView
   android:layout_width="300dp"
   android:layout_height="200dp"
   android:layout_marginBottom="20dp"
   gs:layout_gravity="right"
   android:scaleType="fitXY"
   android:src="@drawable/lead_page_3" />
 </com.example.testslidelistview.SlideGroup>

</LinearLayout>


現(xiàn)在效果圖如下:

2016520145127069.jpg (270×480)

重寫onTouchEvent()以支持滑動(dòng):

要使View滑動(dòng),我們可以通過調(diào)用scrollTo()和scrollBy()來實(shí)現(xiàn),這里需要注意的是:要使頁面向左移動(dòng),需要增加mScrollX(就是向scrollBy傳遞一個(gè)正數(shù)),同樣的,要使頁面向上移動(dòng),需要增加mScrollY。

@Override
public boolean onTouchEvent(MotionEvent event) {
 final int action = event.getAction();

 if (BuildConfig.DEBUG)
  Log.d("onTouchEvent", "action: " + action);

 switch (action) {
 case MotionEvent.ACTION_DOWN:
  x = event.getX();
  y = event.getY();
  break;
 case MotionEvent.ACTION_MOVE:
  float mx = event.getX();
  float my = event.getY();

  //此處的moveBy是根據(jù)水平或是垂直排放的方向,
  //來選擇是水平移動(dòng)還是垂直移動(dòng)
  moveBy((int) (x - mx), (int) (y - my));

  x = mx;
  y = my;
  break;
 
 }
 return true;
}

//此處的moveBy是根據(jù)水平或是垂直排放的方向,
//來選擇是水平移動(dòng)還是垂直移動(dòng)
public void moveBy(int deltaX, int deltaY) {
 if (BuildConfig.DEBUG)
  Log.d("moveBy", "deltaX: " + deltaX + " deltaY: " + deltaY);
 if (orientation == Orientation.HORIZONTAL) {
  if (Math.abs(deltaX) >= Math.abs(deltaY))
   scrollBy(deltaX, 0);
 } else {
  if (Math.abs(deltaY) >= Math.abs(deltaX))
   scrollBy(0, deltaY);
 }
}



好,現(xiàn)在我們?cè)龠\(yùn)行這段代碼,就會(huì)發(fā)現(xiàn)View已經(jīng)可以跟隨手指移動(dòng)了,但現(xiàn)在的問題是當(dāng)手指離開屏幕后,View就立即停止滑動(dòng)了,這樣的體驗(yàn)就相當(dāng)不友好,那么我們希望手指離開后,View能夠以一定的阻尼滿滿地減速滑動(dòng)。

借助Scroller,并且處理ACTION_UP事件

Scroller是一個(gè)用于計(jì)算位置的工具類,它負(fù)責(zé)計(jì)算下一個(gè)位置的坐標(biāo)(根據(jù)時(shí)長(zhǎng),最小以最大移動(dòng)距離,以及阻尼算法(可以使用自定義的Interpolator))。

Scroller有兩種模式:scroll和fling。


scroll用于已知目標(biāo)位置的情況(例如:Viewpager中向左滑動(dòng),就是要展示右邊的一頁,那么我們就可以準(zhǔn)確計(jì)算出滑動(dòng)的目標(biāo)位置,此時(shí)就可以使用Scroller.startScroll()方法)
fling用于不能準(zhǔn)確得知目標(biāo)位置的情況(例如:ListView,每一次的滑動(dòng),我們事先都不知道滑動(dòng)距離,而是根據(jù)手指抬起是的速度來判斷是滑遠(yuǎn)一點(diǎn)還是近一點(diǎn),這時(shí)就可以使用Scroller.fling()方法)
現(xiàn)在我們改一下上面的onTouchEvent()方法,增加對(duì)ACTION_UP事件的處理,以及初速度的計(jì)算。

@Override
public boolean onTouchEvent(MotionEvent event) {
 final int action = event.getAction();

 if (BuildConfig.DEBUG)
  Log.d("onTouchEvent", "action: " + action);

 //將事件加入到VelocityTracker中,用于計(jì)算手指抬起時(shí)的初速度
 if (velocityTracker == null) {
  velocityTracker = VelocityTracker.obtain();
 }
 velocityTracker.addMovement(event);

 switch (action) {
 case MotionEvent.ACTION_DOWN:
  x = event.getX();
  y = event.getY();
  if (!mScroller.isFinished())
   mScroller.abortAnimation();
  break;
 case MotionEvent.ACTION_MOVE:
  float mx = event.getX();
  float my = event.getY();

  moveBy((int) (x - mx), (int) (y - my));

  x = mx;
  y = my;
  break;
 case MotionEvent.ACTION_UP:
  //maxFlingVelocity是通過ViewConfiguration來獲取的初速度的上限
  //這個(gè)值可能會(huì)因?yàn)槠聊坏牟煌煌?
  velocityTracker.computeCurrentVelocity(1000, maxFlingVelocity);
  float velocityX = velocityTracker.getXVelocity();
  float velocityY = velocityTracker.getYVelocity();

  //用來處理實(shí)際的移動(dòng)
  completeMove(-velocityX, -velocityY);
  if (velocityTracker != null) {
   velocityTracker.recycle();
   velocityTracker = null;
  }
  break;
 return true;
}


我們?cè)赾omputeMove()中調(diào)用Scroller的fling()方法,順便考慮一下滑動(dòng)方向問題

private void completeMove(float velocityX, float velocityY) {
 if (orientation == Orientation.HORIZONTAL) {
  int mScrollX = getScrollX();
  int maxX = desireWidth - getWidth();// - Math.abs(mScrollX);

  if (Math.abs(velocityX) >= minFlingVelocity && maxX > 0) {
   
   mScroller.fling(mScrollX, 0, (int) velocityX, 0, 0, maxX, 0, 0);
   invalidate();
  }
 } else {
  int mScrollY = getScrollY();
  int maxY = desireHeight - getHeight();// - Math.abs(mScrollY);

  if (Math.abs(velocityY) >= minFlingVelocity && maxY > 0) {
   
   mScroller.fling(0, mScrollY, 0, (int) velocityY, 0, 0, 0, maxY);
   invalidate();
  }
 }
}


好了,現(xiàn)在我們?cè)龠\(yùn)行一遍,問題又來了,手指抬起后,頁面立刻又停了下來,并沒有實(shí)現(xiàn)慢慢減速的滑動(dòng)效果。

其實(shí)原因就是上面所說的,Scroller只是幫助我們計(jì)算位置的,并不處理View的滑動(dòng)。我們要想實(shí)現(xiàn)連續(xù)的滑動(dòng)效果,那就要在View繪制完成后,再通過Scroller獲得新位置,然后再重繪,如此反復(fù),直至停止。

重寫computeScroll(),實(shí)現(xiàn)View的連續(xù)繪制

@Override
public void computeScroll() {
 if (mScroller.computeScrollOffset()) {
  if (orientation == Orientation.HORIZONTAL) {
   scrollTo(mScroller.getCurrX(), 0);
   postInvalidate();
  } else {
   scrollTo(0, mScroller.getCurrY());
   postInvalidate();
  }
 }
}


computeScroll()是在ViewGroup的drawChild()中調(diào)用的,上面的代碼中,我們通過調(diào)用computeScrollOffset()來判斷滑動(dòng)是否已停止,如果沒有,那么我們可以通過getCurrX()和getCurrY()來獲得新位置,然后通過調(diào)用scrollTo()來實(shí)現(xiàn)滑動(dòng),這里需要注意的是postInvalidate()的調(diào)用,它會(huì)將重繪的這個(gè)Event加入U(xiǎn)I線程的消息隊(duì)列,等scrollTo()執(zhí)行完成后,就會(huì)處理這個(gè)事件,然后再次調(diào)用ViewGroup的draw()-->drawChild()-->computeScroll()-->scrollTo()如此就實(shí)現(xiàn)了連續(xù)繪制的效果。

現(xiàn)在我們?cè)僦匦逻\(yùn)行一下app,終于可以持續(xù)滑動(dòng)了:),不過,當(dāng)我們緩慢地拖動(dòng)View,慢慢抬起手指,我們會(huì)發(fā)現(xiàn)通過這樣的方式,可以使得所有的子View滑到屏幕之外,(所有的子View都消失了:()。

問題主要是出在completeMove()中,我們只是判斷了初始速度是否大于最小閾值,如果小于這個(gè)最小閾值的話就什么都不做,缺少了邊界的判斷,因此修改computeMove()如下:

private void completeMove(float velocityX, float velocityY) {
 if (orientation == Orientation.HORIZONTAL) {
  int mScrollX = getScrollX();
  int maxX = desireWidth - getWidth();
  if (mScrollX > maxX) {
   // 超出了右邊界,彈回
   mScroller.startScroll(mScrollX, 0, maxX - mScrollX, 0);
   invalidate();
  } else if (mScrollX < 0) {
   // 超出了左邊界,彈回
   mScroller.startScroll(mScrollX, 0, -mScrollX, 0);
   invalidate();
  } else if (Math.abs(velocityX) >= minFlingVelocity && maxX > 0) {
   mScroller.fling(mScrollX, 0, (int) velocityX, 0, 0, maxX, 0, 0);
   invalidate();
  }
 } else {
  int mScrollY = getScrollY();
  int maxY = desireHeight - getHeight();

  if (mScrollY > maxY) {
   // 超出了下邊界,彈回
   mScroller.startScroll(0, mScrollY, 0, maxY - mScrollY);
   invalidate();
  } else if (mScrollY < 0) {
   // 超出了上邊界,彈回
   mScroller.startScroll(0, mScrollY, 0, -mScrollY);
   invalidate();
  } else if (Math.abs(velocityY) >= minFlingVelocity && maxY > 0) {
   mScroller.fling(0, mScrollY, 0, (int) velocityY, 0, 0, 0, maxY);
   invalidate();
  }
 }
}

ok,現(xiàn)在當(dāng)我們滑出邊界,松手后,會(huì)自動(dòng)彈回。

處理ACTION_POINTER_UP事件,解決多指交替滑動(dòng)跳動(dòng)的問題

現(xiàn)在ViewGroup可以靈活的滑動(dòng)了,但是當(dāng)我們使用多個(gè)指頭交替滑動(dòng)時(shí),就會(huì)產(chǎn)生跳動(dòng)的現(xiàn)象。原因是這樣的:

我們實(shí)現(xiàn)onTouchEvent()的時(shí)候,是通過event.getX(),以及event.getY()來獲取觸摸坐標(biāo)的,實(shí)際上是獲取的手指索引為0的位置坐標(biāo),當(dāng)我們放上第二個(gè)手指后,這第二個(gè)手指的索引為1,此時(shí)我們同時(shí)滑動(dòng)這兩個(gè)手指,會(huì)發(fā)現(xiàn)沒有問題,因?yàn)槲覀冏粉櫟氖鞘种杆饕秊?的手指位置。但是當(dāng)我們抬起第一個(gè)手指后,問題就出現(xiàn)了, 因?yàn)檫@個(gè)時(shí)候原本索引為1的第二個(gè)手指的索引變?yōu)榱?,所以我們追蹤的軌跡就出現(xiàn)了錯(cuò)誤。

簡(jiǎn)單來說,跳動(dòng)就是因?yàn)樽粉櫟氖种傅母淖?,而這兩個(gè)手指之間原本存在間隙,而這個(gè)間隙的距離就是我們跳動(dòng)的距離。

其實(shí)問題產(chǎn)生的根本原因就是手指的索引會(huì)變化,因此我們需要記錄被追蹤手指的id,然后當(dāng)有手指離開屏幕時(shí),判斷離開的手指是否是我們正在追蹤的手指:

如果不是,忽略;
如果是,則選擇一個(gè)新的手指作為被追蹤手指,并且調(diào)整位置記錄。
還有一點(diǎn)就是,要處理ACTION_POINTER_UP事件,就需要給action與上一個(gè)掩碼:event.getAction()&MotionEvent.ACTION_MASK 或者使用 event.getActionMasked()方法。

更改后的onTouchEvent()的實(shí)現(xiàn)如下:

@Override
public boolean onTouchEvent(MotionEvent event) {
 final int action = event.getActionMasked();

 if (velocityTracker == null) {
  velocityTracker = VelocityTracker.obtain();
 }
 velocityTracker.addMovement(event);

 switch (action) {
 case MotionEvent.ACTION_DOWN:
  // 獲取索引為0的手指id
  mPointerId = event.getPointerId(0);
  x = event.getX();
  y = event.getY();
  if (!mScroller.isFinished())
   mScroller.abortAnimation();
  break;
 case MotionEvent.ACTION_MOVE:
  // 獲取當(dāng)前手指id所對(duì)應(yīng)的索引,雖然在ACTION_DOWN的時(shí)候,我們默認(rèn)選取索引為0
  // 的手指,但當(dāng)有第二個(gè)手指觸摸,并且先前有效的手指up之后,我們會(huì)調(diào)整有效手指

  // 屏幕上可能有多個(gè)手指,我們需要保證使用的是同一個(gè)手指的移動(dòng)軌跡,
  // 因此此處不能使用event.getActionIndex()來獲得索引
  final int pointerIndex = event.findPointerIndex(mPointerId);
  float mx = event.getX(pointerIndex);
  float my = event.getY(pointerIndex);

  moveBy((int) (x - mx), (int) (y - my));

  x = mx;
  y = my;
  break;
 case MotionEvent.ACTION_UP:
  velocityTracker.computeCurrentVelocity(1000, maxFlingVelocity);
  float velocityX = velocityTracker.getXVelocity(mPointerId);
  float velocityY = velocityTracker.getYVelocity(mPointerId);

  completeMove(-velocityX, -velocityY);
  if (velocityTracker != null) {
   velocityTracker.recycle();
   velocityTracker = null;
  }
  break;
 
 case MotionEvent.ACTION_POINTER_UP:
  // 獲取離開屏幕的手指的索引
  int pointerIndexLeave = event.getActionIndex();
  int pointerIdLeave = event.getPointerId(pointerIndexLeave);
  if (mPointerId == pointerIdLeave) {
   // 離開屏幕的正是目前的有效手指,此處需要重新調(diào)整,并且需要重置VelocityTracker
   int reIndex = pointerIndexLeave == 0 ? 1 : 0;
   mPointerId = event.getPointerId(reIndex);
   // 調(diào)整觸摸位置,防止出現(xiàn)跳動(dòng)
   x = event.getX(reIndex);
   y = event.getY(reIndex);
   if (velocityTracker != null)
    velocityTracker.clear();
  }
   break;
  }
 return true;
}


好了,現(xiàn)在我們用多個(gè)手指交替滑動(dòng)就很正常了。
我們解決了多個(gè)手指交替滑動(dòng)帶來的頁面的跳動(dòng)問題。但同時(shí)也還遺留了兩個(gè)問題。

我們自定義的這個(gè)ViewGroup本身還不支持onClick, onLongClick事件。
當(dāng)我們給子View設(shè)置click事件后,我們的ViewGroup居然不能滑動(dòng)了。
相對(duì)來講,第一個(gè)問題稍稍容易處理一點(diǎn),這里我們先說一下第二個(gè)問題。

onInterceptTouchEvent()的作用以及何時(shí)會(huì)被調(diào)用

onInterceptTouchEvent()是用來給ViewGroup自己一個(gè)攔截事件的機(jī)會(huì),當(dāng)ViewGroup意識(shí)到某個(gè)Touch事件應(yīng)該由自己處理,那么就可以通過此方法來阻止事件被分發(fā)到子View中。

為什么onInterceptTouchEvent()方法只接收到來ACTION_DOWN事件??需要處理ACTION_MOVE,ACTION_UP等等事件嗎??

按照google官方文檔的說明:

如果onInterceptTouchEvent方法返回true,那么它將不會(huì)收到后續(xù)事件,事件將會(huì)直接傳遞給目標(biāo)的onTouchEvent方法(其實(shí)會(huì)先傳給目標(biāo)的onTouch方法);
如果onInterceptTouchEvent方法返回false,那么所有的后續(xù)事件都會(huì)先傳給onInterceptTouchEvent,然后再傳給目標(biāo)的onTouchEvent方法。
但是,為什么我們?cè)趏nInterceptTouchEvent方法中返回false之后,卻收不到后續(xù)的事件呢??通過實(shí)驗(yàn)以及stackoverflow上面的一些問答得知,當(dāng)我們?cè)趏nInterceptTouchEvent()方法中返回false,且子View的onTouchEvent返回true的情況下,onInterceptTouchEvent方法才會(huì)收到后續(xù)的事件。

雖然這個(gè)結(jié)果與官方文檔的說法有點(diǎn)不同,但實(shí)驗(yàn)說明是正確的。仔細(xì)想想這樣的邏輯也確實(shí)非常合理:因?yàn)閛nInterceptTouchEvent方法是用來攔截觸摸事件,防止被子View捕獲。那么現(xiàn)在子View在onTouchEvent中返回false,明確聲明自己不會(huì)處理這個(gè)觸摸事件,那么這個(gè)時(shí)候還需要攔截嗎?當(dāng)然就不需要了,因此onInterceptTouchEvent不需要攔截這個(gè)事件,那也就沒有必要將后續(xù)事件再傳給它了。

還有就是onInterceptTouchEvent()被調(diào)用的前提是它的子View沒有調(diào)用requestDisallowInterceptTouchEvent(true)方法(這個(gè)方法用于阻止ViewGroup攔截事件)。

ViewGroup的onInterceptTouchEvent方法,onTouchEvent方法以及View的onTouchEvent方法之間的事件傳遞流程

畫了一個(gè)簡(jiǎn)單的圖,如下:

2016520145306416.png (612×539)

其中:Intercept指的是onInterceptTouchEvent()方法,Touch指的是onTouchEvent()方法。

好了,現(xiàn)在我們可以解決博客開頭列出的第二個(gè)問題了,之所以為子View設(shè)置click之后,我們的ViewGroup方法無法滑動(dòng),是因?yàn)?,子View在接受到ACTION_DOWN事件后返回true,并且ViewGroup的onInterceptTouchEvent()方法的默認(rèn)實(shí)現(xiàn)是返回false(就是完全不攔截),所以后續(xù)的ACTION_MOVE,ACTION_UP事件都傳遞給了子View,因此我們的ViewGroup自然就無法滑動(dòng)了。

解決方法就是重寫onInterceptTouchEvent方法:

/**
  * onInterceptTouchEvent()用來詢問是否要攔截處理。 onTouchEvent()是用來進(jìn)行處理。
  * 
  * 例如:parentLayout----childLayout----childView 事件的分發(fā)流程:
  * parentLayout::onInterceptTouchEvent()---false?--->
  * childLayout::onInterceptTouchEvent()---false?--->
  * childView::onTouchEvent()---false?--->
  * childLayout::onTouchEvent()---false?---> parentLayout::onTouchEvent()
  * 
  * 
  * 
  * 如果onInterceptTouchEvent()返回false,且分發(fā)的子View的onTouchEvent()中返回true,
  * 那么onInterceptTouchEvent()將收到所有的后續(xù)事件。
  * 
  * 如果onInterceptTouchEvent()返回true,原本的target將收到ACTION_CANCEL,該事件
  * 將會(huì)發(fā)送給我們自己的onTouchEvent()。
  */
 @Override
 public boolean onInterceptTouchEvent(MotionEvent ev) {
  final int action = ev.getActionMasked();
  if (BuildConfig.DEBUG)
   Log.d("onInterceptTouchEvent", "action: " + action);

  if (action == MotionEvent.ACTION_DOWN && ev.getEdgeFlags() != 0) {
   // 該事件可能不是我們的
   return false;
  }

  boolean isIntercept = false;
  switch (action) {
  case MotionEvent.ACTION_DOWN:
   // 如果動(dòng)畫還未結(jié)束,則將此事件交給onTouchEvet()處理,
   // 否則,先分發(fā)給子View
   isIntercept = !mScroller.isFinished();
   // 如果此時(shí)不攔截ACTION_DOWN時(shí)間,應(yīng)該記錄下觸摸地址及手指id,當(dāng)我們決定攔截ACTION_MOVE的event時(shí),
   // 將會(huì)需要這些初始信息(因?yàn)槲覀兊膐nTouchEvent將可能接收不到ACTION_DOWN事件)
   mPointerId = ev.getPointerId(0);
// if (!isIntercept) {
   downX = x = ev.getX();
   downY = y = ev.getY();
// }
   break;
  case MotionEvent.ACTION_MOVE:
   int pointerIndex = ev.findPointerIndex(mPointerId);
   if (BuildConfig.DEBUG)
    Log.d("onInterceptTouchEvent", "pointerIndex: " + pointerIndex
      + ", pointerId: " + mPointerId);
   float mx = ev.getX(pointerIndex);
   float my = ev.getY(pointerIndex);

   if (BuildConfig.DEBUG)
    Log.d("onInterceptTouchEvent", "action_move [touchSlop: "
      + mTouchSlop + ", deltaX: " + (x - mx) + ", deltaY: "
      + (y - my) + "]");

   // 根據(jù)方向進(jìn)行攔截,(其實(shí)這樣,如果我們的方向是水平的,里面有一個(gè)ScrollView,那么我們是支持嵌套的)
   if (orientation == Orientation.HORIZONTAL) {
    if (Math.abs(x - mx) >= mTouchSlop) {
     // we get a move event for ourself
     isIntercept = true;
    }
   } else {
    if (Math.abs(y - my) >= mTouchSlop) {
     isIntercept = true;
    }
   }

   //如果不攔截的話,我們不會(huì)更新位置,這樣可以通過累積小的移動(dòng)距離來判斷是否達(dá)到可以認(rèn)為是Move的閾值。
   //這里當(dāng)產(chǎn)生攔截的話,會(huì)更新位置(這樣相當(dāng)于損失了mTouchSlop的移動(dòng)距離,如果不更新,可能會(huì)有一點(diǎn)點(diǎn)跳的感覺)
   if (isIntercept) {
    x = mx;
    y = my;
   }
   break;
  case MotionEvent.ACTION_CANCEL:
  case MotionEvent.ACTION_UP:
   // 這是觸摸的最后一個(gè)事件,無論如何都不會(huì)攔截
   if (velocityTracker != null) {
    velocityTracker.recycle();
    velocityTracker = null;
   }
   break;
  case MotionEvent.ACTION_POINTER_UP:
   solvePointerUp(ev);
   break;
  }
  return isIntercept;
 }

private void solvePointerUp(MotionEvent event) {
  // 獲取離開屏幕的手指的索引
  int pointerIndexLeave = event.getActionIndex();
  int pointerIdLeave = event.getPointerId(pointerIndexLeave);
  if (mPointerId == pointerIdLeave) {
   // 離開屏幕的正是目前的有效手指,此處需要重新調(diào)整,并且需要重置VelocityTracker
   int reIndex = pointerIndexLeave == 0 ? 1 : 0;
   mPointerId = event.getPointerId(reIndex);
   // 調(diào)整觸摸位置,防止出現(xiàn)跳動(dòng)
   x = event.getX(reIndex);
   y = event.getY(reIndex);
   if (velocityTracker != null)
    velocityTracker.clear();
  }
 }


現(xiàn)在再運(yùn)行app,問題應(yīng)該解決了。
onTouchEvent收到ACTION_DOWN,是否一定能收到ACTION_MOVE,ACTION_UP...???     收到了ACTION_MOVE,能否說明它已經(jīng)收到過ACTION_DOWN???

其實(shí)根據(jù)上面所說的onInterceptTouchEvent方法與onTouchEvent方法之間事件傳遞的過程,我們知道這兩個(gè)問題的答案都是否定的。

對(duì)于第一個(gè),收到ACTION_DOWN事件后,ACTION_MOVE事件可能會(huì)被攔截,那么它將只能夠再收到一個(gè)ACTION_CANCEL事件。

對(duì)于第二個(gè),是基于上面的這一個(gè)情況,ACTION_DOWN傳遞給了子View,而onInterceptTouchEvent攔截了ACTION_MOVE事件,所以我們的onTouchEvent方法將會(huì)收到ACTION_MOVE,而不會(huì)收到ACTION_DOWN。(這也是為什么我在onInterceptTouchEvent方法的ACTION_DOWN中記錄下位置信息的原因)

還有一個(gè)問題就是,如果我們單純的在onTouchEvent中: 對(duì)于ACTION_DOWN返回true,在接收到ACTION_MOVE事件后返回false,那么這個(gè)時(shí)候事件會(huì)重新尋找能處理它的View嗎?不會(huì),所有的后續(xù)事件依然會(huì)發(fā)給這個(gè)onTouchEvent方法。


讓ViewGroup支持click事件

這里我們是在onTouchEvent中對(duì)于ACTION_UP多做了一些處理:

判斷從按下時(shí)的位置到現(xiàn)在的移動(dòng)距離是否小于可被識(shí)別為Move的閾值。
根據(jù)ACTION_DOWN和ACTION_UP之間的時(shí)間差,判斷是CLICK,還是LONG CLICK(這里當(dāng)沒有設(shè)置long click的話,我們也可將其認(rèn)為是click)

case MotionEvent.ACTION_UP:
   //先判斷是否是點(diǎn)擊事件
   final int pi = event.findPointerIndex(mPointerId);
   
   if((isClickable() || isLongClickable()) 
     && ((event.getX(pi) - downX) < mTouchSlop || (event.getY(pi) - downY) < mTouchSlop)) {
    //這里我們得到了一個(gè)點(diǎn)擊事件
    if(isFocusable() && isFocusableInTouchMode() && !isFocused())
     requestFocus();
    if(event.getEventTime() - event.getDownTime() >= ViewConfiguration.getLongPressTimeout() && isLongClickable()) {
     //是一個(gè)長(zhǎng)按事件
     performLongClick();
    } else {
     performClick();
    }
   } else {
    velocityTracker.computeCurrentVelocity(1000, maxFlingVelocity);
    float velocityX = velocityTracker.getXVelocity(mPointerId);
    float velocityY = velocityTracker.getYVelocity(mPointerId);
 
    completeMove(-velocityX, -velocityY);
    if (velocityTracker != null) {
     velocityTracker.recycle();
     velocityTracker = null;
    }
   }
   break;

相關(guān)文章

最新評(píng)論