Android Webview - javascript screen dimensions vs actual screen dimensions - Stack Overflow

admin管理员组

文章数量:1391937

I have a very simple Activity with the following layout...

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

The Activity itself is set for full screen (no title bar and no Android notification bar) and forced to landscape.

So...on my HTC Desire, the WebView in theory is occupying 800x480 (wxh) pixels. All good so far, it DOES fill the screen totally.

The confusion I have is that the WebView loads an HTML document from a server which uses a javascript function to get the screen width and height...

<script type="text/javascript">
<!--
    function getDims() {
        var screenW = screen.width;
        var screenH = screen.height;
        return "size=" + screenW + "x" + screenH;
    };
-->
</script>

...the problem is that screenW is 527 and screenH is 320 and I don't understand why.

Looking at a height of 320, it's exactly two-thirds of 480 so I then looked at what two-thirds of 800 is (~533). So it seems both screen.width and screen.height in the javascript are reporting two-thirds of actual pixels available.

Can anyone explain why this is happening?

I have a very simple Activity with the following layout...

<LinearLayout xmlns:android="http://schemas.android./apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
    <WebView
        android:id="@+id/webview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    </WebView>
</LinearLayout>

The Activity itself is set for full screen (no title bar and no Android notification bar) and forced to landscape.

So...on my HTC Desire, the WebView in theory is occupying 800x480 (wxh) pixels. All good so far, it DOES fill the screen totally.

The confusion I have is that the WebView loads an HTML document from a server which uses a javascript function to get the screen width and height...

<script type="text/javascript">
<!--
    function getDims() {
        var screenW = screen.width;
        var screenH = screen.height;
        return "size=" + screenW + "x" + screenH;
    };
-->
</script>

...the problem is that screenW is 527 and screenH is 320 and I don't understand why.

Looking at a height of 320, it's exactly two-thirds of 480 so I then looked at what two-thirds of 800 is (~533). So it seems both screen.width and screen.height in the javascript are reporting two-thirds of actual pixels available.

Can anyone explain why this is happening?

• javascript
• android
• webview

Share Improve this question Follow asked Dec 25, 2011 at 8:33 SquonkSquonk 48.9k1919 gold badges107107 silver badges136136 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

For website you can control the screen size in android using a meta tag in your site.

There are three settings for the "screen" size low-dpi, medium-dpi and high-dpi.

So the device is automatically scaling your website (it assumes medium-dpi if you didn't set anything)

In javascript you don't get the exact pixel size of the device, you get more like the device is somewhere in that area...

A good explanation for this can be found here: http://developer.android./guide/webapps/targeting.html

本文标签： Android Webviewjavascript screen dimensions vs actual screen dimensionsStack Overflow