Android 4.1 viewport scaling (setInitialScale, meta-initial scale does not work)

Question

There are hundreds of messages via SO and the rest of the Internet about trying to fix the viewport zooming in Android, and now I'm sure you just can't set the start scale in web view on Android 4.1.

I am creating a Cordova (Phonegap) application, and I have everything that is nice beautiful on iPhone 3GS, 4S and 5 and iPad 2 running iOS7 and 3GS on iOS6

I also have a user interface that is suitable for Moto G, LG Nexus 5, Google Nexus 5 and Samsung Galaxy S4, all running Android 4.4

But on Samsung Galaxy S2 and S3 Mini Android 4.1 works, I can not set the initial scale.

The HTML viewport meta tag does not work with 4.1 or 4.4 (works in Chrome, not in the default WebView or browser):

<meta name="viewport" content="user-scalable=no, initial-scale=0.5, width=device-width, height=device-height, target-densitydpi=device-dpi" />

I knocked out the absolutely basic Cordova project from cli, cordova create basicProjectand if I add Java to the onCreate method in the main Activity, in particular the method setInitialScale:

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    super.init();
    // Set by <content src="index.html" /> in config.xml
    super.loadUrl(Config.getStartUrl());
    //super.loadUrl("file:///android_asset/www/index.html");

    this.appView.setInitialScale( 50  );

}

Then I get Moto G on 4.4 scaling, as expected:

But the exact same project launched on the Galaxy S2 does not scale.

I will limit myself to testing on Samsung devices with 4.1 or with various devices on 4.4, so if someone can check the same thing on 4.2 or 4.3, or 4.1, but not on Samsung, which would be useful.

Does anyone know how to make Android 4.1 obey setInitialScale()

Answer 1

javascript -, , . , html, :

function customScaleThisScreen() 
    var contentWidth = document.body.scrollWidth, 
        windowWidth = window.innerWidth, 
        newScale = windowWidth / contentWidth;
    document.body.style.zoom = newScale;
}

( 4.2) - (4.2+).

HTHS

Answer 2

@Petey , :

var app = {
    initialize: function() {
        this.bindEvents();
    },
    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },
    onDeviceReady: function() {

        // PETEY SOLUTION, WRAPPED IN CODE TO CHECK FOR ANDROID PRE 4.2
        // ALSO MODIFIED TO USE DEVICE PIXEL RATIO, INSTEAD OF CONTENTWIDTH
        if( isAndroid() ) {
            var matches = device.version.match( /[0-9]+(\.[0-9]+)?/i );

            if( matches.length && parseFloat( matches[ 0 ] ) < 4.2 ) {
                document.body.style.zoom = 1 / window.devicePixelRatio;
            }
        }

        // start app logic

    }
};

app.initialize();

function isAndroid() {
    if( device.platform.match( /android/i ) ) {    
        return true;
    }

    return false;
}