android - 将触摸事件从 View 分派(dispatch)到他的 WebView 兄弟

Question

问题的恢复:将布局上的触摸事件分派(dispatch)到他的 WebView 兄弟实现与默认 WebView 滚动相同的滚动(使用 fling)

我在这个 xml 之后的 WebView 上有一个 frameLayout:

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent">


    <com.app.ObservableWebView
        android:layout_width="match_parent" android:layout_height="match_parent"
        android:id="@+id/observableWebView">

    </com.app.ObservableWebView>


    <FrameLayout
        android:layout_width="match_parent" android:layout_height="200dp"
        android:id="@+id/frameLayout">

    </FrameLayout>

</RelativeLayout>

在应用程序开始时，一个空的 html 占位符被放置在 WebView Dom 中的某个位置，其位置由 JavascriptInterface 指定。这个位置是用像素比例转换的，FrameLayout放在frameLayout上面。当 WebView 内容移动时，占位符随 FrameLayout 一起移动(从 Observable WebView 发送的事件)。到目前为止，一切都在按预期进行。

在 frameLayout 中，我需要听到点击它的声音，所以我在这一步之后设置了一个 TouchListener :

private boolean mIsNativeClick = false;
private float mStartNativeX;
private float mStartNativeY;
private final float SCROLL_THRESHOLD = 10;

private void init(){
    mRootFrameLayout.setOnTouchListener(this);
}


@Override
public boolean onTouch(View v, MotionEvent event) {
    switch (event.getAction() & MotionEvent.ACTION_MASK) {
        case MotionEvent.ACTION_DOWN:
            mStartNativeX = event.getX();
            mStartNativeY = event.getY();
            mIsNativeClick = true;
            return true;
        case MotionEvent.ACTION_MOVE:
            if (mIsNativeClick && (Math.abs(mStartNativeX - event.getX()) > SCROLL_THRESHOLD
                    || Math.abs(mStartNativeY - event.getY()) > SCROLL_THRESHOLD)) {
                mIsNativeClick = false;
            }
            break;
        case MotionEvent.ACTION_UP:
            if (mIsNativeClick) {
                // my action on touch up goes here
                return true;
            }
    }

    return false;
}

触摸事件正确到达监听器并且一切正常。除了当我滚动 FrameLayout 时 WebView 没有滚动，因为它是 frameLayout 的兄弟:它不是父/子。

显而易见的解决方案是为 View.onTouchEvent 或在监听器中设置正确的返回真/假，以便 Android 将事件分派(dispatch)到三个 Latout 树中的下一个 View 。但是因为我需要处理 FrameLayout 中的向下/向上事件，开始为 MotionEvent.ACTION_DOWN 返回 true 停止调度下一个事件。

上周在 StackOverFlow 上搜索时，我找到了一个工作效率为 50% 的解决方案。让我们描述一下:

---

第 1 步:使 WebView 在 FrameLayout 移动事件上滚动

解决方案包括拦截 FrameLayout 上的事件并根据滚动移动/事件设置 WebView 的滚动位置。此解决方案的问题是未管理滚动的fling 事件(fling:当用户滑动并将手指从屏幕上移开时，会产生惯性效果滚动继续移动一些毫秒)。添加 fling 在步骤 2 中进行了说明。

这是代码 fragment :(FrameLayout 自定义 View 的一部分)

private int movY;
private float mStartNativeX;
private float mStartNativeY;

@Override
public boolean onInterceptTouchEvent ( MotionEvent event ) {
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            mStartNativeX = event.getX();
            mStartNativeY = event.getY();
            break;
        case MotionEvent.ACTION_SCROLL:
            Log.d(LOG_TAG, " scroll event");
            break;
    }
    return super.onInterceptTouchEvent(event);
}


@Override
public boolean onTouchEvent(MotionEvent event) {

    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            Log.d(LOG_TAG, "down event : " + Float.toString(mStartNativeY));
            break;
        case MotionEvent.ACTION_MOVE:
            movY = (int) ((int) mStartNativeY - event.getY());

            mWebView.scrollBy(0, movY);

            Log.d(LOG_TAG, "move event : " + Integer.toString(movY));
            return true;
        case MotionEvent.ACTION_UP:
            Log.d(LOG_TAG, "up event : ");
            break;
        default:
            break;
    }
    return true;
}

---

第 2 步: throw

将fling 添加到manul scrollBy 并不是那么容易。最基本的是添加一个 GestureDetector 和一个 Scroller。所以我有一个实现 Runnable 的类，它带有一个管理 throw 效果的 Scroller。此类在 GestureDetector Listener 的 onFling 上调用。

private float mStartNativeY;
private GestureDetector mGestureDetector;
int movY;

@Override
public boolean onInterceptTouchEvent ( MotionEvent event ) {
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            mStartNativeY = event.getY();
            break;
        case MotionEvent.ACTION_SCROLL:
            Log.d(LOG_TAG, " scroll event");
            break;
    }
    return super.onInterceptTouchEvent(event);
}

@Override
public boolean onTouchEvent(MotionEvent event) {

    mGestureDetector.onTouchEvent(event);

    // 1.) remember DOWN event ALWAYS as this is important start for every gesture
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            Log.d(LOG_TAG, "down event : " + Float.toString(mStartNativeY));
            break;
        case MotionEvent.ACTION_MOVE:
            movY = (int) ((int) mStartNativeY - event.getY());
            mWebView.scrollBy(0, movY);
            Log.d(LOG_TAG, "move event : " + Integer.toString(movY));
            return true;
        case MotionEvent.ACTION_UP:
            Log.d(LOG_TAG, "up event : " + Integer.toString(mWebView.getScrollY()));
            return false;
        default:
            break;
    }
    return true;
}

// GestureDetector Listener

@Override
public void onLongPress(MotionEvent e) {

}

@Override
public boolean onDown(MotionEvent e) {
    Log.d(LOG_TAG, "onDown");
    return true; // else won't work

}

@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2,
                        float velocitX, float veloctiyY){

    return true;
}

@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {

    new Flinger().start((int)velocityY);
    invalidate();

    return true;
}

@Override
public void onShowPress(MotionEvent e) {

}

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


private class Flinger implements Runnable {
    private final Scroller scroller;

    private int lastY = 0;

    Flinger() {
        scroller = new Scroller(getContext());
    }

    void start(int initialVelocity) {
        int initialY = mWebView.getScrollY();
        int maxY = Integer.MAX_VALUE; // or some appropriate max value in your code
        scroller.fling(0, initialY, 0, initialVelocity, 0, 10, 0, maxY);
        Log.i(LOG_TAG, "starting fling at " + initialY + ", velocity is " + initialVelocity + "");

        lastY = initialY;
        mWebView.post(this);
    }

    public void run() {
        if (scroller.isFinished()) {
            Log.i(LOG_TAG, "scroller is finished, done with fling");
            return;
        }

        boolean more = scroller.computeScrollOffset();
        int y = scroller.getCurrY();
        int diff = lastY - y;

        Log.d(LOG_TAG, "finger run : lasty : " + lastY +" y: " + y + " diff: "+Integer.toString(diff));

        if (diff != 0) {
            mWebView.scrollTo(0, scroller.getCurrY());
            lastY = y;
        }

        if (more) {
            mWebView.post(this);
        }
    }

    boolean isFlinging() {
        return !scroller.isFinished();
    }

    void forceFinished() {
        if (!scroller.isFinished()) {
            scroller.forceFinished(true);
        }
    }
}

问题:fling 并非每次都正常工作。所以如果我以 1009 的速度开始 throw ，日志会显示:

starting fling at 3032, velocity is 1009
up event : 3032
finger run : lasty : 3032 y: 3047 diff: -15
finger run : lasty : 3047 y: 3063 diff: -16
finger run : lasty : 3063 y: 3078 diff: -15
finger run : lasty : 3078 y: 3090 diff: -12
finger run : lasty : 3090 y: 3102 diff: -12
finger run : lasty : 3102 y: 3106 diff: -4
finger run : lasty : 3106 y: 3110 diff: -4
finger run : lasty : 3110 y: 3113 diff: -3
finger run : lasty : 3113 y: 3116 diff: -3
finger run : lasty : 3116 y: 3118 diff: -2
finger run : lasty : 3118 y: 3119 diff: -1
finger run : lasty : 3119 y: 3120 diff: -1 

根据log，fling理论是可以的，但是scroll的起点(-15)不够，应该大于~100

---

编辑:替代解决方案:将事件分派(dispatch)到 WebView

评论中解释的另一个解决方案应该是将 MotionEvent 从 FrameLayout 发送到他的 WebView 同级

mFrameLayout.setOnTouchListener(new OnTouchListener() {
    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        return mWebView.onTouchEvent(MotionEvent ev);
    }
});

此解决方案的问题是滚动距离与默认的 WebView onTouchEvent 不相同。它太慢了:它滚动的距离小于它应该的距离并且发生了一些闪烁。

---

采纳任何建议或其他解决方案。

Answer 1

每个 View 都有它的 onTouchEvent 方法，可以独立调用。

因此，为了将触摸事件传递给 sibling ，我们只需要使用第一个 View 的 MotionEvent 参数调用 sibling 的 onTouchEvent。

yourView.setOnTouchListener(new OnTouchListener() {
    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        //a sibiling MUST be final to be used in an OnTouchListener
        //if it's not, create a new final reference to it
        return sibiling.onTouchEvent(MotionEvent ev);
    }
});

更新:

根据评论中的对话，你想要同步2个不同维度的不同 View 的卷轴。由于维度不同，仅将 MotionEvent 传递给 webView 是不够的。 但是您可以在将 MotionEvent 发送给 sibling 之前修改它的 X 和 Y 坐标，使用此方法:

ev.setLocation(float x, float y);

您需要根据 Fragment 和 WebView 的尺寸缩放 Fragment 的 X 和 Y。我不知道你需要什么类型的滚动来精确地缩放，所以数学算法可能与我在下面写的不同(但这取决于你)。如果是这种情况，请将此视为有关如何缩放 MotionEvent 的演示。

//you first need all dimensions
//if they're changing during runtime, you can do all this in OnTouchListener
final int fragWidth = fragment.getWidth();
final int fragHeight =  fragment.getHeight();
final int webWidith = webView.getWidth();
final int webHeight = webView.getHeight();

//then you calculate scale factors
final float scaleX = (float)webWidth / (float)fragWidth;
final float scaleY = (float)webHeight / (float)fragHeight;

//same old OnTouchListener
fragment.setOnTouchListener(new OnTouchListener() {
    @Override
    public boolean onTouchEvent(MotionEvent ev) {

        //calculate scaled coordinates
        float newX = ev.getX() * scaleX;
        float newY = ev.getY() * scaleY;

        //MODIFY the MotionEvent by setting the scaled coordinates
        ev.setLocation(newX, newY);

        //call WebView's onTouchEvent with the modified MotionEvent
        return webView.onTouchEvent(MotionEvent ev);
    }
});