I love that Mac apps can be full screen or windowed and resizable, but is there a way to force the window to keep the aspect ratio when resizing? I ask because otherwise we would need to account for much wider aspect ratios than we have had on phones/tablets.
The short answer is no. If you intend to support fullscreen mode, then your app needs to be prepared to support any width or height. This is because fullscreen mode really just maximizes your app to fill the monitor and some monitors may be wider or squarer than others. And then there’s the more unusual edge case where some people rotate their monitors to portrait, meaning that your fullscreen app will be displayed in portrait.
Using Corona’s “letterbox” scale mode will help you tremendously, because it’ll scale your app’s content at the aspect ratio you want to desire. However, you’ll want to overlay graphics on top of the letterboxed areas to make sure that any objects transitioning outside of your content area will effectively get clipped in the letterbox areas. The simplest solution is to display black rectangles over the letterbox areas. And to make sure that they’re always drawn on top, you’ll need to make sure those objects are last on stage’s display object list.
If you intend to test the above, then the easiest way to test/implement this is by temporarily setting up your app’s window to be resizable. This way you can test your app at different sizes/aspect-ratios. It’s also a good opportunity to use Corona’s “resize” event if you want to support changing the size of the window dynamically at runtime (ie: from fullscreen back to normal window mode and vice-versa). You can make your window resizable via the “build.settings” file as follows…
settings { window = { resizable = true, }, }
Thanks, Joshua. I already have resizable=true and full screen right now isn’t a problem, as the aspect ratio for most screens is within the tolerance of my content. I currently use the letterbox scale method in config.lua and all of my scenes have images that bleed past the content borders to handle most screen size aspect ratios, but now with resizable windows, the windows can be either really tall and narrow or really short and wide.
I guess the answer for now is try to extend what I have to handle really wide displays.
Yeah, Corona doesn’t stop you from moving objects in the letterbox areas. That was actually intentional so that developers can draw graphics in those areas to cover up the black bars.
It might be too late to design your app like this now, but the simplest solution to this problem is to set up 2 groups on the stage. The 1st group would contain all of your app’s content display objects. The 2nd group would contains the overlay display objects that you can render on top of the letterbox areas. Since the last drawn object is always drawn on top (ie: painter’s algorithm), then this will guarantee that your overlay display objects are always rendered on top, even when add new objects to the content group.
Ah, yes, I see what you are saying now. I am actually using composer, so what I did was exactly what you suggest, except i put the overlay objects on top after i initialize composer, so they will be on top of all composer scenes. it works great. thanks again.
The short answer is no. If you intend to support fullscreen mode, then your app needs to be prepared to support any width or height. This is because fullscreen mode really just maximizes your app to fill the monitor and some monitors may be wider or squarer than others. And then there’s the more unusual edge case where some people rotate their monitors to portrait, meaning that your fullscreen app will be displayed in portrait.
Using Corona’s “letterbox” scale mode will help you tremendously, because it’ll scale your app’s content at the aspect ratio you want to desire. However, you’ll want to overlay graphics on top of the letterboxed areas to make sure that any objects transitioning outside of your content area will effectively get clipped in the letterbox areas. The simplest solution is to display black rectangles over the letterbox areas. And to make sure that they’re always drawn on top, you’ll need to make sure those objects are last on stage’s display object list.
If you intend to test the above, then the easiest way to test/implement this is by temporarily setting up your app’s window to be resizable. This way you can test your app at different sizes/aspect-ratios. It’s also a good opportunity to use Corona’s “resize” event if you want to support changing the size of the window dynamically at runtime (ie: from fullscreen back to normal window mode and vice-versa). You can make your window resizable via the “build.settings” file as follows…
settings { window = { resizable = true, }, }
Thanks, Joshua. I already have resizable=true and full screen right now isn’t a problem, as the aspect ratio for most screens is within the tolerance of my content. I currently use the letterbox scale method in config.lua and all of my scenes have images that bleed past the content borders to handle most screen size aspect ratios, but now with resizable windows, the windows can be either really tall and narrow or really short and wide.
I guess the answer for now is try to extend what I have to handle really wide displays.
Yeah, Corona doesn’t stop you from moving objects in the letterbox areas. That was actually intentional so that developers can draw graphics in those areas to cover up the black bars.
It might be too late to design your app like this now, but the simplest solution to this problem is to set up 2 groups on the stage. The 1st group would contain all of your app’s content display objects. The 2nd group would contains the overlay display objects that you can render on top of the letterbox areas. Since the last drawn object is always drawn on top (ie: painter’s algorithm), then this will guarantee that your overlay display objects are always rendered on top, even when add new objects to the content group.
Ah, yes, I see what you are saying now. I am actually using composer, so what I did was exactly what you suggest, except i put the overlay objects on top after i initialize composer, so they will be on top of all composer scenes. it works great. thanks again.