在滚动视图中滚动Webview

时间:2012-09-24 14:48:33

标签: android webview scrollview

我有什么:
现在我有一个Scroll视图作为父级。在这个滚动视图中,我使用的是一个加载URL然后在其中显示文本的WebView。 这是我的xml:

<ScrollView
    android:id="@+id/parentScroll"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/Heading" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="5dp" >

        <WebView
            android:id="@+id/webView"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:background="@drawable/webview" />
    </RelativeLayout>
</ScrollView>    

我想要的是什么:
我想在其中滚动webView。当我触摸webView时,很遗憾地会调用父滚动视图。 我还必须保留父滚动视图,但除此之外,我想在我触摸webView时滚动其中的WebView内容。

我该怎么做?

4 个答案:

答案 0 :(得分:6)

创建自定义触摸拦截Webview

<强> CustomWebview.java

 package com.mypackage.common.custom.android.widgets

public class CustomWebview extends WebView {

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

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

    public CustomWebview(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event){
        requestDisallowInterceptTouchEvent(true);
        return super.onTouchEvent(event);
    }          
}
layout.xml

中的

<com.package.custom.widgets.CustomWebview
                android:id="@+id/view_extra"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                 />

答案 1 :(得分:4)

根据Android设计文档,如果滚动容器滚动方向相同,则不应将滚动容器放在滚动容器内。它并不意味着处理这样的事情。

答案 2 :(得分:2)

我遇到了同样的问题。您应该将webView高度设置为与其内容相同。这样做:
将此行添加到Activity中的onCreate方法:

webView.setWebViewClient(new WebViewClient() {
            @Override
            public void onPageFinished(WebView view, String url) {
                webView.loadUrl("javascript:MyApp.resize(document.body.getBoundingClientRect().height)");

                super.onPageFinished(view, url);
            }
        });
webView.addJavascriptInterface(this, "MyApp");

并将此方法添加到您的活动中:

@JavascriptInterface
    public void resize(final float height) {
        MainActivity.this.runOnUiThread(new Runnable() {
            @Override
            public void run() {
                webView.setLayoutParams(new LinearLayout.LayoutParams(getResources().getDisplayMetrics().widthPixels, (int) (height * getResources().getDisplayMetrics().density)));
            }
        });
    }

答案 3 :(得分:0)

通常不鼓励使用嵌套的可滚​​动窗口小部件。这是一个令人困惑的用户体验,因为滚动错误的东西很容易。假设我打算滚动外部滚动区域,但我先触摸内部区域,然后非常努力地晃动。然后内部会滚动,我会像?为什么不滚动?

即使一个水平滚动而另一个垂直,手势识别器可能会相互混淆,因此您可以获得相同的效果。这是一个有效的用例,但它仍然是不确定的,我会避免它。 (IE:人类不能完全垂直和水平滑动,通常是一个角度。)

我会推动更改设计以打破可滚动区域。理想情况下,每页1个可滚动项目。甚至自己提出一个,给设计师提供经验,看看他们选择哪一个。

表达这将如何吮吸。看看这个例子。这不是一个解决方案,只是为了展示经验。

<ScrollView
    android:id="@+id/parentScroll"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/Heading" >

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent" android:orientation="vertical"
    android:padding="5dp" >
    <TextView
        android:id="@+id/topText"
        android:layout_width="match_parent"
        android:layout_height="1000dp"
        android:text="@string/lotsoftext" />
    <WebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:background="@drawable/webview" />
    <TextView
        android:id="@+id/topText"
        android:layout_width="match_parent"
        android:layout_height="1000dp"
        android:text="@string/lotsoftext" />
</RelativeLayout>