A little over a year ago, I wrote a post about how to render to a fixed, virtual resolution so that we can render independently of the actual window size resolution. That approach utilized the XNA framework to perform what we needed. Since Microsoft effectively killed XNA by pushing forward with DirectX / WinRT, myself and others have moved on to other libraries. In this post, I will show you how to do the same thing but with SDL2. Honestly, this approach is even easier (as long as you are using SDL2 that is!)
The concept of rendering to a virtually sized target is labeled as “Logical Size” in SDL2. Rendering a game to a logical size makes the scaling of that game to match different window sizes much easier. Imagine that we created our game under the assumption of 800×600 (an old school, 4:3 aspect ratio). On a user’s machine that has their system resolution set to 1920×1080, we have two choices: 1) show the game in a tiny window or 2) stretch the picture to fit the full screen. Both of these options are pretty terrible. In the first, the window will be too small to see anything useful (depending on the textures and fonts used in the game). In the second, the stretched picture will look awful because the aspect ratios do not even match. This is where SDL2’s logical rendering comes into play.
After establishing your renderer, all you really need to do is call the SDL_RenderSetLogicalSize function with the appropriate parameters. For example, the below code will set the logical rendering size to 800×600.
1 | SDL_RenderSetLogicalSize(renderer, 800, 600); |
Now whenever we use our renderer to render textures, they will be appropriately scaled to fit the window size and letter-boxed to avoid the ugly stretched look of different aspect ratios. You can see this in action in the picture below. In this example, I am rendering to a logical size of 800×600 in a window of size 1400×900. Note the letter boxes that SDL2 added to the left and right to avoid stretching.
