Man you are like a bandage in a survival world!! XD, you have no idea how this helped me, how this video can only have 800~ views???? Thank you very much!
Thank you for the feedback, I appreciate it! Entertaining is part of my creative process (next to showing my game and making tutorials), so I'm glad the video turned out enjoyable!
@3:32 this helped me too even I'm using 16px tiles using 480x320 now as natural resolution and I'm scaling all my graphics at the end on of render using display as surface NATURAL_SIZE = (480, 320) screen_size = (1200, 800) screen = pygame.display.set_mode(screen_size, pygame.RESIZABLE) display = pygame.surface.Surface(DISPLAY_SIZE) ... def render(self, screen: pygame.Surface, display: pygame.Surface): # Clear screen.fill((0, 0, 0)) display.fill((0, 0, 0)) # Render for state in self.states: state.render() # Scale and draw the game_surface onto the screen window_size = screen.get_size() surf = pygame.transform.scale(display, window_size) screen.blit(surf, (0, 0)) self.manager.draw_ui(screen)
In this line, "flag = pygame.SCALED" will scale all elements drawn on the screen to the monitor size, preserving the coordinates as if they were in the original resolution, it works in the entire code # Windowed mode : screen_surface = pygame.display.set_mode(size = (original_resolution.w, original_resolution.h), flags = pygame.SCALED) # Fullscreen mode : screen_surface = pygame.display.set_mode(size = (original_resolution.w, original_resolution.h), flags = pygame.SCALED | pygame.FULLSCREEN)
Exactly! Using pygame.SCALED allows the window to automatically scale all drawn elements to fit the monitor size while maintaining the layout and proportions set for the original resolution. This feature is particularly useful when you want your game to be adaptable to different screen sizes without manually adjusting every element. Fun fact: Did you know that you can use pygame.display.toggle_fullscreen() to dynamically switch between fullscreen and windowed modes? 🐍
Some experience with PHP could have taught you that everything should be flexible to a relative :3 This day and age, monitors 2x their resolution every year, so you gotta confine mate... or do vector-pixelart(?)
I believe so and thanks for the feedback! I'll be fine with this new 320*180 resolution :) As I mentioned, I started making this game with 0 experience and I thought I'll create something small, yet turns out I had much bigger plans 😁 Now the beginner mistakes are taken care of, the real fun should begin 🙌
Hi, I'm trying to scale the whole screen but I don't know how, everywhere I see people using pygame.transform.scale(), but I'm using a class Surface, so I can't really change use that method in my events method, so... do you know a way to scale everything in like a render method?, or what would you do in this case xd I know that a func like that would be more known it it exists.... xd thanks for the vid btw
Hi! pygame.transform.scale is a function that comes with pygame, and it's to upscale an image that you pass as argument. The argument you need to pass is a Surface object. I'll show you a quick example. You can either create a Surface object or load an external image (it will be a Surface object too): my_image = pygame.image.load("image.png") or either my_image = pygame.Surface((200, 200)) Then you can pass this object to the scale function to have a version with the dimensions you want to scale it to, like: my_upscaled_image = pygame.transform.scale(my_image, (500, 500)) This way you can scale images / surfaces to different sizes, yet it won't scale the window itself that you run your game in. You can make your window resizeable (drag the edge of the window) with: screen = pygame.display.set_mode((width, height), pygame.RESIZABLE) But this still won't scale everything, just modifies the area where your stuff is rendered. To actually rescale the whole window, I advise you to have an extra surface besides the screen. Let's say your screen now is 400x300 but you want to upscale EVERYTHING to 1200x900. You already have a window with these initial 400x300 dimensions. So what you can do is to set it up like this: width, height = 400, 300 scaled_width, scaled_height = 1200, 900 screen = pygame.display.set_mode((scaled_width, scaled_height)) non_scaled_surface = pygame.Surface((original_width, original_height)) Then display everything in your game to the non_scaled_surface, and at the end of each iteration, blit the upscaled version of the non_scaled_surface to the screen, like so: scaled_surface = pygame.transform.scale(non_scaled_surface, (scaled_width, scaled_height)) screen.blit(scaled_surface, (0, 0)) I hope this explanation helps! If it's still not clear, feel free to ask and I'll make an example .py file for you that you can try out :)
So 320 * 180 is 'kinda' your base resolution? "Scale up the window at the end of the cycle'. I guess that's easier than putting a scale parameter on every asset...? I guess that satisfies for pixel games. I think assets should be equal to the resolution. But that can be tricky for development with long load times.
Right, 320x180 is the base resolution of the game now. I've found that this is a comfortable size for me to draw anything in pixel art. I think using a simple scale factor for every asset can be a similarly simple method for upscaling. Yet it might slow down the game if it needs to store and load big sprites from the start. Pygame is "famous" for it's performance so I try to save as much resource as possible. And since we talk about pixel art, my method makes no difference between the visuals of non-scaled and upscaled windows; and has no major backdraws :)
Glad you found the video helpful! I get perfect non-blurry results if the ratio of the raw and upscaled dimensions are of whole numbers. Like if I upscale the 320x180 to 1920x1080, the ratio of these dimensions are 1:6 The key is to stick with the initial screen ratio, which is 16:9 for me and 4:3 for you
Hi, I have a question. I have chosen your approach and I am running everything at 800x480 and then upscaling the resulting surface to the real size of my monitor every frame. However, this makes my FPS drop from about 150 to bellow 60. Interestingly it is even slower than if I blit everything at full resolution to begin with... What is your experience with scaling the game surface with every frame??
Hey! Thanks for trusting me with your concern. The displaying technique you choose should be based on the genre and the planned complexity of the game. While going with the debated "load and blit everything in original dimensions and then upscale" works totally fine for smaller, RPG-like games where movement is limited and the graphics are simple, I wouldn't use it for a scenario where I create eg a topdown adventure game or a shooter game. I experimented with this technique using hundreds/thousands of particles, the result is that the performance drops from ~150 to ~90 fps when scaled to fullHD. There could be bottlenecks in the code that holds back the performance, like loading images in the main loop, or not converting loaded images / created Surface objects, etc. When one of my games started to feel slow (below 60), I went through thousands of lines of code to find any source of performance drawback and in the end I boosted the fps to 300. Crazy how much you can optimize a game!
Hey, thanks for the question, let me help! First, define a surface (I call it canvas) and a window with initial, non-scaled resolutions, for me it is 320x180 pixels. Then collect everything on your canvas that you want to display, characters, hud, etc. If you're done with these steps, you can just simply blit the upscaled version of your canvas to the window, like: canvas = pygame.Surface((320, 180)) window = pygame.display.set_mode((320, 180)) img_player = pygame.image.load("player.png") img_enemy = pygame.image.load("enemy.png") canvas.blit(img_player, (0, 0)) canvas.blit(img_enemy, (0, 0)) upscaled_canvas = pygame.transform.scale(canvas, (1920, 1080)) window.blit(upscaled_canvas, (0, 0)) pygame.display.flip() Let me know if you have further questions!
@@orkslayergamedev IIt worked! I put the code as you put it and it worked, thank you so much. Now I just have to implement it on my code. Thank you again, I'm from Mexico (sorry for my writing), and recently I started watching your devblog videos cause Im working on a pygame game about internet networks in order to get my university degree. I really like your videos, theyre quite useful and well done.
I'm happy that I could help you! Thanks a lot for the feedback, I'll present more devlogs soon :) And of course, good luck with your game and your degree! Let me know how it goes later on! 🙌
Man you are like a bandage in a survival world!! XD, you have no idea how this helped me, how this video can only have 800~ views???? Thank you very much!
Haha, thanks for the amazing feedback, I appreciate it! 😁
Hope to upload more content that helps you with your programming journey! 🐍
Really loved the editing and the incorporation of memes. The facial expressions of your pixel self were amazing.
Thank you for the feedback, I appreciate it! Entertaining is part of my creative process (next to showing my game and making tutorials), so I'm glad the video turned out enjoyable!
I have upscaled my game manually before I watch this video. Thanks
I'm glad if I could help you with the video!
@3:32 this helped me too even I'm using 16px tiles using 480x320 now as natural resolution and I'm scaling all my graphics at the end on of render using display as surface
NATURAL_SIZE = (480, 320)
screen_size = (1200, 800)
screen = pygame.display.set_mode(screen_size, pygame.RESIZABLE)
display = pygame.surface.Surface(DISPLAY_SIZE)
...
def render(self, screen: pygame.Surface, display: pygame.Surface):
# Clear
screen.fill((0, 0, 0))
display.fill((0, 0, 0))
# Render
for state in self.states:
state.render()
# Scale and draw the game_surface onto the screen
window_size = screen.get_size()
surf = pygame.transform.scale(display, window_size)
screen.blit(surf, (0, 0))
self.manager.draw_ui(screen)
I'm happy if you found the video helpful, thanks for the feedback! Good luck with your project 🙏
How is the performance for you? I am doing exactly this and my performance dropped from over 150 FPS to bellow 60...
In this line, "flag = pygame.SCALED" will scale all elements drawn on the screen to the monitor size, preserving the coordinates as if they were in the original resolution, it works in the entire code
# Windowed mode :
screen_surface = pygame.display.set_mode(size = (original_resolution.w, original_resolution.h), flags = pygame.SCALED)
# Fullscreen mode :
screen_surface = pygame.display.set_mode(size = (original_resolution.w, original_resolution.h), flags = pygame.SCALED | pygame.FULLSCREEN)
Exactly! Using pygame.SCALED allows the window to automatically scale all drawn elements to fit the monitor size while maintaining the layout and proportions set for the original resolution. This feature is particularly useful when you want your game to be adaptable to different screen sizes without manually adjusting every element.
Fun fact: Did you know that you can use pygame.display.toggle_fullscreen() to dynamically switch between fullscreen and windowed modes? 🐍
@@orkslayergamedev thanks bro you help me a lot, love your videos
@@valfredovictor I'm really happy to hear this! More stuff coming soon, happy coding to you 💚
Some experience with PHP could have taught you that everything should be flexible to a relative :3
This day and age, monitors 2x their resolution every year, so you gotta confine mate... or do vector-pixelart(?)
I believe so and thanks for the feedback! I'll be fine with this new 320*180 resolution :)
As I mentioned, I started making this game with 0 experience and I thought I'll create something small, yet turns out I had much bigger plans 😁 Now the beginner mistakes are taken care of, the real fun should begin 🙌
Hi, I'm trying to scale the whole screen but I don't know how, everywhere I see people using pygame.transform.scale(), but I'm using a class Surface, so I can't really change use that method in my events method, so... do you know a way to scale everything in like a render method?, or what would you do in this case xd I know that a func like that would be more known it it exists.... xd thanks for the vid btw
Hi!
pygame.transform.scale is a function that comes with pygame, and it's to upscale an image that you pass as argument. The argument you need to pass is a Surface object. I'll show you a quick example. You can either create a Surface object or load an external image (it will be a Surface object too):
my_image = pygame.image.load("image.png")
or either
my_image = pygame.Surface((200, 200))
Then you can pass this object to the scale function to have a version with the dimensions you want to scale it to, like:
my_upscaled_image = pygame.transform.scale(my_image, (500, 500))
This way you can scale images / surfaces to different sizes, yet it won't scale the window itself that you run your game in. You can make your window resizeable (drag the edge of the window) with:
screen = pygame.display.set_mode((width, height), pygame.RESIZABLE)
But this still won't scale everything, just modifies the area where your stuff is rendered. To actually rescale the whole window, I advise you to have an extra surface besides the screen. Let's say your screen now is 400x300 but you want to upscale EVERYTHING to 1200x900. You already have a window with these initial 400x300 dimensions. So what you can do is to set it up like this:
width, height = 400, 300
scaled_width, scaled_height = 1200, 900
screen = pygame.display.set_mode((scaled_width, scaled_height))
non_scaled_surface = pygame.Surface((original_width, original_height))
Then display everything in your game to the non_scaled_surface, and at the end of each iteration, blit the upscaled version of the non_scaled_surface to the screen, like so:
scaled_surface = pygame.transform.scale(non_scaled_surface, (scaled_width, scaled_height))
screen.blit(scaled_surface, (0, 0))
I hope this explanation helps! If it's still not clear, feel free to ask and I'll make an example .py file for you that you can try out :)
So 320 * 180 is 'kinda' your base resolution?
"Scale up the window at the end of the cycle'. I guess that's easier than putting a scale parameter on every asset...?
I guess that satisfies for pixel games. I think assets should be equal to the resolution. But that can be tricky for development with long load times.
Right, 320x180 is the base resolution of the game now. I've found that this is a comfortable size for me to draw anything in pixel art.
I think using a simple scale factor for every asset can be a similarly simple method for upscaling. Yet it might slow down the game if it needs to store and load big sprites from the start. Pygame is "famous" for it's performance so I try to save as much resource as possible.
And since we talk about pixel art, my method makes no difference between the visuals of non-scaled and upscaled windows; and has no major backdraws :)
I'm using a 4:3 ratio for that GBA feel, but these are good tips.
How do you make sure that resizing the window doesn't blur everything?
Glad you found the video helpful!
I get perfect non-blurry results if the ratio of the raw and upscaled dimensions are of whole numbers.
Like if I upscale the 320x180 to 1920x1080, the ratio of these dimensions are 1:6
The key is to stick with the initial screen ratio, which is 16:9 for me and 4:3 for you
Hi, I have a question. I have chosen your approach and I am running everything at 800x480 and then upscaling the resulting surface to the real size of my monitor every frame. However, this makes my FPS drop from about 150 to bellow 60. Interestingly it is even slower than if I blit everything at full resolution to begin with... What is your experience with scaling the game surface with every frame??
Hey! Thanks for trusting me with your concern. The displaying technique you choose should be based on the genre and the planned complexity of the game. While going with the debated "load and blit everything in original dimensions and then upscale" works totally fine for smaller, RPG-like games where movement is limited and the graphics are simple, I wouldn't use it for a scenario where I create eg a topdown adventure game or a shooter game.
I experimented with this technique using hundreds/thousands of particles, the result is that the performance drops from ~150 to ~90 fps when scaled to fullHD.
There could be bottlenecks in the code that holds back the performance, like loading images in the main loop, or not converting loaded images / created Surface objects, etc. When one of my games started to feel slow (below 60), I went through thousands of lines of code to find any source of performance drawback and in the end I boosted the fps to 300. Crazy how much you can optimize a game!
Hi, how did you handle the scaling window? When I scale it, the background surface get smaller but all the things i put on it stay the same size :c
Hey, thanks for the question, let me help!
First, define a surface (I call it canvas) and a window with initial, non-scaled resolutions, for me it is 320x180 pixels. Then collect everything on your canvas that you want to display, characters, hud, etc. If you're done with these steps, you can just simply blit the upscaled version of your canvas to the window, like:
canvas = pygame.Surface((320, 180))
window = pygame.display.set_mode((320, 180))
img_player = pygame.image.load("player.png")
img_enemy = pygame.image.load("enemy.png")
canvas.blit(img_player, (0, 0))
canvas.blit(img_enemy, (0, 0))
upscaled_canvas = pygame.transform.scale(canvas, (1920, 1080))
window.blit(upscaled_canvas, (0, 0))
pygame.display.flip()
Let me know if you have further questions!
@@orkslayergamedev IIt worked! I put the code as you put it and it worked, thank you so much. Now I just have to implement it on my code. Thank you again, I'm from Mexico (sorry for my writing), and recently I started watching your devblog videos cause Im working on a pygame game about internet networks in order to get my university degree. I really like your videos, theyre quite useful and well done.
I'm happy that I could help you! Thanks a lot for the feedback, I'll present more devlogs soon :)
And of course, good luck with your game and your degree! Let me know how it goes later on! 🙌