Showing posts with label iPad3. Show all posts
Showing posts with label iPad3. Show all posts

Friday, April 20, 2012

Testing a Flex App for the iPad3 (part 2)



When testing a Flex app for the iPad3, you'll want to create a custom RuntimeDPIProvider so that the app scales to the correct size.  The Adobe docs describe how to subclass RuntimeDPIProvider at http://help.adobe.com/en_US/flex/mobileapps/WS19f279b149e7481c682e5a9412cf5976c17-8000.html#WS19f279b149e7481c-2a25e9b212d622ff5e8-8000

Using the following class will ensure the app is sized correctly on the device (using both slow and fast compile methods) and when previewing on the desktop.

package com.dougmccluer
{
 import flash.system.Capabilities;
 import mx.core.DPIClassification;
 import mx.core.RuntimeDPIProvider;
 
 public class CustomRuntimeDPIProvider extends RuntimeDPIProvider
 {
  public function CustomRuntimeDPIProvider()
  {
   super();
  }
  
  override public function get runtimeDPI():Number
  {
   if(Capabilities.os.indexOf("iPad")>-1)
   {
    if(Capabilities.screenResolutionX > 1500)
    {
     return DPIClassification.DPI_320;
    }
   }
   return DPIClassification.DPI_160;
  }
 }
}

You just need to tell the application to use the custom runtime provider and set the application dpi to 320.

s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  applicationDPI="320"
  runtimeDPIProvider="com.dougmccluer.CustomRuntimeDPIProvider">

Thursday, April 19, 2012

Testing a Flex app for iPad3

Testing a Flex app on the iPad3 (sorry, "The New iPad") isn't quite the no-thought-just-works proposition it is on the 2'nd gen device.  The 3rd gen iPad has a portrait resolution of1536x2048, which means it doesn't fit on my screen when I test on the desktop.
When testing on the device, you can get AIR to recognize the right resolution by pointing Flash Builder to the iOS 5.1 SDK, but that only works when you build an IPA using the "slow" method.  When I use the "fast" compile, the app treats the screen as 768x1024.  Meaning I only see the top left 1/4 of my app.

So in order to test I do the following:

1. I target the regular iPad in my debug configuration.  That sets the resolution to 768x1024 at a DPI of 132 (which Flash treats the same as 160).

2. I set applicationDPI="360" in the main application tag of my app.  Since the application DPI is double the screen DPI (which we set to 160 by choosing to target the original iPad), Flex scales everything down by 50%, even single-resolution bitmaps and hard-coded x and y values.  So I can run it on the desktop, or fast-publish to the device and everything fits and is in the proper proportions. ...except button text.  That doesn't get scaled down, so the buttons look weird.  But it's good enough to test against.

3. When I want to publish using the slow method, or do a release build, I remove the applicationDPI="360" from the Application tag.  Otherwise Flex would scale the app down to fit in a 768x1024 space in the top left hand corner of the screen, even though it sees the full 1536x2048 resolution.

Update:  A better solution is to create a custom RuntimeDPIProvider.