Webview inside Nestedscrollview/Scrollview missing contents

Question

I have a webview which is placed insde a nestedscrollview. Problem i am facing is webview is not loading the full page. Instead it loads a part of the page and after that it keeps the bottom space blank (white).

I have tried with scrollview as well.

Output I am getting:

My Code for webview:

private ImageButton backButton; private WebView webView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_article); backButton = findViewById(R.id.backButton); webView=(WebView)findViewById(R.id.webView); webView.setWebViewClient(new MyBrowser()); // if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.N) { // descriptionView.setText(Html.fromHtml(data, Html.FROM_HTML_MODE_COMPACT)); // } else { // descriptionView.setText(Html.fromHtml(data)); // } webView.getSettings().setJavaScriptEnabled(true); webView.loadUrl("file:///android_asset/html/test.html"); backButton.setOnClickListener(this); } private class MyBrowser extends WebViewClient { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; } }

Layout File:

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:card_view="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".Activities.ArticleActivity"> <RelativeLayout android:id="@+id/topBar" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/colorPrimary"> <ImageButton android:id="@+id/backButton" android:layout_width="48dp" android:layout_height="48dp" android:layout_centerVertical="true" android:layout_marginLeft="10dp" android:background="@null" card_view:srcCompat="@drawable/outline_arrow_back_ios_24" /> <ImageView android:layout_width="wrap_content" android:layout_height="20dp" android:layout_centerInParent="true" android:layout_margin="20dp" android:scaleType="centerInside" android:src="@drawable/x01" /> </RelativeLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_below="@+id/topBar"> <ScrollView android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v7.widget.CardView android:id="@+id/card_view" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_margin="10dp" card_view:cardCornerRadius="2dp"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iconView" android:layout_width="match_parent" android:layout_height="120dp" android:layout_centerVertical="true" android:scaleType="centerCrop" android:src="@drawable/article" /> <com.virtual_antivirus.virtualantivirus.Utlis.BanglaTextView android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginBottom="10dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:layout_marginTop="10dp" android:text="ভার্চুয়াল ভাইরাসের সর্বনাশা শিকার" android:textColor="@android:color/black" android:textSize="18sp" android:textStyle="bold" /> <LinearLayout android:layout_width="100dp" android:layout_height="5dp" android:layout_marginLeft="10dp" android:background="@color/colorAccent"></LinearLayout> <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> </LinearLayout> </android.support.v7.widget.CardView> </ScrollView> </LinearLayout> <View android:layout_width="match_parent" android:layout_height="5dp" android:layout_below="@+id/topBar" android:background="@drawable/shadow" /> </RelativeLayout>

Have you found the solution?

fikr4n
– fikr4n

2018-10-04 07:15:02 +00:00
Commented Oct 4, 2018 at 7:15 — fikr4n
– fikr4n, Commented Oct 4, 2018 at 7:15

Ashish Srivastava · Accepted Answer · 2018-10-16 14:06:31Z

You can place your NestedScrollView inside Coordinator layout and have to disable scrolling behavior and also place layout behavior if you are using app bar.

<android.support.v4.widget.NestedScrollView android:layout_width="match_parent" android:layout_height="match_parent" android:fillViewport="true" android:nestedScrollingEnabled="false" app:layout_behavior="appbar_scrolling_view_behavior"> .....

ʍѳђઽ૯ท · Accepted Answer · 2018-10-18 16:21:40Z

This is how I'v done that and it works properly with the latest APIs too and it's actually the best approach for future scrolling (hiding Toolbar or ..) behavior or etc.

All you need to do is to place your content inside NestedScrollView and add:

android:nestedScrollingEnabled="true"

To the WebView :

In your onCreate() method:

WebView webView = findViewById(R.id.webView); webView.loadUrl("file:///android_asset/htmlPages/test.html");

Layout:

<?xml version="1.0" encoding="utf-8"?> <androidx.coordinatorlayout.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"> <com.google.android.material.appbar.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <androidx.appcompat.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?android:attr/actionBarSize" android:background="@color/colorPrimary" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" /> </com.google.android.material.appbar.AppBarLayout> <androidx.core.widget.NestedScrollView android:layout_width="match_parent" android:layout_height="match_parent" android:fillViewport="true" app:layout_behavior="@string/appbar_scrolling_view_behavior"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <androidx.cardview.widget.CardView android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginStart="10dp" android:layout_marginTop="10dp" android:layout_marginEnd="10dp" app:cardUseCompatPadding="true"> <WebView android:id="@+id/webView" android:layout_width="match_parent" android:layout_height="wrap_content" android:nestedScrollingEnabled="true" /> </androidx.cardview.widget.CardView> </LinearLayout> </androidx.core.widget.NestedScrollView> </androidx.coordinatorlayout.widget.CoordinatorLayout>

Output:

I even used AndroidX dependencies which you can replace it with your own Support Library tags-dependencies.

Pradip Tilala · Accepted Answer · 2018-06-25 05:59:12Z

0

use

android:fillViewport="true"

inside scrollview attribute

answered Jun 25, 2018 at 5:59

Pradip Tilala

1,8191 gold badge19 silver badges31 bronze badges

1 Comment

Ahsan Aasim Over a year ago

strange it brought some more contents. but still full page is not getting displayed yet.

Vijendra patidar · Accepted Answer · 2018-10-15 13:31:06Z

You can use the NestedScrollView and put this line in your Webview

 android:nestedScrollingEnabled="false"

And check onec your xml class

Virendra Varma · Accepted Answer · 2018-10-16 15:00:06Z

update your XML file like this

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:card_view="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent"> <RelativeLayout android:id="@+id/topBar" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/colorPrimary"> <ImageButton android:id="@+id/backButton" android:layout_width="48dp" android:layout_height="48dp" android:layout_centerVertical="true" android:layout_marginLeft="10dp" android:background="@null" /> <ImageView android:layout_width="wrap_content" android:layout_height="20dp" android:layout_centerInParent="true" android:layout_margin="20dp" android:scaleType="centerInside" /> </RelativeLayout> <ScrollView android:layout_width="match_parent" android:layout_height="match_parent" android:layout_below="@+id/topBar"> <android.support.v7.widget.CardView android:id="@+id/card_view" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="10dp" card_view:cardCornerRadius="2dp"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center" android:orientation="vertical"> <ImageView android:id="@+id/iconView" android:layout_width="match_parent" android:layout_height="120dp" android:layout_gravity="center_horizontal" android:scaleType="centerCrop" /> <com.virtual_antivirus.virtualantivirus.Utlis.BanglaTextView android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:layout_marginTop="10dp" android:layout_marginRight="10dp" android:layout_marginBottom="10dp" android:text="ভার্চুয়াল ভাইরাসের সর্বনাশা শিকার" android:textColor="@android:color/black" android:textSize="18sp" android:textStyle="bold" /> <WebView android:id="@+id/webView" android:layout_width="match_parent" android:layout_height="match_parent" android:minHeight="300dp" /> </LinearLayout> </android.support.v7.widget.CardView> </ScrollView> <View android:layout_width="match_parent" android:layout_height="5dp" android:layout_below="@+id/topBar" /> </RelativeLayout>

try this if it does not solve your issue then check this post

Sangeet Suresh · Accepted Answer · 2018-10-17 06:27:26Z

It is because of your HTML I guess. I have tried with other HTML pages. It's working fine.

Try with following html file

 <html > <meta name="viewport" content="width=device-width, initial-scale=1.0"> <body style="word-wrap: break-word;" > AasdfasfasfsaffafafafafaaafafafffAasdfasfa<br/>sfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafff AasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaf<br/>fafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafff AasdfasfasfsaffafafafafaaafafafffAasdfasfasfsa<br/>ffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafff AasdfasfasfsaffafafafafaaafafafffAasdfasfasf<br/>saffafafafafaaafafafffAasdv<br/>fasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafff Aasdfasfasfsaffafafafafaaaf<br/>afafffAasdfasfasfsaffafafafafaaafafafffAasdfasf<br/>asfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafff Aasdfasfasfsaffafafafafaaafafa<br/>fffAasdfasfasfsaffafafafafa<br/>aafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafffAasdfasfasfsaffafafafafaaafafafff </body> </html>

bene25 · Accepted Answer · 2023-01-16 23:34:14Z

In my case putting web view inside ScrollView and set android:nestedScrollingEnabled="true" did the trick:

<ScrollView android:layout_width="match_parent" android:layout_height="wrap_content" android:nestedScrollingEnabled="true"> <WebView android:layout_width="match_parent" android:layout_height="wrap_content"/> </ScrollView>

Collectives™ on Stack Overflow

Webview inside Nestedscrollview/Scrollview missing contents

7 Answers 7

Comments

Comments

1 Comment

Comments

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

Comments

Comments

1 Comment

Comments

Comments

Comments

Comments

Linked

Related