javascript - 我怎样才能在android webview中捕捉元素的滚动

Question

我有一个 SwipeRefreshLayout View 作为父 View 。在它里面，我正在使用加载网页的 webview。我想通过下拉 SwipeRefreshLayout 来重新加载 webview。这是我的 xml:

<android.support.v4.widget.SwipeRefreshLayout
        android:id="@+id/refresh_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <WebView
            android:id="@+id/webView"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

</android.support.v4.widget.SwipeRefreshLayout>

和java代码:

mWebView = (WebView) view.findViewById(R.id.webView);
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.loadUrl("http://kashirskoe.vegas-city.ru/renter/");

mSwipeRefreshLayout = (SwipeRefreshLayout) view.findViewById(R.id.refresh_layout);
    mSwipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
        @Override
        public void onRefresh() {
            mSwipeRefreshLayout.setRefreshing(true);
            mSwipeRefreshLayout.postDelayed(new Runnable() {
                @Override
                public void run() {
                    mWebView.reload();
                    mSwipeRefreshLayout.setRefreshing(false);
                }
            }, 1000);
        }
    });

乍一看，它的效果非常好。但是当用户向下滚动时，例如网页上的 map 控件，它不会滚动。而不是这个 SwipeRefreshLayout 拦截滚动并刷新网页(示例页面 url 在代码中)。

我想在页面上的任何 Web 控件滚动时禁用 SwipeRefreshLayout 滚动。就像它在浏览器 Google Chrome 中工作一样。

我认为我需要在 webview 中注入(inject)并执行 JavaScript，以便检测页面上任何滚动控件上的滚动事件。并将其传递给 android native 代码。我知道如何将它传递给 native 代码。

但是我如何在 javascript 中检测到这个滚动事件？

Answer 1

您可以通过定义扩展 WebView 的自定义 WebView 类并覆盖 onOverScrolled 方法来检测 WebView 的内容是否正在滚动 doc here .

从禁用 SwipeRefreshLayout 开始，当 WebView 中的内容不滚动时启用它。然后，您可以通过捕获 WebView 上发生的触摸向下事件来检测滚动手势的开始。

public class MyWebView extends WebView{
    @Override
    protected void onOverScrolled(int scrollX, int scrollY, boolean clampedX, boolean clampedY) {
        super.onOverScrolled(scrollX, scrollY, clampedX, clampedY);

        if( clampedX || clampedY ){
            //Content is not scrolling
            //Enable SwipeRefreshLayout
            ViewParent parent = this.getParent();
            if ( parent instanceof SwipeRefreshLayout) {
                ((SwipeRefreshLayout)parent).setEnabled(true);
            }
        }
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        super.onTouchEvent(event);

        if(event.getActionMasked()==MotionEvent.ACTION_DOWN){
            //Disable SwipeRefreshLayout
            ViewParent parent = this.getParent();
            if ( parent instanceof SwipeRefreshLayout) {
                ((SwipeRefreshLayout)parent).setEnabled(false);
            }
        }
        return true;
    }
}