User defined resolution in AS3 - actionscript-3

For the last couple of days I've been wondering if it would be possible to let the user define the resolution to be used, when building for an AIR application.
Say if I have my SWF set up at a 1280x720 resolution by default, would it be possible to have, in the main menu, a set of resolutions, for instance 1366x768 or 1024x768, that the user can choose and then scale the window that contains the game to that size?

With AIR, you can manipulate a window's size from your code.
For the window of the current code's scope, you can do:
stage.nativeWindow.width = 1280;
stage.nativeWindow.height = 720;
OR, if you want to move the window to a particular spot and size:
stage.nativeWindow.bounds = new Rectangle(0,0,1280,720);
Or, you can use NativeApplication.nativeApplication.activeWindow or one of the items (windows) from NativeApplication.nativeApplication.openedWindows

Related

Libgdx, Setting the full screen resolution during runtime causes application to render at the wrong size

I am only using the desktop Application, no mobile.
I am experimenting with letting the user set the screen resolution during run time. I give him the Display Modes available and he applies one. This part actually works. The problem occurs when i save this mode and try to set this display mode the next time they launch the game.
I am using preferences to store the mode the user selected. I am unable to access preferences before the Create method in my Game class, or in the DesktopLauncher Object, where you normally set up the config file and pass it into the application. So my DesktopLauncher looks like this.
val config = Lwjgl3ApplicationConfiguration()
config.setFullscreenMode(Lwjgl3ApplicationConfiguration.getDisplayMode())
Lwjgl3Application(MainGame(), config)
I use the current screen resolution on the creation of the application. Then in my Create method in my MainGame class i get the mode they set from preferences and i set it like so...
override fun create() {
var modes = Gdx.graphics.displayModes.toList()
val mode = Gdx.graphics.displayMode
val preference: Preferences = Gdx.app.getPreferences("screenPreference")
val screenWidth = preference.getInteger("width", mode.width)
val screenHeight = preference.getInteger("height", mode.height)
val refreshRate = preference.getInteger("refreshRate", mode.refreshRate)
modes = modes.filter { it.width == screenWidth }
modes = modes.filter { it.height == screenHeight }
modes = modes.filter { it.refreshRate == refreshRate }
if (modes.isNotEmpty()) {
Gdx.graphics.setFullscreenMode(modes[0])
}
....
}
To summarize i get the list of modes, i pull from preferences what was set last, and i filter the list according to what was in preferences. This should leave one item left in the list and i apply it. If for some reason the list is empty, then i don't set it, or there is no preference set i just apply the current mode again.
This is where the weird stuff happens. I have checked all the numbers when creating my screens and cameras, and they are all correct. I do receive the correct resolution, but the application doesn't render correctly. Below are a couple examples of what happens.
In the first image you see the bounds of the application to the screen. My application only renders in the bottom corner, and the rest is black. What happened to achieve this effect is i started the application with a smaller resolution than my native resolution, so 1280x1024, then in my create method i set the application full screen mode to 1920x1080 before building the rest of my application. I have checked my cameras and my viewports, and they all have the resolution 1920x1080, but the image is not filling the entire screen.
And a second.
This one is what happens when i reverse the settings. So i start at native resolution 1920x1080, and in my create method i set it to 1280x1024, again before creating the rest of my application. This gives me black bars on both sides of the image like id expect, but the application is HUGE, and only a portion of it fits in the window, the rest goes out of bounds, as depicted by the dotted lines.
It will remain like this the entire time, unless i change the resolution while the application is running, it will then correct itself for the rest of the applications life.
I am confounded by this effect i am getting, and am looking for an answer as to why, or how to fix it.
I found the issue that was causing the image to render incorrectly. I was setting the display mode in the create() function in my main game class. This function is not run on the rendering thread, and you do not want to use Gdx.graphics on anything other than the rendering thread, as described in the libgdx wiki https://github.com/libgdx/libgdx/wiki/Threading
There is a function where you can pass in a lambda to be run on the rendering thread.
Gdx.app.postRunnable {
Gdx.graphics.setFullscreenMode(Gdx.graphics.getDisplayMode(modes[0]))
}
After passing that into postRunnable the game renders correctly on launch.

Proper positioning (Screen width & height)

A little lost here. I've got two movieclips. I want one on the far left (out of reach until the user hovers over their left side of the screen) and one on the far right. I've tried playing with Screen, Capabilities, and stage.
I don't know why, but apparently my resolution 1536 by 864?
trace("Screen x = " + Capabilities.screenResolutionX); //Screen x = 1536
trace("Screen y = " + Capabilities.screenResolutionY); //Screen y = 864
I don't want to set the position of the native window to what the difference of the stage's with and height is to screenResoltionX and Y just because that number seems so off to me. I'm on a monitor with it's current resolution at 1920 x 1080. The only thing I can think of is that I have my laptop set to display only on the monitor at this time with it's main screen inactive, yet the window appears on my monitor, so i'm assuming its picking up the values from my monitor .. and my laptop's screen has no where near that weird of a resolution. Anyone know where this is coming from? I've never seen this before. The same numbers return from stage.fullScreenWidth and stage.fullScreenHeight..
I'm using Adobe AIR 17.0 to build this. Building it with an opaque window. The current size of the stage is set to 1024 x 786.
Edit: I want these objects on the edges of the user's screen. I'm trying to get a grid that represents the entire bounds of the user's screen.
When using Capabilities.screenResolutionX & Capabilities.screenResolutionY, it is reporting for the primary display (so if you have more than one monitor, regardless of which monitor your app is on, it will report back the primary monitor's resolution), and only at the time your application starts (so if you change resolution after the app starts Capabilities.screenResolutionX will not reflect the new screen resolution).
Here is a quote from the documentation: (emphasis mine)
This property does not update with a user's screen resolution and instead only indicates the resolution at the time Flash Player or an Adobe AIR application started. Also, the value only specifies the primary screen.
For your purposes, it seems like it shouldn't matter what the screen resolution is. Just use the stage.stageWidth & stage.stageHeight values since they reflect the boundaries of your actual app, regardless of which monitor it's on or if it's full screen, windowed, or scaled etc.
if(stage.mouseX < stage.stageWidth * 0.5){
//mouse is on the left hand side of the application.
}
EDIT
Based off your comment, sounds like you need to do this:
When your app first runs, do this to make it responsive/liquid:
stage.align = StageAlign.TOP_LEFT
stage.scaleMode = StageScaleMode.NO_SCALE
Then the stage.stageWidth and stage.stageHeight properties will reflect the actual window size.
You can maximize it through code with:
stage.nativeWindow.maximize();
You can listen for window sizing changes with:
stage.addEventListener(Event.RESIZE, myResizeHandler);
function myResizeHandler(e:Event):void {
//stage.stageWidth & stage.stageHeight have changed
}

Scaling a Game Maker app for mobile-device screens

I'm having a difficult time getting an HTML5 app I designed in Game Maker to scale for display on mobile-device screens. I've tried using this little bit of code, to set the width and height of a the main game room, in a setup object, before switching to that room:
room_set_width(rm_playspace,browser_width);
But that seems be doing absolutely nothing.
Have you successfully designed software for mobile devices with Game Maker? How did you get your software to scale for proper viewing on mobile devices with differently sized screens?
room_set_width( ind, w );
Description
With this function you can change (or set) the width of any room in your game except the current one.
so you need to go to another room, and then resize the first room and go back into it.
another option that you can try - just restart the room immediately after resizing, like
room_set_width(room, 640)
room_set_height(room, 480)
window_set_size(640, 480) // also you can use window_set_rectangle
room_restart()
(room should not be a persistent)
Don't forget to set view_port_xxx and view_size_xxx for proper sizes. You can use window_get_width() and display_get_width() etc. for that - refer to manual for more info.
You could also just resize the surface and before, the view.

Set ApplicationDPI in AS3 Mobile application

I developing an application in Flash Builder with AS3 only (no flex stuff). In flex it is possible to set the application's dpi by the following code:
<s:ViewNavigatorApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" applicationDPI="320">
But I using only AS3. I have read that it is not possible to change the application's DPI in run-time (with AS3), but how can I set this in project settings, compiler settings or is there another way to do it?
Also, what is the default application's DPI setting?
Ask it here because can't find it on the net (only flex based solutions).
The DPI on mobile is set by the hardware, it is entirely dependent on the phone and screen. When you set the applicationDPI in a Flex mobile you're telling Flex to automatically scale your assets.
Automatic scaling. Developers can choose to specify a target DPI for their application by setting the applicationDPI property on the application. When this is explicitly set, developers should set up their skins and layout as if they were running on a device of the given DPI. At runtime, if the device has a different DPI from the specified target DPI, Flex will automatically scale the entire application to preserve the approximate physical size of the application and its controls. For example, if an application is targeted at 160 DPI, it will automatically scale by 1.5x on a 240 DPI device. If you choose not to use this feature, you'll need to make sure your custom skins and view layouts adapt properly to different pixel densities at runtime.
Source
In an AS3 mobile project you're going to need to handle this yourself.
You can get the current DPI using Capabilities.screenDPI but I think what you may be after is a ratio to scale your assets by. One way to do this would be to start with the original game width.
private static const WIDTH:Number = 1024;
You can then get a ratio using
var ratio:Number = stage.fullScreenWidth / WIDTH;
And apply this to your assets
myBitmap.scaleX = myBitmap.scaleY = ratio;
Now this isn't going to take the rotation of the device into account, so fullScreenWidth/Height may be flipped. To check for that you're going to need to do something like this
if (stage.fullScreenWidth > stage.fullScreenHeight){
//portrait
} else {
//landscape
}
Hopefully this helps

ActionScript Screen Measurements

i'm attempting to use the Capabilities class to draw an accurately sized sprite on screen at exactly (2.5" x 5") regardless of the screen's resolution, but while i believe the code is correct, the size of the sprite is not accurate - when actually measuring it with a ruler.
function inchesToPixels(inches:Number):uint
{
return Math.round(Capabilities.screenDPI * inches);
}
var mySprite:Sprite = new Sprite();
mySprite.graphics.beginFill(0x000000, 0.5);
mySprite.graphics.drawRect(0, 0, inchesToPixels(2.5), inchesToPixels(5));
mySprite.graphics.endFill();
addChild(mySprite);
I'm not entirely sure about this, but my feeling is that the screenDPI value being returned by the Capabilities class would be the same value for two monitors running the same resolution, even if the monitors had different physical dimensions.
To illustrate, if you have two monitors, one which is 14" and the other which is 28", both displaying the same resolution of 800 x 600 pixels, that screenDPI property will return the same thing because they're both using the same resolution.
However, the number of dots in a literal, real-world inch on each screen will be different because of the physical dimensions of the monitor. So when you're running your code and measuring the on-screen Sprite you create with a ruler, it's not going to match up to real-world inches. I'm not sure how you could get around this problem (if I'm right about what's causing it), it seems like it'd be difficult.
Debu
I suggest at the start of your app telling the user "I detected your monitor is XX inches" (where XX is calculated from screenDPI), and allow the user to type in a correct monitor size.