Remove unwanted White Space in WebView Android

Question

I have started developing an App using WebView. Actually I am loading an Image with Webview (I like to use the built-in zoom controls of the class). I can successfully load the Image but I can see some irritating white spaces. I can't find the way to remove it. My Images are 750 * 1000 in size. I have attached my code below.

webview.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >
    <WebView
        android:id="@+id/webView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>

ImageViewer.java

package com.android.test;

import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebView;

public class ImageViewer extends Activity {

    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.webview);

        String loadUrl = "file:///android_res/drawable/splash_001.jpg";

        WebView image = (WebView) findViewById(R.id.webView);
        image.clearView();
        image.clearCache(true);
        image.getSettings().setBuiltInZoomControls(true);
        image.getSettings().setSupportZoom(true);
        image.getSettings().setLoadWithOverviewMode(true);
        image.getSettings().setUseWideViewPort(true);
        image.loadUrl(loadUrl);
    }

}

Answer 1

If the white space you're talking about is on the right side, you can add this to the webview.

mWebView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);

That should make the white space go away, provided it's on the right side where the scroll bar would be.

Answer 2

My case, top of my webview has big padding. So, set scrollbarSize="0dp". In AS 2.2.3

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >

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

Answer 3

I had irritating white space bordering the rendered HTML content in my WebView (no images in that content though). At first I thought it was related to CSS issues as mentioned above. But by using a style sheet to change the background for HTML, BODY, etc. it looked more and more like padding around the WebView.

user3241873 shows above how to adjust the padding on the WebView itself, but what I found was when the default Android application created by Eclipse generated the layout file (RelativeLayout "container" rather than "LinearLayout"), it added these attributes to the RelativeLayout:

android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"

If you look up those padding values in res/values/dimens.xml, you'll see that they're set to 16dp. When I changed to 0dp, it removed the unsightly white space :)

If someone replaces the default (Hello World) TextView with a WebView, the padding for the parent RelativeLayout sticks around like an obnoxious relative in the house.

Answer 4

Use WebView's setScrollBarStyle method and provide parameter as View.SCROLLBARS_INSIDE_OVERLAY.

Answer 5

I already got it .

here my logic code, When the application open the website you must get the size of your webview then set it on height

here my code

 ViewGroup.MarginLayoutParams p = (ViewGroup.MarginLayoutParams) webpage.getLayoutParams();
        p.height = webpage.getHeight();
        Log.e(" webpage.getHeight()", String.valueOf(webpage.getHeight()));
        webpage.setLayoutParams(p);

Hope you will take my code and my answer to :) works on any devices even tabs too :)