开发者

Problem with extra space at the bottom of android Webview

I have an Webview in my application where i display the html content using loadData() method. The Problem is HTML content is displayed along with some extra space at the bottom, I could not understand why the white space is coming. This problem is occurring only in Motorola Milestone device(Android 2.1). Please somebody hel开发者_如何转开发p to sort out this problem.

Problem with extra space at the bottom of android Webview

Thanks in Advance, Rajapandian


At last I found the answer for my own question, I need to append the meta tag along with my HTML content before adding it to the Webview. Please find the Code below

 String s="<head><meta name='viewport' content='target-densityDpi=device-dpi'/></head>";            
 webview.loadDataWithBaseURL(null,s+htmlContent,"text/html" , "utf-8",null);      

The Viewport property inside the meta tag done the trick, please refer the following link for further details.

Using Viewport in Android Webview

Regards, Rajapandian


This blog post solved my problem. I think it'll help. http://capdroid.wordpress.com/2014/08/07/resizing-webview-to-match-the-content-size/

   private void setupWebView() {
    webView.getSettings().setJavaScriptEnabled(true);
    webView.setWebViewClient(new WebViewClient() {
        @Override
        public void onPageFinished(WebView view, String url) {
            webView.loadUrl("javascript:MyApp.resize(document.body.getBoundingClientRect().height)");
            super.onPageFinished(view, url);
        }
    });
    webView.addJavascriptInterface(this, "MyApp");
}

@JavascriptInterface
public void resize(final float height) {
    MyActivity.this.runOnUiThread(new Runnable() {
        @Override
        public void run() {
            webView.setLayoutParams(new LinearLayout.LayoutParams(getResources().getDisplayMetrics().widthPixels, (int) (height * getResources().getDisplayMetrics().density)));
        }
    });
}


Better use width property also .Because some devices consider that .

eg:

String s="<head><meta name=viewport content=target-densitydpi=medium-dpi, width=device-width/></head>";            


For who set the viewport according to the accepted answer but still having problem, try removing padding and margin from HTML and BODY in pages inside the WebView. If you want to keep body padding, add box-sizing:border-box to body tag:

html{
    margin:0;padding:0;
}
body {
    margin:0;
    padding:20px;
    box-sizing:border-box;
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜