• Hey Guest! Ever feel like entering a Game Jam, but the time limit is always too much pressure? We get it... You lead a hectic life and dedicating 3 whole days to make a game just doesn't work for you! So, why not enter the GMC SLOW JAM? Take your time! Kick back and make your game over 4 months! Interested? Then just click here!

Legacy GM SOLVED: Sprite Scaling & Aspect Ratio Problem

A

adval25

Guest
Hey everyone,

I'm having a bit of a problem here. My sprites don't scale properly and this creates a very ugly look.

Look at the character encapsulated in the white square.

So I've looked at a whole bunch of threads, including this one. But none of them have helped me solve my problem so far.

I've checked the "keep aspect ratio" option which is supposed to fix everything regardless of my screen resolution, but that doesn't seem to work.

My current screen resolution is 1366 x 768.
The View dimensions are set to 640 x 480.

If you need anymore info, please let me know. Thanks!
 
B

Becon

Guest
What is your sprite supposed to look like??? Are you drawing it or is it an object? If you are drawing it, what code are you using to draw it? More info is needed.
 

Phil Strahl

Member
If you're going for a crisp pixel look, make sure your port is a round multiple of your view, e.g. 2 times as large, 3 times as large, etc., so the port of your view should be 1280 × 960.

If you don't mind a bit of bilinear filtering, you can switch that on in the settings.

If you haven't done that: Open up "Global Game Settings". Assuming you're on Windows, click the "Windows" tab and there should be 3 vertical tabs on the left. Click "Graphics" and tick "Interpolate colors between pixels"
 

RangerX

Member
If you are in "keep aspect ratio", the engine takes 640x480 and expand it to 998,4x768. that's why you get graphical deformation.
If you don't want this to happen, you have to use the "pixel perfect" method I am giving in my tutorial. The drawback is that your choice of base resolution isn't good for 1366x768. 640x480 doesn't even fit 2 times in there. Your best bet would be to scale up by 1.5 times (resulting in 960x720) but you might still get graphical deformation since "half pixels" don't make sense. I would try though.
 
A

adval25

Guest
If you are in "keep aspect ratio", the engine takes 640x480 and expand it to 998,4x768. that's why you get graphical deformation.
If you don't want this to happen, you have to use the "pixel perfect" method I am giving in my tutorial. The drawback is that your choice of base resolution isn't good for 1366x768. 640x480 doesn't even fit 2 times in there. Your best bet would be to scale up by 1.5 times (resulting in 960x720) but you might still get graphical deformation since "half pixels" don't make sense. I would try though.
Thanks for replying

But I'm a bit confused. Keep aspect ratio will expand my "640x480 to 998,4x768"? Was that a typo?

Also I thought keep aspect ratio created black borders to keep everything to scale if necessary instead of needlessly stretching it. If not, is there a way to create a border or padding around the display to scale it properly then?

As far as my base resolution goes, it has a ratio of 683:384. Which is bizzare. And that's a problem because I can't divide it neatly like other 16:9 resolutions. Also I read many laptops and tv's have this resolution. How do other game designers make games that scale properly to any laptop/tv? I've played Undertale on two different computers (my current laptop being one) with two different base resolutions and it looks just fine. How did he (toby) do that?
 

NightFrost

Member
How do other game designers make games that scale properly to any laptop/tv?
One common thing to do is for the game to read your display size / aspect ratio and adjust its room sizes to fit and UI element positions to the calculated edges. This of course means things like people on 16:9 screens seeing further to left and right than people with 4:3 screens (does anyone use those anymore?) and bigger screen resolution meaning seeing further all around.

Of course you might have needs like "my pixel art backgrounds are drawn to this size so rooms must always be 480px high" and it becomes a matter of scaling up to display. If you're doing fullscreen, always pixel perfect scaling is impossible due to multitude of screen sizes and there will be some sub-pixel rounding. Windowed, for pixel perfect you enforce an integer upscale that fits to display size in use and disallow window resize. (Fullscreen, this can be combined with aspect checking and adjusting room size so there are no black bars to the sides.)

I havent' played Undertale but I understand it is a fullscreen game, which means it stretches to your display size (meaning noninteger pixel sizes that get rounded to integers).
 

RangerX

Member
Thanks for replying

But I'm a bit confused. Keep aspect ratio will expand my "640x480 to 998,4x768"? Was that a typo?

Also I thought keep aspect ratio created black borders to keep everything to scale if necessary instead of needlessly stretching it. If not, is there a way to create a border or padding around the display to scale it properly then?

As far as my base resolution goes, it has a ratio of 683:384. Which is bizzare. And that's a problem because I can't divide it neatly like other 16:9 resolutions. Also I read many laptops and tv's have this resolution. How do other game designers make games that scale properly to any laptop/tv? I've played Undertale on two different computers (my current laptop being one) with two different base resolutions and it looks just fine. How did he (toby) do that?
First of all they probably have a base resolution that is 16:9 in aspect ratio. And as I did not test those games with wierd resolutions and different monitors, its hard to tell what happens. They might letterbox their game at certain odd sizes. Another thing to add to the mix, they don't necessarily use the "vanilla" GameMaker Studio. They might use different add ons and DLL they created for themselves or that some other programmers created.

Second thing, you're not in "keep aspect ratio" if your game ends up stretched. The "keep aspect ratio" exist for preventing stretching. What it does is that it scales up your game as much as possible but without stretching it. Then the rest of screen space is black. If your game stretches, you doing something else that is wrong.

Now for the calculations I made... the logic was there but I miscalculated it...
Your screen 1366x768.
Your game is 640x480.

What side of your game will hit the screen border first if we scale it up? Vertical or horizontal borders? Its the 480 that will become 768. Now if we grow the 640 respecting the ratio, it will never reach 1366 therefore there will be some vertical black bars.
768 divided by 480 = 1,6
640 x 1,6 = 1024
Your game will be displayed scaled up at: 1024x768 if you have the "keep aspect ratio" option checked.
 
A

adval25

Guest
One common thing to do is for the game to read your display size / aspect ratio and adjust its room sizes to fit and UI element positions to the calculated edges. This of course means things like people on 16:9 screens seeing further to left and right than people with 4:3 screens (does anyone use those anymore?) and bigger screen resolution meaning seeing further all around.

Of course you might have needs like "my pixel art backgrounds are drawn to this size so rooms must always be 480px high" and it becomes a matter of scaling up to display. If you're doing fullscreen, always pixel perfect scaling is impossible due to multitude of screen sizes and there will be some sub-pixel rounding. Windowed, for pixel perfect you enforce an integer upscale that fits to display size in use and disallow window resize. (Fullscreen, this can be combined with aspect checking and adjusting room size so there are no black bars to the sides.)

I havent' played Undertale but I understand it is a fullscreen game, which means it stretches to your display size (meaning noninteger pixel sizes that get rounded to integers).
Thanks man.

I finally figured out what the problem is.

My code didn't update the port dimensions. So because the port and the view were not in sync, it was trying to scale the view to the port which was stretching the pixels the way it did.

Luckily I found a video that allowed me to circumvent the problem. It shows you how to manipulate the size of your ports on the fly. Check it out if you get a chance.

There is still some minor distortion of pixels however, but I guess that something that can't be completely avoided. It's fine though.

Thanks for all your replies.
 
Top