自定义控件(视图)2期笔记12:View的滑动冲突之 外部拦截法

时间:2024-01-08 08:43:38

1. 外部拦截法:

点击事件通过父容器拦截处理,如果父容器需要就拦截,不需要就不拦截。

这种方法比较符合事件分发机制。外部拦截法需要重写父容器的onInterceptTouchEvent方法,在内部做相应的拦截即可。

这种方法的伪代码,如下:

 @Override
public boolean onInterceptTouchEvent(MotionEvent event) {
boolean intercepted = false;
int x = (int) event.getX();
int y = (int) event.getY(); switch (event.getAction()) {
case MotionEvent.ACTION_DOWN: {
intercepted = false;
break;
}
case MotionEvent.ACTION_MOVE: { if (父容器需要当前点击事件) {
intercepted = true;
} else {
intercepted = false;
}
break;
}
case MotionEvent.ACTION_UP: {
intercepted = false;
break;
}
default:
break;
} mLastXIntercept = x;
mLastYIntercept = y; return intercepted;
}

(1)在onInterceptTouchEvent方法之中,首先是ACTION_DOWN这个事件,父容器必须返回false,也就是不拦截ACTION_DOWN事件,因为一旦父容器拦截了ACTION_DOWN事件,那么后续的ACTION_MOVE 和 ACTION_UP这些事件会直接交给父容器处理,这个时候事件没有办法再传递给子元素;

(2)其次是ACTION_MOVE事件,这个事件可以根据需要来决定是否拦截,如果父容器需要拦截的话就返回true,否则就返回false,最后是ACTION_UP事件,这里必须要返回false因为ACTION_UP事件本身没有太多意义

(3)假如事件交给子元素处理,如果父容器在ACTION_UP时候返回了true,就会导致子元素无法接收到ACTION_UP事件,这个时候子元素中的onClick事件就无法触发,但是父容器比较特殊,一旦它开始拦截任何一个事件,那么后续的事件都会交给它来处理,而ACTION_UP作为最后一个事件也必定会传递给父容器,即便父容器的OnInterceptTouchEvent方法中ACTION_UP时候返回false.

2. 下面通过一个Demo示例说明:

(1)首先我们创建一个Android工程,如下:

自定义控件(视图)2期笔记12:View的滑动冲突之 外部拦截法

(2)我们来到activity_main.xml,如下:

 <com.himi.viewconflict.ui.RevealLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="12dp"
tools:context="${relativePackage}.${activityClass}" > <Button
android:id="@+id/button1"
style="@style/AppTheme.Button.Green"
android:onClick="onButtonClick"
android:text="滑动冲突场景1-外部拦截" /> </com.himi.viewconflict.ui.RevealLayout>

这里的RevealLayout是一个自定义控件(继承自ViewGroup),任何放入内部的clickable元素,当它被点击的时候,都具有波纹效果。

感觉这个RevealLayout很好用,存放自己的Github代码库之中。

(3)接下来来到MainActivity,如下:

 package com.himi.viewconflict;

 import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View; public class MainActivity extends Activity { @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
} public void onButtonClick(View view) {
Intent intent = new Intent(this, DemoActivity_1.class);
startActivity(intent);
}
}

(4)上面很自然地跳转到DemoActivity_1之中,如下:

package com.himi.viewconflict;

import java.util.ArrayList;

import com.himi.viewconflict.ui.HorizontalScrollViewEx;
import com.himi.viewconflict.utils.MyUtils; import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.Toast; public class DemoActivity_1 extends Activity {
private static final String TAG = "DemoActivity_1"; private HorizontalScrollViewEx mListContainer; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.demo_1);
Log.d(TAG, "onCreate");
initView();
} private void initView() {
LayoutInflater inflater = getLayoutInflater();
mListContainer = (HorizontalScrollViewEx) findViewById(R.id.container);
final int screenWidth = MyUtils.getScreenMetrics(this).widthPixels;
final int screenHeight = MyUtils.getScreenMetrics(this).heightPixels;
//初始化3页ListView内容
for (int i = 0; i < 3; i++) {
ViewGroup layout = (ViewGroup) inflater.inflate(
R.layout.content_layout, mListContainer, false);
layout.getLayoutParams().width = screenWidth;
TextView textView = (TextView) layout.findViewById(R.id.title);
textView.setText("page " + (i + 1));
layout.setBackgroundColor(Color.rgb(255 / (i + 1), 255 / (i + 1), 0));
createList(layout);
mListContainer.addView(layout);
}
} private void createList(ViewGroup layout) {
ListView listView = (ListView) layout.findViewById(R.id.list);
ArrayList<String> datas = new ArrayList<String>();
for (int i = 0; i < 50; i++) {
datas.add("name " + i);
} ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
R.layout.content_list_item, R.id.name, datas);
listView.setAdapter(adapter);
listView.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
Toast.makeText(DemoActivity_1.this, "click item "+position,
Toast.LENGTH_SHORT).show(); }
});
}
}

上面的DemoActivity_1主布局demo_1.xml,如下:

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:orientation="vertical" > <com.himi.viewconflict.ui.HorizontalScrollViewEx
android:id="@+id/container"
android:layout_width="wrap_content"
android:layout_height="match_parent" /> </LinearLayout>

上面使用到HorizontalScrollViewEx是自定义控件(继承自ViewGroup),在HorizontalScrollViewEx里面实现外部拦截法逻辑,如下:

 package com.himi.viewconflict.ui;

 import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.VelocityTracker;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Scroller; public class HorizontalScrollViewEx extends ViewGroup {
private static final String TAG = "HorizontalScrollViewEx"; private int mChildrenSize;
private int mChildWidth;
private int mChildIndex; // 分别记录上次滑动的坐标
private int mLastX = 0;
private int mLastY = 0;
// 分别记录上次滑动的坐标(onInterceptTouchEvent)
private int mLastXIntercept = 0;
private int mLastYIntercept = 0; private Scroller mScroller;
private VelocityTracker mVelocityTracker; public HorizontalScrollViewEx(Context context) {
super(context);
init();
} public HorizontalScrollViewEx(Context context, AttributeSet attrs) {
super(context, attrs);
init();
} public HorizontalScrollViewEx(Context context, AttributeSet attrs,
int defStyle) {
super(context, attrs, defStyle);
init();
} private void init() {
mScroller = new Scroller(getContext());
mVelocityTracker = VelocityTracker.obtain();
} @Override
public boolean onInterceptTouchEvent(MotionEvent event) {
boolean intercepted = false;
int x = (int) event.getX();
int y = (int) event.getY(); switch (event.getAction()) {
case MotionEvent.ACTION_DOWN: {
intercepted = false;
/**
如果滑动动画还没结束,我们就按下了结束的按钮,那我们就结束该动画.
目的是为了优化滑动体验:
倘若用户正在水平滑动,在滑动停止之前用户迅速转化为竖直滑动,导致
界面在水平方向无法滑动至终点从而处于一种中间状态。为了避免这种状态,
用户正在水平滑动时候,下一个序列的点击事件仍然交给父容器处理,这样就不会处于中间状态 */
if (!mScroller.isFinished()) {
mScroller.abortAnimation();
intercepted = true;
}
break;
}
case MotionEvent.ACTION_MOVE: {
int deltaX = x - mLastXIntercept;
int deltaY = y - mLastYIntercept;
if (Math.abs(deltaX) > Math.abs(deltaY)) {//水平滑动距离差 > 竖直滑动距离差
intercepted = true;
} else {//水平滑动距离差 < 竖直滑动距离差
intercepted = false;
}
break;
}
case MotionEvent.ACTION_UP: {
intercepted = false;
break;
}
default:
break;
} Log.d(TAG, "intercepted=" + intercepted);
mLastX = x;
mLastY = y;
mLastXIntercept = x;
mLastYIntercept = y; return intercepted;
} @Override
public boolean onTouchEvent(MotionEvent event) {
//表示追踪当前点击事件的速度
mVelocityTracker.addMovement(event);
int x = (int) event.getX();
int y = (int) event.getY();
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN: {
if (!mScroller.isFinished()) {
mScroller.abortAnimation();
}
break;
}
case MotionEvent.ACTION_MOVE: {
int deltaX = x - mLastX;
int deltaY = y - mLastY;
scrollBy(-deltaX, 0);
break;
}
case MotionEvent.ACTION_UP: {
/**
* 表示计算速度,比如:时间间隔为1000 ms ,在1秒内,
* 手指在水平方向从左向右滑过100像素,那么水平速度就是100;
* 计算速度+获取速度----三步曲
*   1. mVelocityTracker.computeCurrentVelocity(1000);
*   2. float xVelocity = mVelocityTracker.getXVelocity(); //获取水平方向的滑动速度
*   3. float yVelocity = mVelocityTracker.getYVelocity();//获取垂直方向的滑动速度
* 由于我们需要的是xVelocity,
* 这里只是提一下,不计入代码;
* 注意:这里的速度指的是一段时间内手指所滑过的像素数!像素数!像素数!重要事说3遍;
*/
int scrollX = getScrollX();
int scrollToChildIndex = scrollX / mChildWidth;
mVelocityTracker.computeCurrentVelocity(1000);
float xVelocity = mVelocityTracker.getXVelocity(); /**
*当你滑动手机相册中的照片的时候有没有发现,必须滑动到一定距离它才会切到下张图片,
* 否则,它就回退回原来的照片了,原来,它是通过“速度”来进行控制的~
* 还有就是"速度“可以为负值,很好理解,就像我们规定车前进的方向为正,反向为负;
*
*/
if (Math.abs(xVelocity) >= 50) {
mChildIndex = xVelocity > 0 ? mChildIndex - 1 : mChildIndex + 1;
} else {
mChildIndex = (scrollX + mChildWidth / 2) / mChildWidth;
}
mChildIndex = Math.max(0, Math.min(mChildIndex, mChildrenSize - 1));
int dx = mChildIndex * mChildWidth - scrollX;//缓慢地滑动到目标的x坐标;
smoothScrollBy(dx, 0);
mVelocityTracker.clear();//对速度跟踪进行回收
break;
}
default:
break;
} mLastX = x;
mLastY = y;
return true;
} @Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int measuredWidth = 0;
int measuredHeight = 0;
final int childCount = getChildCount();
measureChildren(widthMeasureSpec, heightMeasureSpec); int widthSpaceSize = MeasureSpec.getSize(widthMeasureSpec);
int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec);
int heightSpaceSize = MeasureSpec.getSize(heightMeasureSpec);
int heightSpecMode = MeasureSpec.getMode(heightMeasureSpec);
if (childCount == 0) {
//这个方法必须由onMeasure(int, int)来调用,来存储测量的宽,高值。
setMeasuredDimension(0, 0); /**
1.UNSPECIFIED
父不没有对子施加任何约束,子可以是任意大小(也就是未指定)
(UNSPECIFIED在源码中的处理和EXACTLY一样。当View的宽高值设置为0的时候或者没有设置宽高时,
模式为UNSPECIFIED)
2.EXACTLY
父决定子的确切大小,子被限定在给定的边界里,忽略本身想要的大小。对应LayoutParams中的 match_parent 和 具体的数值
(当设置width或height为match_parent时,模式为EXACTLY,因为子view会占据剩余容器的空间,
所以它大小是确定的)
3.AT_MOST
子最大可以达到的指定大小,对应LayoutParams中的wrap_content
*/
} else if (heightSpecMode == MeasureSpec.AT_MOST) {
final View childView = getChildAt(0);
measuredHeight = childView.getMeasuredHeight();
setMeasuredDimension(widthSpaceSize, childView.getMeasuredHeight());
} else if (widthSpecMode == MeasureSpec.AT_MOST) {
final View childView = getChildAt(0);
measuredWidth = childView.getMeasuredWidth() * childCount;
setMeasuredDimension(measuredWidth, heightSpaceSize);
} else {
final View childView = getChildAt(0);
measuredWidth = childView.getMeasuredWidth() * childCount;
measuredHeight = childView.getMeasuredHeight();
setMeasuredDimension(measuredWidth, measuredHeight);
}
} @Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
int childLeft = 0;
final int childCount = getChildCount();
mChildrenSize = childCount; for (int i = 0; i < childCount; i++) {
final View childView = getChildAt(i);
if (childView.getVisibility() != View.GONE) {
final int childWidth = childView.getMeasuredWidth();
mChildWidth = childWidth;
childView.layout(childLeft, 0, childLeft + childWidth,
childView.getMeasuredHeight());
childLeft += childWidth;
}
}
} private void smoothScrollBy(int dx, int dy) {
mScroller.startScroll(getScrollX(), 0, dx, 0, 500);
invalidate();
} /**
* computeScroll:主要功能是计算拖动的位移量、更新背景、
* 设置要显示的屏幕(setCurrentScreen(mCurrentScreen);)
* 通常是用mScroller记录/计算View滚动的位置,再重写View的computeScroll(),完成实际的滚动。
*/
@Override
public void computeScroll() {
if (mScroller.computeScrollOffset()) {
scrollTo(mScroller.getCurrX(), mScroller.getCurrY());
postInvalidate();
}
} /**
* onAttachedToWindow: 是在第一次onDraw前调用的。也就是我们写的View在没有绘制出来时调用的,但只会调用一次。
* 比如,我们写状态栏中的时钟的View,在onAttachedToWindow这方法中做初始化工作,比如注册一些广播等等
*/ @Override
protected void onDetachedFromWindow() {
mVelocityTracker.recycle();
super.onDetachedFromWindow();
}
}

(5)来到主布局之中,在HorizontalScrollViewEx之中包含一个子布局content_layout.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" > <TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:text="TextView" />
<!--
android:cacheColorHint="#00000000":去除listview的拖动背景色
android:listSelector:当你不使用android:listSelector属性,默认会显示选中的item为橙黄底色,
有时候我们需要去掉这种效果 -->
<ListView
android:id="@+id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff4f7f9"
android:cacheColorHint="#00000000"
android:divider="#dddbdb"
android:dividerHeight="1.0px"
android:listSelector="@android:color/transparent" /> </LinearLayout>

这布局文件之中包含一个ListView是上下滑动,而HorizontalScrollViewEx是左右滑动的,两者之间的滑动冲突在上面使用外部拦截法解决了。

接下来就是上面Listview 的item布局,如下:

 <?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="50dp"
android:gravity="center_vertical"
android:orientation="vertical" > <TextView
android:id="@+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" /> </LinearLayout>

(6)最终项目如下:

自定义控件(视图)2期笔记12:View的滑动冲突之 外部拦截法

(7)部署程序到手机上,运行效果如下:

自定义控件(视图)2期笔记12:View的滑动冲突之 外部拦截法

自定义控件(视图)2期笔记12:View的滑动冲突之 外部拦截法

自定义控件(视图)2期笔记12:View的滑动冲突之 外部拦截法

3. 示例源码下载