Fortunately, things are simpler than you think.
The 1x, 2x, 3x thing relates more to web sites, where you would have Retina and non-Retina versions of graphics, and Safari would give the user the best image for their screen.
When your 1242x2208 is on iPhone 5, AIR will scale the stage to that size, you don't have to do anything.
Showing on iPad is a harder case, because the ratio is different. Effectively the iPad will show a 1656x2208 area, and whatever was off the left and right sides of your stage will appear in the extra 414 pixels (so, you'll see 207 pixels of extra stuff on the left and right). All you have to do is have an interesting background image that is centered on the stage, and is 1656x2208.
You need to include splash screens for all the main types of device. iOS uses the splash screens to know whether your app is iPhone 1 ratio of iPhone 5 ratio. For iPhone 5 you would need Defaultfirstname.lastname@example.org (or it can be named Default-568h@2x~iphone.png). I think you already have the one for iPhone 7. You will need one for iPhone X as well. Somebody in this forum posted a list of the various screens. Can't find that right now!
As there are so many splash screens it can take a lot of file size just for those alone. These days I just use a solid color, that is the average of the colors in my main menu screen. The splash screen is only there for a brief moment anyway, so having a detailed photograph would perhaps take 40 MB of space, and would only be seen for less than a second.
Hi Colin, thank you very much for your reply!
So can I completely forget about supplying the 1x 2x 3x assets when designing my app in Adobe Animate (with the exception of the launch images)?
Will scaling down the 1242x2208 stage/image on an iPhone5 to 640x1136 slow down the phone? I also heard that autoscaling makes images fuzzy or choppy.
Could I supply four different standalone files to Apple of the app? One for iPhones (16:9), one for iPhones (4:3), one for iPhone X, and the other for iPad versions (all 4:3). Also if I wanted, could I supply a version to Apple for each specific device, like one specifically for iPhone5, the other for iPhone X, another app file for iPhone 7+ etc...? if yes how do I set these files up, are there any rules? naming conventions? How will I supply these multiple files to Apple store using Animate?
Don't do multiple apps, your one and only app can look after all devices.
In the Library, for bitmaps, there is an Allow Smoothing option. Using that should help to improve the scaling. In the early iPad days I did in some cases have alternate frames, so that non-Retina iPads would get non-Retina versions of the images. Doing that did help to stop iPad 1 from crashing. But that was years ago, any device that is in use now is likely to cope ok.
You could have alternate movieclips, then use a less demanding version for slow devices. But I would stop off more optimistically, and do testing on slower devices to see if there are any performance problems.
By the way, some people do still use a 1x, 2x approach, mainly to help reduce the amount of GPU memory that will be used. So, on lower memory GPU devices a 1x image would be used, and might look a little softer, and on a more memory GPU device a 2x version could be used, and will look sharper. So, you can still do tricks like that to help the less capable devices.
Thanks Colin, I have more questions...!
When you say that I could have alternate movieclips, how is this done? as in where do I put them in my Animate file? or where do I put them/save them out to? same goes for the 1x 2x 3x, where do I place these files and how will Apple know to use them since this is not Xcode? Where do all these files live if I only had one app file for all devices? or I guess what steps do I need to take, maybe in the publish settings?
This is why my thought on putting out a separate app file for each device could be an easier option for me, and I could also optimize the layout as well as image size for each device in the process. Is this against Apple rules?
Some people do have an iPad version and an iPhone version of their app, partly because of the ratio of the screen, but also because the iPad is a bigger screen, and so the whole UI could be done with that in mind.
I don't think you'll find any apps that have an iPhone 5, an iPhone 7, and an iPhone X version. It might even be hard to make an app that forbids all other types of iPhones. It certainly isn't worth the hassle, when you can make one app that does all devices, even if Apple had a way to have multiple versions of the same app.
When the app runs you can use ActionScript to read what device it is, what the real width and height are, and based on those values you could take the user to a different part of the timeline. Or if you have code that loads the experience from the Library, you could have different movieclips, and you show the user the one that looks the best for that device.
Here's example code, where in the library you have one movieclip that is shared as HiResMenu, and another that is LoResMenu, and by seeing how many pixels the device has you would show one or the other. In this case I have it that if there are more than 2 million pixels in the device screen, use the high resolution menu:
var realheight = Math.min(Capabilities.screenResolutionX, Capabilities.screenResolutionY);
var realwidth = Math.max(Capabilities.screenResolutionX, Capabilities.screenResolutionY);
mc = new HiResMenu() as MovieClip;
mc = new LoResMenu() as MovieClip;
The 2 million could be some other number, if you want say iPhone 6 to get the high res menu, and not just the iPhone 6 Plus, you could test for 1 million instead. That way 6 and 6 Plus would get high res, and iPhone 5 would get low res. It would look the same to the user, but in the LoResMenu you would have used the equivalent of 1x graphics, and in the HiResMenu you would have used the 2x graphics.
GOT IT! thank you very much!