Using some code from this question I have set up some code to detect when an android device is rotated. It works great for the asus tablet (4.0.3) and two simulators (4.0.3 and 2.1), but for the kindle fire (2.3.4), and droidx (2.3.4) it switches the width and height.
Code:
<script type="text/javascript">
var supportsOrientationChange = "onorientationchange" in window,orientationEvent = supportsOrientationChange ? "orientationchange" : "resize";
window.addEventListener(orientationEvent, function() {
alert("The rotation is " + window.orientation + " and the resolution is " + screen.width + " x " + screen.height);
modRule();
}, false);
</script>
Output from asus tablet
Holding it in what looks like landscape:
The rotation is 0 and the resolution is 1280 x 800
Portrait
The rotation is -90 and the resolution is 800 x 1280
Output from Kindle Fire
Landscape
The rotation is 90 and the resolution is 600 x 819
Portrait:
The rotation is 0 and the resolution is 1024 x 395
output from droidx
landscape:
The rotation is 90 and the resolution is 320x488
Portrait:
The rotation is 0 and the resolution is 569x239
Is there a way I can
a) Make the javascript detect if it should use height instead of width or width instead of height
OR
b) Make the devices report the correct values for their width and height?
After looking for a while longer I found out that this is a bug with the 2.2 and 2.3 OS. I fixed the bug with 2.3.4 by putting this code in my app.
browser = (WebView)findViewById(R.id.webBrowser);
browser.setBackgroundColor(Color.BLACK);
WebSettings webSettings = browser.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setUserAgentString("Android " + android.os.Build.VERSION.SDK);//this is so the JavaScript knows what version of the OS I'm using
And then for detecting if I'm in landscape mode:
var uagent = navigator.userAgent.toLowerCase();
function isLandscape()
{
var width = screen.width;
var height = screen.height;
if (isBugged())
{
var temp = width;
width = height;
height = temp;
}
var landscape = width > height;
return landscape;
}
function isBugged()
{
return uagent == "android 10"
}
And if that wasn't confusing enough, when the body initially loads, it's right about if it's in landscape mode or not. So I had to bypass my own workaround.
<body onload="if(isBugged()){uagent = 'bypass';}/*code that depends on isLandscape()*/;uagent = navigator.userAgent.toLowerCase();">
It's a real pain, a lot more work than it should be. Especially since it works in 2.1 but not 2.3.4. Really frustrating, but that's what I have. At the moment, I only check for sdk 10, I'm going to add checking for the other bugged versions soon.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With