webview height grows indefinitely inside a nestedScrollView

Question

This is my layout. When i load google.com, the webview's height keeps growing indefinitely. The onSizeChange function of the webview keeps getting called and i can see the webview keeps expanding indefinitely. I've tried 22.2.1 and 23.1.0 of the design and appcompat libraries and no effect.

Any solution ? :-|

<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/black">

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="fill_vertical"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <com.example.ajay.scrollabletoolbar.MyWebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentTop="true"/>
</android.support.v4.widget.NestedScrollView>

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbarlayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true">

    <android.support.v7.widget.Toolbar
        android:id="@+id/restricted_browser_toolbar"
        android:layout_width="match_parent"
        android:layout_height="?actionBarSize"
        android:background="@color/colorPrimary"
        app:layout_scrollFlags="scroll|enterAlways">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#FFFFFF"
            android:descendantFocusability="beforeDescendants"
            android:focusableInTouchMode="true">

            <EditText
                android:id="@+id/current_url"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_centerVertical="true"
                android:backgroundTint="@android:color/darker_gray"
                android:dropDownAnchor="@+id/restricted_browser_toolbar"
                android:hint="hint hint"
                android:imeOptions="actionGo|flagNoExtractUi"
                android:inputType="textNoSuggestions|textUri"
                android:paddingBottom="8dp"
                android:paddingEnd="8dp"
                android:paddingStart="8dp"
                android:singleLine="true"/>

            <ImageView
                android:id="@+id/clear_url_text"
                android:layout_width="48dp"
                android:layout_height="48dp"
                android:layout_alignRight="@+id/current_url"
                android:layout_centerVertical="true"
                android:layout_marginRight="8dp"
                android:src="@android:drawable/ic_menu_close_clear_cancel"
                android:visibility="gone"/>
        </RelativeLayout>
    </android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>

Harwell

I dont think I can use a fixed size. i want the webview to take the full window in all phones and tablet. – Harwell

Of course you can, as easy as setting the window size to the webview, why you think you cant? – Seismograph

i tried setting it to a fixed size. Hardcoded and window's size. The problem is that the webview doesn;t scroll. If i have a hardcoded value like 800dp, the webview displays a webpage update 800dp and clips off the stuff after it. So i;m not able to see the parts below it. I tried a similar thing based on a different SO post and had the same problem. Webview doesnt load the webpage beyond the size set. and i think there should be a cleaner solution – Harwell

webview should have its own scroll, should behave like a firefox, if the webpage is larger than the window it should have scroll... have you tried this: setVerticalScrollBarEnabled(true);? – Seismograph

It is enabled. If i remove the nestedScrollView, webview works as expected and scrolling works – Harwell

I too have the same problem.. Any solutions? @Harwell – Patois

I'm seeing the same issue here. No solution found yet :( – Narrows

Google says that this behaviour is intended. I dont understand why this isnt supported. code.google.com/p/android/issues/detail?id=198965 – Quarter

Thanks for the link @Quarter . useful – Harwell

Answer 1

In one sentence, you just can't put your WebView inside NestedScrollView. This is working as intended.

If you put a WebView inside NestedScrollView (or ScrollView), your WebView measures its dimensions with View.MeasureSpec.UNSPECIFIED requirement. No matter you set MATCH_PARENT or even fixed size like 100dp for your WebView's height. NestedScrollView forces its children measure themselves with View.MeasureSpec.UNSPECIFIED requirement. It all happens at NestedScrollView's measureChild() method. It goes like below :

@Override
protected void measureChild(View child, int parentWidthMeasureSpec, int parentHeightMeasureSpec) {
    ViewGroup.LayoutParams lp = child.getLayoutParams();
    int childWidthMeasureSpec;
    int childHeightMeasureSpec;
    childWidthMeasureSpec = getChildMeasureSpec(parentWidthMeasureSpec, getPaddingLeft()
            + getPaddingRight(), lp.width);
    childHeightMeasureSpec = MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED);
    child.measure(childWidthMeasureSpec, childHeightMeasureSpec);
}

And MeasureSpec.UNSPECIFIED means, as its label implies, it can be whatever size it wants. I think this slide from the "Writing Custom Views for Android" session at Google I/O 2013 will help you to understand it.

Actually this is an issue which was discussed in this thread, and according to this Google engineer,

This is as if in desktop, you resize the browser window to height of the page so it can't scroll vertically. The scrolling is happening in NestedScrollView rather than webview itself. So a consequence of no js in the page sees any scroll events, so it doesn't know you've scrolled to the end of the page load more content.

So, bottom line is, DO NOT put your WebView inside NestedScrollView. You should let WebView scroll the web page itself. Happy coding! :)

Revolt

But the problem is, without NestedScrollView the bottom View won't hide even you have added app:layout_behavior="com.google.android.material.behavior.HideBottomViewOnScrollBehavior" – Anneal

Answer 2

I apologize for not closing this question earlier. We cant put a webview inside a nestedScrollView. But the nature of a NSV, it expands its child to its full height so that it an get it working as expected with toolbars to get collapsible/scrollable toolbar etc. Hence if webview is added, the webview will grow either indefinitely or to a large value and hence it will not work as expected. this can be a ref: code.google.com/p/android/issues/detail?id=198965

Harwell

This is exact7ly what I want to point out, plus zoom control in WebView will lose too. So sad there is no solution. – Anneal