Open Screen Projects – some fiddly differences
I haven’t added any new features to the latest (version 0.3.6) update to MadComponents – my focus has been ubiquitous performance on all devices.
(Please download the .apk demo if you have an Android phone, and leave a comment, and let me know how it performs on your device).
With this version, my focus has been to smooth over the differences on different platforms. One problem is that an AIR app on the iPhone doesn’t necessarily behave the same as the same app on Android.
Scaling the content to compensate for high pixel density on some mobile devices is relatively straightforward. MadComponents was designed assuming a pre-retina iPhone density of 132 dpi. So there is an algorithm within MadComponents that automatically scales its content on any device with a resolution (Capabilities.screenDPI) greater than 160 – to ensure a similar experience and similar size buttons, etc, on different screens.
The Android Virtual Keyboard Problem
If you set keyboard focus to a TextField (under program control), on an iPhone, this will cause the virtual keyboard to pop-up. On an Android phone, nothing will happen. The textfield will focus – you just won’t be able to type text into it.
In fact, the only way to invoke the virtual keyboard on an Android phone (running an AIR app) is to tap your finger on it.
This poses a problem for creating a mobile interface. For any component (textfield, button, etc.) within a scrolling container – when you tap on the screen it might mean a tap. But it might be a scroll gesture.
Previous versions of MadComponents would set mouseEnabled to false, and intercept mouse clicks and gestures to determine whether a click was really a click, or a scroll. But obviously that didn’t work for Android phones – so version 0.3.6 has a work-around that ensures input TextFields are not input disabled.
Am I running on a mobile? or a desktop?
There are two common techniques to determine the screen size.
window size = ( stage.stageWidth , stage.stageHeight )
screen size = ( Capabilities.screenResolutionX, Capabilities.screenResolutionY )
In the browser, or on the desktop, we can use the first technique to determine window size, whereas on a mobile device, this value is unreliable when the app first starts up. So we use the second technique (because the screen size is the window size on a mobile device).
The problem is determining whether we’re running on the desktop, or the mobile device. Capabilities.playerType won’t tell us. Capabilities.os may give a clue.
Then there’s Device Central in Flash CS5. How do we determine the screen size of the simulated device? Neither technique yields this value. I’ve Googled other people asking the same question, but no answer. If anyone knows how to do this please leave a comment below.