Screen size problem

Welcome everyone
I had a strange problem of its kind. I made a new project on a adobe animate 2020. And I chose the project size 960 * 540 and this educational application I imported flash files in order to support the application and when I called the file it works successfully and there are no problems and it works on Android efficiently but the problem that occurred made me lose hope and it is as follows.
When I try the application on old devices that carry Android 4 or 5, it works fully and calls flash files and works in full screen and naturally
But in modern phones, the application works successfully, but when the flash file is called, it is not completely complete. But it is small in size and on the left side. So I put a cot to enlarge the flash file that was called, but the same problem occurs in modern phones and this is the code that I used

var my2ndLoader:Loader = new Loader();
var url2:URLRequest = new URLRequest("44.swf");
my2ndLoader.load(url2);
addChild(my2ndLoader)
my2ndLoader.scaleX = 1.2;
my2ndLoader.scaleY = 0;
my2ndLoader.x = 0;
my2ndLoader.y = 0;

When this code failed to make the flash file deep into all devices, I used this code

var my2ndLoader:Loader = new Loader();
var url2:URLRequest = new URLRequest("44.swf");
my2ndLoader.load(url2);
addChild(my2ndLoader);                                  
                                                        

my2ndLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, patloader_scale);

function patloader_scale(evt:Event):void
{
          my2ndLoader.width = 960;
          my2ndLoader.height = 608;

          addChild(my2ndLoader);
}

The same problem occurs, the flash file is completely in old phones, even if it is a tablet, but the flash file is small and on the left side in modern phones
I need to add a code that makes the flash file fully compatible with all phones. Please note that I chose the full screen before exporting


admin edit: edited formating for code
do read Announcement: If you ask for help about code

ActionScript 3.0 Developer’s Guide
see: Display, Display Programming, Setting Stage properties

Building Adobe AIR Applications
see: Mobile application design considerations

Supporting the multiple screen sizes of multiple devices in Adobe AIR
see: Scaling and centering an interface


in short, always use

stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;

and do the resize/alignment yourself

other StageScaleMode and StageAlign are from Flash era, they can be used but will confuse many people

do a prototype, display only rectangles, and experiment

in general you will want a rectangle container that you scale depending on the DPI, and stageWidth/stageHeight, this container is where you will put all your UI

depending on how much multiple screen and different platform you want to supports, there are different gotchas: on iOS you would want to define the launch image correctly;

depending if you want to support screen orientation/rotation, etc.

you do want to scale/realign on Event.RESIZE, not Event.COMPLETE

you want to define your UI to have a bit of padding or margin and always center align,
this work in general everywhere, but again depending on what you want to do with the Ui it can vary

see also discussions like

on mobile the app xml can influence greatly how screen resolution is interpreted,
android max aspect ratio, iOS launch image, etc.

1 Like