Scale the game to different resolutions

Questions about the LÖVE API, installing LÖVE and other support related questions go here.
Forum rules
Before you make a thread asking for help, read this.
Post Reply
vincentg
Prole
Posts: 15
Joined: Wed Apr 18, 2018 3:26 pm

Scale the game to different resolutions

Post by vincentg »

Hello,
I made a game using only love.graphics.line, love.graphics.polygon and text. This is working fine with the default resolution size but I want to be able to scale the window and get the exact same result but adpated to a bigger or smaller screen. I want that everything scale in the same way that the window.

I tried to globally scale the canvas with love.graphics.scale() and also tried fullscreentype in 'exclusive mode but in both situations, I loose the quality of the font and the drawing, everything become blurry.

What is the right way of doing it?
Any advice are welcome :)
Last edited by vincentg on Sat Oct 06, 2018 9:42 pm, edited 1 time in total.
Astorek86
Prole
Posts: 20
Joined: Fri Jul 13, 2018 7:35 pm

Re: Scale the game to different resolutions

Post by Astorek86 »

vincentg wrote: Sat Oct 06, 2018 9:37 ameverything become blurry.
Maybe you want to change the FilterMode? (Especially love.graphics.setDefaultFilter to "nearest")...
User avatar
pgimeno
Party member
Posts: 3674
Joined: Sun Oct 18, 2015 2:58 pm

Re: Scale the game to different resolutions

Post by pgimeno »

vincentg wrote: Sat Oct 06, 2018 9:37 am Hello,
I made a game using only love.graphics.line, love.graphics.polygon and text. [...] I want that everything scale in the same way that the window.
If you mean to make every pixel bigger, then yes, what Astorek86 said should help.

But I suspect you mean like in vector applications, where the lines don't become jagged when you zoom in. That means you need to adapt your game to be able to work with different sizes:
  • Aspect ratios are a major headache. Decide what you want to do about them. Some options are:
    • Stripes (black or otherwise) on the sides or on the top/bottom when the screen is wider or higher respectively.
    • Truncate the top/bottom or the sides when the screen is wider or higher respectively.
    • Mix both of the above, to not truncate too much nor add too big stripes.
    • Don't respect the aspect ratio, and keep horizontal and vertical zoom factors separately so that your game graphics get stretched in one direction. Right now I can't think of a case where this looks right.
    • If your game allows it, you may be able to extend the game screen laterally or vertically instead of adding stripes. For example, in map-based games the visible part of the map may be wider or higher.
  • Once you've decided how to deal with aspect ratio, calculate the ratio between your design size and the actual size, depending on your choice. That's your base scale.
  • Change the font size according to that scale. In case you haven't created fonts with custom sizes, note that the default font size is 12, so use that as the initial size to multiply by the scale.
  • Change the line width according to that scale.
  • Scale every coordinate before drawing.
I think that should cover all bases.
vincentg
Prole
Posts: 15
Joined: Wed Apr 18, 2018 3:26 pm

Re: Scale the game to different resolutions

Post by vincentg »

Thanks your the replies!
Indeed this is not about filtering (but I also like the pixelate look for another project :)) and I thought it could work with a global scale because it could have been working like in vector applications. I will edit the coordinates into game, a bit more work but a better result.
Post Reply

Who is online

Users browsing this forum: Ahrefs [Bot], Bing [Bot], Google [Bot], kov_serg and 6 guests