Question

I’ve got PhoneGap Android app that is exactly 480 pixel width and I want to set viewport size to this size on every possible Android’s device

I’ve tried this tag:

<meta name="viewport" content="width=480, user-scalable=no" />

But it was ignored by all devices and emulators I tested with. Then I tried:

<meta name="viewport" content="width=device-width, initial-scale=0.67, minimum-scale=0.67, maximum-scale=0.67, user-scalable=no, target-densityDpi=device-dpi" />

And this worked, but only on some (smaller) devices. On mu Samsung GT it gives correct 480 pixel width viewport, but when launched on tablet it gives 800 pixel width viewport.

Am I missing something obvious?

Answer 1

After several hours of debugging I finally found a solution:

WebView will ignore width of the viewport unless it is explicty told to be loaded in OverviewMode. So if anyone come here from Google, here’s the solution:

Add to your Java source:

public class YourGame extends DroidGap
{       
    super.onCreate(savedInstanceState);
    super.init(); // Don't forget this, you'll get runtime error otherwise!

    // The following does the trick:
    super.appView.getSettings().setUseWideViewPort(true);
    super.appView.getSettings().setLoadWithOverviewMode(true);

    super.loadUrl("file:///android_asset/www/index.htm");
}