Course Content
Building Arcade Game
Building Arcade Game
Creating a Scrolling Background
In this chapter, we're making our game's background move to create the illusion of a continuous, scrolling scene. Here's a simple breakdown:
Move the Background
bg_x1 -= bg_move
andbg_x2 -= bg_move
shift both instances of the background image to the left. This movement is determined by the value of bg_move, making it seem like the player is moving forward in the game.
Loop the Background
- The if statements check if either background image has moved entirely off the screen to the left. If
bg_x1 < -bg.get_width()
, it means the first background image has scrolled past the left edge of the screen. We then setbg_x1 = bg.get_width()
, which moves it directly to the right of the visible screen, ready to scroll again. The same logic applies to bg_x2.
Display the Background
main_display.blit(bg, (bg_x1, 0))
andmain_display.blit(bg, (bg_x2, 0))
draw the background images on the screen at their new positions. The (bg_x1, 0) and (bg_x2, 0) specify the positions of the backgrounds. The 0 in both commands keeps the vertical position the same, ensuring the background scrolls horizontally.
By continuously moving and looping the background images like this, we create a seamless, scrolling effect that adds depth and movement to the game, making it more engaging and visually appealing.
Task
- Shift Backgrounds Left: Decrease
bg_x1
andbg_x2
bybg_move
to move backgrounds leftward; - Reset Backgrounds for Loop: If
bg_x1
orbg_x2
move off-screen (< -bg.get_width()), reset them to bg.get_width() for continuous scrolling; - Draw Backgrounds: Use
main_display.blit(bg, (bg_x1, 0))
andmain_display.blit(bg, (bg_x2, 0))
to draw the backgrounds on the screen at updated positions.
Thanks for your feedback!
In this chapter, we're making our game's background move to create the illusion of a continuous, scrolling scene. Here's a simple breakdown:
Move the Background
bg_x1 -= bg_move
andbg_x2 -= bg_move
shift both instances of the background image to the left. This movement is determined by the value of bg_move, making it seem like the player is moving forward in the game.
Loop the Background
- The if statements check if either background image has moved entirely off the screen to the left. If
bg_x1 < -bg.get_width()
, it means the first background image has scrolled past the left edge of the screen. We then setbg_x1 = bg.get_width()
, which moves it directly to the right of the visible screen, ready to scroll again. The same logic applies to bg_x2.
Display the Background
main_display.blit(bg, (bg_x1, 0))
andmain_display.blit(bg, (bg_x2, 0))
draw the background images on the screen at their new positions. The (bg_x1, 0) and (bg_x2, 0) specify the positions of the backgrounds. The 0 in both commands keeps the vertical position the same, ensuring the background scrolls horizontally.
By continuously moving and looping the background images like this, we create a seamless, scrolling effect that adds depth and movement to the game, making it more engaging and visually appealing.
Task
- Shift Backgrounds Left: Decrease
bg_x1
andbg_x2
bybg_move
to move backgrounds leftward; - Reset Backgrounds for Loop: If
bg_x1
orbg_x2
move off-screen (< -bg.get_width()), reset them to bg.get_width() for continuous scrolling; - Draw Backgrounds: Use
main_display.blit(bg, (bg_x1, 0))
andmain_display.blit(bg, (bg_x2, 0))
to draw the backgrounds on the screen at updated positions.