如何让html在Android浏览器{web}中的webview上填满全屏高度

时间:2016-05-26 09:09:26

标签: javascript android css webview

我在AppCompatActivity上添加了一个webview,并想让它填满全屏。我已尝试过此链接(How to make full screen in Android 4.0)中提到的方法,但它没有帮助。

下面是布局xml文件。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.lenovo.mds.mbgcompass.MainActivity">

<WebView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/webView"
    />
</RelativeLayout>

以下是MainActivity类:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
        this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,WindowManager.LayoutParams.FLAG_FULLSCREEN);

    webView = (WebView) findViewById(R.id.webView);
    setupWebView();
}

private void setupWebView(){
    webView.getSettings().setSupportZoom(true);
    webView.getSettings().setBuiltInZoomControls(false);
    webView.getSettings().setCacheMode(android.webkit.WebSettings.LOAD_NO_CACHE);
    webView.getSettings().setDefaultTextEncodingName("UTF-8");
    webView.getSettings().setJavaScriptEnabled(true);
    webView.getSettings().setDatabaseEnabled(true);
    webView.getSettings().setDomStorageEnabled(true);
    webView.getSettings().setAllowFileAccess(true);
    webView.getSettings().setUseWideViewPort(true);
    webView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
    webView.getSettings().setLoadWithOverviewMode(true);
    webView.loadUrl("file:///android_asset/index.html");
}

下面是使html dom为100%高度的html css样式。但它不适用于Android浏览器。如果我将高度更改为&#34; 100hv&#34;,它仅适用于Chrome浏览器而非android浏览器。我还应该尝试使html dom填充100%的屏幕高度?

var style = {
width: '100%',
margin: '0 auto',
height: '100%'
}

请参见下面的截图。我认为webview正在填满设备的整个屏幕,但是webview中的html并没有填写。如何在空间填写底部?

enter image description here

2 个答案:

答案 0 :(得分:0)

没有问题。但是,编辑您的xml文件:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout  xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.lenovo.mds.mbgcompass.MainActivity">

<WebView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentTop="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentBottom="true"
    android:id="@+id/webView"
    />
</RelativeLayout>

答案 1 :(得分:0)

您应将webview宽度和高度更改为wrap_content。它对我有用。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

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

</RelativeLayout>