How to Constrain Aspect Ratio on WideScreen?
by Joe Kauffman · in Torque Game Builder · 08/29/2006 (2:57 pm) · 14 replies
Hey,
I was testing my game on an Apple Powerbook which has an aspect ratio of 1280 x 854, as opposed to my normal monitors which are more like 1280 x 1024.
My game is getting smushed to fit that screen when in fullscreen mode.
i have designed to artwork to look good at an aspect ratio of 800x600,1024x768, etc...
Is there a way to constrain the aspect ratio for a widescreen monitor?
so it would have black bars on the sides? and not stretch horizontally to fit?
thanks,
Joe
I was testing my game on an Apple Powerbook which has an aspect ratio of 1280 x 854, as opposed to my normal monitors which are more like 1280 x 1024.
My game is getting smushed to fit that screen when in fullscreen mode.
i have designed to artwork to look good at an aspect ratio of 800x600,1024x768, etc...
Is there a way to constrain the aspect ratio for a widescreen monitor?
so it would have black bars on the sides? and not stretch horizontally to fit?
thanks,
Joe
#2
08/29/2006 (6:47 pm)
I run a check when my game starts. I check the aspect ratio of the display resolution and if it is not my desired ratio, I resize the scene window and position it. For instance, if the display resolution was set to 1280x768 you would set the size of the scene window to 1024x768 and position it at 128, 0 (which will center it horizontally).
#3
I'm glad there's a solution...
That gives me a great starting point.
thank you.
joe
08/30/2006 (10:40 am)
Cool!I'm glad there's a solution...
That gives me a great starting point.
thank you.
joe
#4
08/30/2006 (11:12 am)
Yeah! Post if you run into any implementation problems.
#5
i'm running into some trouble implementing this...
Ben, if you're still reading these forums, or if anybody else could please steer me in the right direction, i would really appreciate it.
i can only test this on my sister's widescreen PC laptop, and i can only borrow it late at night...
(i've yet been unable to crack this problem...)
here's my code in main.cs to check the aspect ratio:
and this is one of my GUIs that's getting stretched:
it DOES set the left position of the scenewindow at 128...
but it's still stretched and squashed...
the right edge stretches off the screen
i'm not really clear on HorizSizing and VertSizing
i tried them at their different settings,( "top","bottom","left","right","center","releative") all to no effect.
the extent is set at (1024 768), but it seems to ignore it.
again, my final goal is to have a 1024x768 window ceneted in the monitor, regardless of the monitor's screen size.
(black bg behind it)
thank you in advance for any help.
joe
11/14/2006 (9:15 pm)
Hey,i'm running into some trouble implementing this...
Ben, if you're still reading these forums, or if anybody else could please steer me in the right direction, i would really appreciate it.
i can only test this on my sister's widescreen PC laptop, and i can only borrow it late at night...
(i've yet been unable to crack this problem...)
here's my code in main.cs to check the aspect ratio:
if($fullscreen){
// check to see if aspect ratio is greater than 1.333333
if((getWord(getDesktopResolution(),0) / getWord(getDesktopResolution(),1)) > 1.34){
$gameXPosition = (getWord(getDesktopResolution(),0) - 1024) / 2;
$gameYPosition = (getWord(getDesktopResolution(),1) - 768) / 2;
}else{
$gameXPosition = 0;
$gameYPosition = 0;
}
}and this is one of my GUIs that's getting stretched:
//--- OBJECT WRITE BEGIN ---
new GuiControl(mainmenuBackgroundGui) {
canSaveDynamicFields = "0";
Profile = "GuiBlackContentProfile";
HorizSizing = "width";
VertSizing = "height";
Position = "0 0";
Extent = "1024 768";
MinExtent = "8 8";
canSave = "1";
Visible = "1";
useVariable = "0";
tile = "0";
new t2dSceneWindow(mainmenuBackground) {
canSaveDynamicFields = "0";
Profile = "GuiContentProfile";
HorizSizing = "width";
VertSizing = "height";
Position = "$gameXPosition $gameYPosition";
Extent = "1024 768";
MinExtent = "8 8";
canSave = "1";
Visible = "1";
lockMouse = "0";
useWindowMouseEvents = "1";
useObjectMouseEvents = "0";
};
};
//--- OBJECT WRITE END ---it DOES set the left position of the scenewindow at 128...
but it's still stretched and squashed...
the right edge stretches off the screen
i'm not really clear on HorizSizing and VertSizing
i tried them at their different settings,( "top","bottom","left","right","center","releative") all to no effect.
the extent is set at (1024 768), but it seems to ignore it.
again, my final goal is to have a 1024x768 window ceneted in the monitor, regardless of the monitor's screen size.
(black bg behind it)
thank you in advance for any help.
joe
#6
if i check getDestopResolution() when i am in fullscreen mode, i get 1024, 768, 32
if i check it while in windowed mode, i get 1280, 800 32
i am using this:
maybe that's the problem?
also, if i manually change the extent of the scenewindow from 1024 768 to 896 752(subtracting 128 and 16)
it goes back to it's correct shape.
am i unable to check the desktop resolution while i'm fullscreen?
hmmm...
thanks,
joe
11/14/2006 (10:36 pm)
Perhaps a clue:if i check getDestopResolution() when i am in fullscreen mode, i get 1024, 768, 32
if i check it while in windowed mode, i get 1280, 800 32
i am using this:
setScreenMode(1024 , 768 , 32 , $fullscreen );
maybe that's the problem?
also, if i manually change the extent of the scenewindow from 1024 768 to 896 752(subtracting 128 and 16)
it goes back to it's correct shape.
am i unable to check the desktop resolution while i'm fullscreen?
hmmm...
thanks,
joe
#7
i think i got it...
in my main.cs:
and in my GUIs:
this is totally working now...
i just had to set both horizSizing and vertSizing to "center"..
(unlike ben said, though, i did not have to move their position?)
however, and perhaps this is a bug, but getDestopResolution() is somehow cacheing itself...
if my game was windowed when i last quit, getDestopResolution() returns correctly ( 1280 1024 32),
if it was fullscreen when i last quit, though, it returns (1024 768 32)
this was tripping me up...
to solve this, i now always open the game up in a window first, capture the desktop settings, and then snap to fullscreen if appropriate.
if you guys have any thoughts, let me know.
thanks,
joe
11/14/2006 (11:45 pm)
Okay!i think i got it...
in my main.cs:
if((getWord(getDesktopResolution(),0) / getWord(getDesktopResolution(),1)) > 1.34){
$gameWidth = (getWord(getDesktopResolution(),0) - 1024) / 2;
$gameHeight = (getWord(getDesktopResolution(),1) - 768) / 2;
}else{
$gameWidth = 1024;
$gameHeight = 768;
}
setScreenMode($gameWidth , $gameHeight , 32 , $fullscreen );and in my GUIs:
//--- OBJECT WRITE BEGIN ---
new GuiControl(mainmenuBackgroundGui) {
canSaveDynamicFields = "0";
Profile = "GuiBlackContentProfile";
HorizSizing = "width";
VertSizing = "height";
Position = "0 0";
Extent = "1024 768";
MinExtent = "8 8";
canSave = "1";
Visible = "1";
useVariable = "0";
tile = "0";
new t2dSceneWindow(mainmenuBackground) {
canSaveDynamicFields = "0";
Profile = "GuiContentProfile";
HorizSizing = "center";
VertSizing = "center";
Position = "0 0";
Extent = "1024 768";
MinExtent = "8 8";
canSave = "1";
Visible = "1";
lockMouse = "0";
useWindowMouseEvents = "1";
useObjectMouseEvents = "0";
};
};
//--- OBJECT WRITE END ---this is totally working now...
i just had to set both horizSizing and vertSizing to "center"..
(unlike ben said, though, i did not have to move their position?)
however, and perhaps this is a bug, but getDestopResolution() is somehow cacheing itself...
if my game was windowed when i last quit, getDestopResolution() returns correctly ( 1280 1024 32),
if it was fullscreen when i last quit, though, it returns (1024 768 32)
this was tripping me up...
to solve this, i now always open the game up in a window first, capture the desktop settings, and then snap to fullscreen if appropriate.
if you guys have any thoughts, let me know.
thanks,
joe
#8
11/15/2006 (5:00 pm)
Glad you got it working. You shouldn't check the desktop resolution at all, ever. You just use the resolution Torque is running at. If TGB is running 1024x768 fullscreen or windowed, then you should not do any correction at all. If you see stretching in this situation it's being applied by the monitor and there's nothing you can do to change the monitor settings or probably to even detect them. The only time you should apply correction is when TGB itself is running in a ws resolution. You don't need a ws monitor to test this. Just set TGB to any ws resolution.
#9
hmmm..
i want to do things correctly,
but it is working now:
with a widescreen monitor, i have a centered 1024 x 768 scenewindow with a black background surrounding it.
on my monitor, which is 1280x1024, it keeps the aspect ratio and fills the whole screen.
my sister's laptop is 1280x800...
when i had it set to fullscreen before, it would stretch my 1024x768 graphics to fill her screen.
on her machine,
if open the default TGB project and set it to fullscreen, it stretches to fit the monitor...
the garage games logo becomes a oval...
i tested it like this:
open up TGB on her machine.
open up default TGB project.
drag a GG logo onto the scene.
open up the console and enter toggleFullScreen();
if you have a better solution, i would love it.
because as it is, i even have to rebuild the splashscreen GUIs (they don't have a scenewindow, just fading GUIs)
and they stretch to fit the monitor.
if you have sample code that i can test in the default TGB project, that would be awesome.
(just so i know it's not my code causing this)
thank you for your time.
i really appreciate it.
joe
11/15/2006 (5:43 pm)
Ben, thanks for replying!hmmm..
i want to do things correctly,
but it is working now:
with a widescreen monitor, i have a centered 1024 x 768 scenewindow with a black background surrounding it.
on my monitor, which is 1280x1024, it keeps the aspect ratio and fills the whole screen.
my sister's laptop is 1280x800...
when i had it set to fullscreen before, it would stretch my 1024x768 graphics to fill her screen.
on her machine,
if open the default TGB project and set it to fullscreen, it stretches to fit the monitor...
the garage games logo becomes a oval...
i tested it like this:
open up TGB on her machine.
open up default TGB project.
drag a GG logo onto the scene.
open up the console and enter toggleFullScreen();
if you have a better solution, i would love it.
because as it is, i even have to rebuild the splashscreen GUIs (they don't have a scenewindow, just fading GUIs)
and they stretch to fit the monitor.
if you have sample code that i can test in the default TGB project, that would be awesome.
(just so i know it's not my code causing this)
thank you for your time.
i really appreciate it.
joe
#10
Note those resolutions we calculate against are the Torque resolutions and not your desktop resolutions.
11/16/2006 (1:43 am)
Yes, your graphics get stretched because you are stretching them. In pseudocode:idealRatio = 1024 / 768 if (fullscreen) res = TGB.fullscreenRes else res = TGB.windowedRes actualRatio = res.x / res.y if (actualRatio != idealRatio) newX = floor(res.y * idealRatio) setRes(newX, res.y)
Note those resolutions we calculate against are the Torque resolutions and not your desktop resolutions.
#11
i will attempt to tackle this in the morning (well, later on in the morning...it's 5 am here)
i'll post my code tomorrow.
and thank you for helping me with this.
above and beyond.
joe
11/16/2006 (2:22 am)
Ben, thank you!i will attempt to tackle this in the morning (well, later on in the morning...it's 5 am here)
i'll post my code tomorrow.
and thank you for helping me with this.
above and beyond.
joe
#12
again, thanks for you help.
i'm trying not to get frustrated by this, but i've been working on it for three days now, and i'm going a little cuckoo...
if you could please help me understand this:
i'm on my sister's widescreen laptop.
she just got it a week ago and hasn't monkeyed with any of the settings.
i did a clean install of 1.1.2, and opened up TGB.
i get the level editor, with the default TGB project loaded.
i drag one of the GG logos onto the scene.
i hit ~tilde to open up the console, and type "toggleFullScreen();"
it snaps to fullscreen, and everything is stretched to fit her monitor.
the GG logo is now an oval.
if i do an echo(getRes();) in the console, i get: 1024 768 32
according to your pseudocode, i should be testing actualRes against idealRes...
but it already thinks i'm at my idealRes...
so it never does anything.
that is why was i tracking the desktop resolution.
but that would only work when the game was windowed.
but it did give me: 1280 800 32
which seemed like numbers i could work with.
i am going to keep working with the default TGB project until i get this.
trying to keep it simple, since it only has a main.cs and a mainScreen.gui
i just want a centered gamescreen with vertical black columns on the sides, and a circular GG logo!
this is my goal for the week!
i appreciate your patience with me.
and i was doing so good, too
i have about 13,000 lines of code written,
the game is looking beautiful.
i got the menu system down,
it handles multiple players, high scores, saved games, user settings.
there's pretty transitions between all the screens, etc. etc.
i was having a great time!
until i decided to check and see what happened on a widescreen computer...
anyway,
thanks for all your help with this.
and is nobody else having this issue?
all of the new apple monitors are widescreen,
and all those new pc laptops(with the pretty fish screensavers in best buy) are widescreen.
when i checked TGB on all the macs at work and my sister's PC at home, the graphics are all stretched and distorted.
(only fullscreen, windowed is fine)
(and these are just the default projects: fish demo, whackamole, shooter, etc.)
hmmm..
regards,
joe
11/16/2006 (12:52 pm)
Hey,again, thanks for you help.
i'm trying not to get frustrated by this, but i've been working on it for three days now, and i'm going a little cuckoo...
if you could please help me understand this:
i'm on my sister's widescreen laptop.
she just got it a week ago and hasn't monkeyed with any of the settings.
i did a clean install of 1.1.2, and opened up TGB.
i get the level editor, with the default TGB project loaded.
i drag one of the GG logos onto the scene.
i hit ~tilde to open up the console, and type "toggleFullScreen();"
it snaps to fullscreen, and everything is stretched to fit her monitor.
the GG logo is now an oval.
if i do an echo(getRes();) in the console, i get: 1024 768 32
according to your pseudocode, i should be testing actualRes against idealRes...
but it already thinks i'm at my idealRes...
so it never does anything.
that is why was i tracking the desktop resolution.
but that would only work when the game was windowed.
but it did give me: 1280 800 32
which seemed like numbers i could work with.
i am going to keep working with the default TGB project until i get this.
trying to keep it simple, since it only has a main.cs and a mainScreen.gui
i just want a centered gamescreen with vertical black columns on the sides, and a circular GG logo!
this is my goal for the week!
i appreciate your patience with me.
and i was doing so good, too
i have about 13,000 lines of code written,
the game is looking beautiful.
i got the menu system down,
it handles multiple players, high scores, saved games, user settings.
there's pretty transitions between all the screens, etc. etc.
i was having a great time!
until i decided to check and see what happened on a widescreen computer...
anyway,
thanks for all your help with this.
and is nobody else having this issue?
all of the new apple monitors are widescreen,
and all those new pc laptops(with the pretty fish screensavers in best buy) are widescreen.
when i checked TGB on all the macs at work and my sister's PC at home, the graphics are all stretched and distorted.
(only fullscreen, windowed is fine)
(and these are just the default projects: fish demo, whackamole, shooter, etc.)
hmmm..
regards,
joe
#13
11/16/2006 (5:39 pm)
Try using the global vars that are something like $Pref::Video::fullScreenRes and $Pref::Video::windowedRes to get the TGB resolution based on which mode you are in. You may have to crack open the prefs.cs file to find out the actual names of the vars.
#14
My game uses a static camera so it works for me, but it might not be the best solution for everyone.
I designed my game to be 1280x720, so that's the graphic resolution I worked with in TGB. Outside of my 1280x720 background image is a black image to simulate the black borders.
I did some math to set the camera to view x/y amount of the scene to simulate the black borders so that while in full screen, it would not stretch. For example:
So after choosing an aspect ratio with the options menu in your game or whatever, choose predetermined resolutions to use with "setRes()"
My GUI sizings were all set to "relative."
01/14/2011 (10:10 am)
I know this topic is kind of old, but I figured out a solution to this that might help someone who stumbled into this topic like I did. My game uses a static camera so it works for me, but it might not be the best solution for everyone.
I designed my game to be 1280x720, so that's the graphic resolution I worked with in TGB. Outside of my 1280x720 background image is a black image to simulate the black borders.
I did some math to set the camera to view x/y amount of the scene to simulate the black borders so that while in full screen, it would not stretch. For example:
function setAspectRatio43(){
sceneWindow2d.setCurrentCameraPosition(0, 0, (1280/8), (960/8));
}
function setAspectRatio169(){
sceneWindow2d.setCurrentCameraPosition(0, 0, (1280/8), (720/8));
}So after choosing an aspect ratio with the options menu in your game or whatever, choose predetermined resolutions to use with "setRes()"
My GUI sizings were all set to "relative."
Torque Owner Ben R Vesco