Alex Rivera | Logout

Remove unwanted White Space in WebView Android

Asked 2012-01-01T16:39:20.340
42

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);
    }

}
Edit
Report

4 Answers

21

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.

answered 2012-01-06T22:59:12.057
20

By Defualt HTML web pages have a padding and margin of 10px; You have to set in your head section or or css file:

<style type="text/css">
html, body {
width:100%;
height: 100%;
margin: 0px;
padding: 0px;
}
</style>

That did the trick for me.

answered 2012-10-12T14:51:54.323
3

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

answered 2012-08-13T06:48:38.870
0

i don't really know which whitespace you are referring to ( maybe the image has padding or so), but usually if you have any layout issues in a WebView you would try to fix them by providing a proper (inline) css-stylesheet.

answered 2012-01-01T17:16:31.567

Your Answer