NestedScrollView and WebView height issue

Question

I use new android.support.v4.widget.NestedScrollView and I faced with issue.

Here is my layout:

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="250dp">

    <android.support.design.widget.CollapsingToolbarLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:contentScrim="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_collapseMode="parallax"
            app:layout_collapseParallaxMultiplier="0.7">

             <!-- some views inside -->

        </RelativeLayout>

        <android.support.v7.widget.Toolbar
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            app:layout_collapseMode="pin"
            />

    </android.support.design.widget.CollapsingToolbarLayout>

    </android.support.design.widget.AppBarLayout>

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

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

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

I need to load html inside textView, so I make:

content.setText(Html.fromHtml(htmlString));

And it looks strange. My textview placed at the bottom of screen. initial state

After I swipe on the text it starts to look normal. after swipe

And I think textview is not only view with these issue. I tried use webview, but it even does not show content (I think due to incorrect height computation). So I need webview or textview to correct work with NestedScrollView.

P.S. If I set textview height in dp then text looks correctly, but I need wrap_content for height.

Updated 08.07.15

Finally I need to use WebView. Alex Facciorusso answer partly works, but I faced with another issue. When WebView content has some specific height then I can see part of the content, but I can't scroll down. Example: enter image description here

@Moinkhan yeap, but webview has another issue: it even does not appear . And I have very light html, so `TextView` shows it correct. — IliaEremin, Jun 04 '15 at 14:26
@Moinkhan I tried many configuration: `LinearLayout` set to `match_parent`, `RelativeLayout` with `match_parent` and `wrap_content`, place `TextView` directly in `NestedScrollView`. I think it is a `NestedScrollView` issue, but I can not realize what is wrong. — IliaEremin, Jun 05 '15 at 07:07
just do this last try ...put {app:layout_behavior="@string/appbar_scrolling_view_behavior"} to LinearLayout instead of NestedScrollView — Moinkhan, Jun 05 '15 at 07:11
Resolved this issue in support library version 2.2.1: https://code.google.com/p/android/issues/detail?id=175234 — Mayur Raiyani, Aug 17 '15 at 17:34
It works for me, add This line to NestedScrollview in XML File. android:fillViewport="true" then set webview height wrap_content. — Shahzad Afridi, Mar 16 '18 at 20:26

score 5 · Answer 1 · answered Oct 25 '18 at 07:15

Read a lot of posts, and custom implementation of WebView as well, but I was keen about experimenting with attributes and found out what works for me, which is this:

For NestedScrollView use attribute

android:fillViewport="true"

and for the underlying WebView make sure you are using height as wrap

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

so as a pseudo code you have

<NestedScrollView> // height=  match_parent

 <Parent_layout>//could be Realtive/Linear with height= match_parent
   <Some_View></Some_View>
   <Some_View></Some_View>

   <WebView></WebView> // height=  wrap_content
 </Parent_layout>

</NestedScrollView>

this solved the endless scroll of webview when its placed in the nestedscrollview! good one! — Arun Jose, Nov 01 '20 at 04:56
Oh Nice @ArunJose this worked for you! This issue keeps reminding me the solution once every year haa haa. — sud007, Nov 01 '20 at 05:25

score 3 · Answer 2 · answered Jun 06 '15 at 14:10

A simple workaround will be to add an empty View with 500dp height below your TextView inside of your LinearLayout. That View shall push up your TextView to the right position.

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

<!-- Your scrolling content -->

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="@string/random_text" />

    <View
        android:layout_width="match_parent"
        android:layout_height="500dp"/>


</LinearLayout>

Alex Facciorusso · Answer 3 · 2015-06-08T13:08:55.700

I've found a workaround:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    android:id="@+id/main_content"
    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:fitsSystemWindows="true">

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

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:minHeight="300dp">

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

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

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="256dp"
        android:fitsSystemWindows="true"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsingToolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin" />
        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>

I added a minHeight of 500dp to NestedScrollView, and now the WebView is fitting all the height of the layout, and the collapsing toolbar is working.

UPDATED: wrapped WebView with FrameLayout and added minHeight to it.

Yeap, It work, but with some webview content height I see part of the content, but I can't scroll down. I tried to change minHeight to 1000dp, but nothing changed. — IliaEremin, Jun 08 '15 at 10:57
Sorry for late. I tried to wrap `WebView` into `FrameLayout`. The result is same. You can try it for your self. Here is my xml and data for webView: https://gist.github.com/IlyaEremin/e28d51cd1341607a1e69 — IliaEremin, Jun 15 '15 at 08:54
I like to mention wrapping the `WebView` in `FrameLayout` with the `minHeight` helped me solve an issue related to not being able to scroll the `WebView` if touching the webview's content to scroll. — Robert, Oct 26 '15 at 20:17

score 1 · Accepted Answer · edited Oct 30 '16 at 18:14

1

As Mayur Raiyani said: this issue is resolved in support library version 22.2.1: code.google.com/p/android/issues/detail?id=175234. Thanks all for answers.

edited Oct 30 '16 at 18:14

Loolooii

8,588
14
66
90

answered Aug 23 '15 at 08:27

IliaEremin

3,338
3
26
35

3

I'm facing similar issues, @IIyaEremin and it doesn't seem to be fixed. The webview doesn't respect match_parents for height. Are you sure the issue is fixeD? – onusopus Nov 13 '15 at 08:19
@onusopus IMHO design library still is very buggy and you need to use some 3rd party library. – IliaEremin Nov 13 '15 at 10:18
did u face this also ? http://stackoverflow.com/questions/33688701/webview-height-grows-indefinitely-inside-a-nestedscrollview – onusopus Nov 13 '15 at 11:17
1

Wow thanks. The question is, is there an angel descended from the sky, sent by DIVINE GODS and whispered to your ears that there is such as version 22.2.1? I reckon there is a list, I am struggling to find listings of support library versions... – Neon Warge Feb 06 '16 at 14:26
@NeonWarge use the Android SDK manager to check for newer versions, and the support library changelog for an overview of what's changed http://developer.android.com/tools/support-library/index.html – Lorne Laliberte Apr 25 '16 at 16:49
@LorneLaliberte No I need the listing, I need the entire list of versions. – Neon Warge Apr 26 '16 at 08:39
@NeonWarge that link contains the entire list. Each version can be expanded for more details. – Lorne Laliberte Apr 26 '16 at 18:22
@LorneLaliberte Oh Im sorry, yes of course it is! Thanks! Exactly what I needed. – Neon Warge Apr 27 '16 at 08:03

score 0 · Answer 5 · answered Jul 03 '15 at 02:43

0

wrapped WebView with FrameLayout and added View(android:layout_height="800dp") as WebView'minHeight to it.

answered Jul 03 '15 at 02:43

Sanpark

99
1
1
3

score 0 · Answer 6 · answered Feb 05 '16 at 05:32

0

This is a bug, update you sdk, replace "compile 'com.android.support:design:22.2.0'" with "compile 'com.android.support:design:22.2.1'" in build.gradle. That's work for me.

answered Feb 05 '16 at 05:32

dhn conan

1
1

Hi dhn! Do you know if there is an issue no associated with this? THank you! – Neon Warge Feb 06 '16 at 12:46
sorry, that's all I know. – dhn conan Feb 17 '16 at 08:05

score -3 · Answer 7 · answered Jul 06 '15 at 05:56

adding android:layout_gravity="fill_vertical" in NestedScrollView will solve your issue

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

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:padding="24dp" />

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

NestedScrollView and WebView height issue

Updated 08.07.15

7 Answers7

Linked