GameMaker Font scaling across different resolutions

My guess is that a given font size will be the same size for different resolutions/ screen sizes... So how do we make sure that a programmed font will stay proportionate in different scales? thx
 

JackTurbo

Member
Fonts by default are raster based in gms. So you either need to include your font at multiple sizes and switch out which you're using with your own logic. Or work something out using a vector sprite based font. Other wise it'll pixelate and distort.

Unless you're using a pixel art font in which case you can scale it by multiples like any other pixel art.

Or at least that is my understanding.
 

NightFrost

Member
I always use pixel fonts I've drawn myself. I display them with draw_text_transformed_color() so I can scale them by whatever integer necessary to match the pixel size of rest of my graphics. Or in my older implementations, they just go 1:1 scale to app surface which then gets scaled to display size, but that made movement in low-pixel environs look janky. Trying to scale imported truetype fonts probably looks ugly, since you need them at lowest resolution which I guess will look like a mess especially when it gets scaled up.
 
JackTurbo & NightFrost: I'm a bit confused. So I'm working with a 23" display (1920x1080). So could I basically take an entire lot of characters from a specific font, make each of them sprites, and then go from there? It would then seem that those would scale correctly across different screen sizes/ resolutions (with compensating side bars, of course)...? NightFrost, could you please on expand your explanation regarding your "older implementations."
JackTurbo: How might one anticipate the many font scale variations? Things only look halfway correct when scaled by multiples of 2, 4, 8, 16, etc... I have to admit that I struggle with this stuff, but I'm coming around.
 

Nocturne

Friendly Tyrant
Forum Staff
Admin
To add to the already suggested... Most times you'll use the font for HUD/GUI/UI and so you can then just use the Draw GUI event and scale THAT to suit the different display sizes and your fonts (and sprites and everything else) will be drawn to match. The gui layer can be given a fixed height width, so if you get the display resolution and aspect ratio, you can scale it to suit almost any screen and have everything that's drawn to it adapt to match.
 

NightFrost

Member
Yeah GML has font_add_sprite and font_add_sprite_ext for the very purpose of turning your custom-made font sprites into font resources. But I should have asked what kind of game(s) are we talking about, as my advice is chiefly useful with 2D pixelart games. Like, your visual "resolution" of the game might be 480x270, so you'd draw everything to that scale, including text, then blow it up to screen size (plus black bars in case of different aspect ratios). These days, to get smoother motion, I upscale everything instead, but the idea remains the same. But if you're doing 3D vector stuff instead where game resolution should equal display's, the GUI advice above is simply better, it lets you set a certain resolution on all screen sizes for your UI stuff and thus requires just one font size.
 
To add to the already suggested... Most times you'll use the font for HUD/GUI/UI and so you can then just use the Draw GUI event and scale THAT to suit the different display sizes and your fonts (and sprites and everything else) will be drawn to match. The gui layer can be given a fixed height width, so if you get the display resolution and aspect ratio, you can scale it to suit almost any screen and have everything that's drawn to it adapt to match.
In my case fonts will be used exclusively for GUI. When you say that I can scale fonts to suit any screen size doesn't that really mean that as long as I draw GUI these things will take care of themselves? Because once you're drawing to GUI, you're drawing to the display resolution (in full screen)...? So just to be clear, I program my game on a 23" display with aspect ratio of 16:9 drawing fonts to GUI, then I run game on a 15" display with same aspect ratio, the font would scale down without issue? I hope I'm getting this.
Yeah GML has font_add_sprite and font_add_sprite_ext for the very purpose of turning your custom-made font sprites into font resources. But I should have asked what kind of game(s) are we talking about, as my advice is chiefly useful with 2D pixelart games. Like, your visual "resolution" of the game might be 480x270, so you'd draw everything to that scale, including text, then blow it up to screen size (plus black bars in case of different aspect ratios). These days, to get smoother motion, I upscale everything instead, but the idea remains the same. But if you're doing 3D vector stuff instead where game resolution should equal display's, the GUI advice above is simply better, it lets you set a certain resolution on all screen sizes for your UI stuff and thus requires just one font size.
I'm not using any vector, and it's highly doubtful that there would ever be any scaling up of graphics.
 

Nocturne

Friendly Tyrant
Forum Staff
Admin
Because once you're drawing to GUI, you're drawing to the display resolution (in full screen)...?
No that's incorrect. You are drawing to the size of the GUI layer. By default this will be the size of the application surface, but you can call display_set_gui_size() and set it to ANY resolution that you want. So, you can use this possibility to set the GUI layer to a size that is relative to the size of the display and so anything drawn to it will be scaled appropriately.
 
No that's incorrect. You are drawing to the size of the GUI layer. By default this will be the size of the application surface, but you can call display_set_gui_size() and set it to ANY resolution that you want. So, you can use this possibility to set the GUI layer to a size that is relative to the size of the display and so anything drawn to it will be scaled appropriately.
Are we just considering the display that I'm programming the game on, or will this carry over proportionately to other displays once published (by using that code you've noted)? In other words, I wouldn't want to anticipate all of the many 16:9 displays out there. I'm hoping that code would do the job? Also, is that code needed for all GUI (to work on different displays) or just the font situation? Thanks for this help. :)
 

Yal

šŸ§ *penguin noises*
GMC Elder
Basically, anything you draw in the Draw GUI event is drawn on the "GUI layer", which by default is the same size as the window is... this has some peculiar effects like making text get much smaller in fullscreen (because the GUI layer changes size, a GUI pixel now is smaller compared to a game pixel). If you resize the GUI layer, you have full control over the size of the GUI pixels. The GUI layer has some different benefits from normal drawing, like always being on top, but it's important to be aware of the size thing (ESPECIALLY how fullscreening messes with it by default).

To keep fonts smooth/readable even if you make your GUI layer different sizes, the easiest way is to just make duplicates of the fonts with different sizes - I did that for all GUI text in Daemon Detective Gaiden 2. No real downsides apart from using more texture page size, and if you write your own function to draw text picking the right font version based on the GUI scale, it's as easy as drawing text normally.
 
Basically, anything you draw in the Draw GUI event is drawn on the "GUI layer", which by default is the same size as the window is... this has some peculiar effects like making text get much smaller in fullscreen (because the GUI layer changes size, a GUI pixel now is smaller compared to a game pixel). If you resize the GUI layer, you have full control over the size of the GUI pixels. The GUI layer has some different benefits from normal drawing, like always being on top, but it's important to be aware of the size thing (ESPECIALLY how fullscreening messes with it by default).

To keep fonts smooth/readable even if you make your GUI layer different sizes, the easiest way is to just make duplicates of the fonts with different sizes - I did that for all GUI text in Daemon Detective Gaiden 2. No real downsides apart from using more texture page size, and if you write your own function to draw text picking the right font version based on the GUI scale, it's as easy as drawing text normally.
This is still over my head. If the GUI layer is by default the same size as the window, why would it not keep with the size of the window when going to full screen. When you talk about making different size fonts based on the corresponding GUI scale, how do I know which sizes I'll need? How could a GUI pixel be smaller than a game window pixel if they're both on my full screen? I'm terribly mixed up.
 

Yal

šŸ§ *penguin noises*
GMC Elder
If the GUI layer is by default the same size as the window, why would it not keep with the size of the window when going to full screen.
Because the fullscreen window covers the entire screen, the windowed window only covers part of it. (Another way of putting it is that the GUI layer uses screen pixels by default, while the normal drawing uses game pixels (which can be upscaled based on your view size and whether the game is in fullscreen or not). Normally the game pixels are 1 screen pixel each, but if you change the size of the window, the game pixels will be bigger while the screen pixels stay the same. Setting the size of the GUI layer manually will turn it into game pixels as well. (It always are game pixels, but the default behavior is to make the GUI layer's pixels correspond 1:1 to your screen's pixels)

When you talk about making different size fonts based on the corresponding GUI scale, how do I know which sizes I'll need?
That depends on what GUI scales you'll use. For my game I had settings to scale the game up to 2x, 3x and 4x the original size, so I made 2x, 3x and 4x-sized alternate versions of every font.
 
Because the fullscreen window covers the entire screen, the windowed window only covers part of it. (Another way of putting it is that the GUI layer uses screen pixels by default, while the normal drawing uses game pixels (which can be upscaled based on your view size and whether the game is in fullscreen or not). Normally the game pixels are 1 screen pixel each, but if you change the size of the window, the game pixels will be bigger while the screen pixels stay the same. Setting the size of the GUI layer manually will turn it into game pixels as well. (It always are game pixels, but the default behavior is to make the GUI layer's pixels correspond 1:1 to your screen's pixels)


That depends on what GUI scales you'll use. For my game I had settings to scale the game up to 2x, 3x and 4x the original size, so I made 2x, 3x and 4x-sized alternate versions of every font.
A precious light is now beginning to glow brighter in my skull... So GM2 pixels are a universal size (just like fonts), but a display's pixels are static, so I have to match GMS pixels to that ā€”but those are universal??. And that is what Noctune's code suggestion above does ("get_display")...? But when you say you're gonna scale your stuff up, what are you basing that on? The requirements of your own game project on your own display, or everybody else's displays?
 
Top