How to add padding around a WebView

My layout file defines a WebView, underneath which there are some fixed height buttons.

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

  <WebView
    android:id="@+id/webview"
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:layout_weight="1.0"/>

  <LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="60dp"
    android:padding="8dp">

    <Button
      android:text="Decline"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_weight="1.0">
    </Button>

    <Button
      android:text="Accept"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_weight="1.0">
    </Button>

  </LinearLayout>
</LinearLayout>

I'm trying to add padding around the WebView, as at the moment the text runs right up to the edge of the UI.

I tried adding android:padding="8dp" to the WebView, but no padding was added. I also tried paddingLeft and paddingRight too, but they didn't work either.

The WebView API docs confirm it inherits from View, which supports the android:padding attribute, so I'm surprised this didn't work.

Does anybody know if this is a known issue, or some interaction of my layout XML that I'm not understanding?

FYI, my workaround was to put an extra LinearLayout around the WebView, and add the padding to that instead:

  <LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:layout_weight="1.0"
    android:padding="8dp">

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

  </LinearLayout>

标签： android android-layout android-webview padding

7条回答

▲ chillily

2楼-- · 2020-02-10 00:15

The WebView has a bug in the padding implementation. Setting a padding on a webview won't pad the actual web page, but WILL pad the scrollbars. It's only partially working as expected. Your solution is the best way to achieve 'padding' for a WebView.

0人赞添加讨论(0) 举报

倾城　Initia

3楼-- · 2020-02-10 00:23

Just try to add this CSS:

<body style='margin:X;padding:X;'>

0人赞添加讨论(0) 举报

Ridiculous、

4楼-- · 2020-02-10 00:30

Add a LinearLayout adround it with padding.

0人赞添加讨论(0) 举报

再贱就再见

5楼-- · 2020-02-10 00:35

@Sergii's code didn't work for me, but following does

mWebView.setWebViewClient(new mWebViewClient(){
        @Override
        public void onPageFinished(WebView web, String url) {
            web.loadUrl("javascript:(function(){ document.body.style.paddingTop = '55px'})();");
        }
    });

You can change paddingTop to paddingBottom, paddingRight, paddingLeft too. Change the 55pxvalue to whatever you desire. Additionally, enable JavaScript for your webview

  webView.settings.javaScriptEnabled = true

0人赞添加讨论(0) 举报

干净又极端

6楼-- · 2020-02-10 00:35

Using padding is NOT workaround here. padding for layout is there for that purpose.

So your 'workaround' is what you should have done.

0人赞添加讨论(0) 举报

我欲成王，谁敢阻挡

7楼-- · 2020-02-10 00:41

Another workaround for this problem could be in javascript usage. So when your webpage is loaded you can do such js call to set paddings:

webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onPageFinished(WebView view, String url) {
        webView.loadUrl("javascript:document.body.style.margin=\"8%\"; void 0");
    }
});

0人赞添加讨论(0) 举报

1 2 下一页

How to add padding around a WebView

采纳回答

编辑标签

举报内容

检举类型

检举原因

检举说明(必填)

打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮

付费偷看金额在0.1-10元之间