Develop Reference

When I use pygame.RESIZABLE my images get squished [duplicate]

I have the problem with pygame. Specifically, I stuck on how to resize the text proportionally to the window (window is re-sizable and with picture).
Here is my code.
import pygame
from pygame.locals import *
import numpy as np
import matplotlib.pyplot as plt
import argparse
import threading, os, sys, time
pygame.init()
pygame.display.set_caption("AI Battlehip Game")
FPS = pygame.time.Clock()
red = (255,0,0)
screen = pygame.display.set_mode((1200,700), HWSURFACE|DOUBLEBUF|RESIZABLE)
add_screen = screen.copy()
back_end_image_set = pygame.image.load(r'/Users/User1/Desktop/Project work/images/backgroundimage1.jpg')
screen.blit(pygame.transform.scale(back_end_image_set, (1200,700)), (0,0))
pygame.display.flip()
myFont = pygame.font.SysFont("monospace", 300)
label = myFont.render("Check 1", 40, (red))
add_screen.blit(pygame.transform.scale(label, (700, 500)), (0,0))
FPS.tick(60)
try:
while True:
pygame.event.pump()
event = pygame.event.wait()
if event.type == QUIT:
pygame.display.quit()
elif event.type == VIDEORESIZE:
screen = pygame.display.set_mode(event.dict['size'], HWSURFACE|DOUBLEBUF|RESIZABLE)
screen.blit(pygame.transform.scale(back_end_image_set, event.dict['size']), (0,0))
pygame.display.flip()
except:
raise
Any help will be fully appreciated.

First store the original size of the surface:
original_size = (1200,700)
screen = pygame.display.set_mode(original_size, HWSURFACE|DOUBLEBUF|RESIZABLE)
Then you've 2 options.
Option 1:
Use pygame.font and render the text to a surface:
myFont = pygame.font.SysFont("monospace", 300)
label = myFont.render("Check 1", 40, (red))
Scale the text surface by the ratio of the new window size and original window size and blit it to the surface:
pygame.event.pump()
event = pygame.event.wait()
if event.type == QUIT:
pygame.display.quit()
elif event.type == VIDEORESIZE:
screen = pygame.display.set_mode(event.dict['size'], HWSURFACE|DOUBLEBUF|RESIZABLE)
new_size = event.dict['size']
screen.blit(pygame.transform.scale(back_end_image_set, new_size), (0,0))
label_w = label.get_width() * new_size[0] // original_size[0]
label_h = label.get_height() * new_size[1] // original_size[1]
screen.blit(pygame.transform.scale(label, (label_w, label_h)), (0,0))
pygame.display.flip()
Option 2:
Use pygame.freetype:
import pygame.freetype
myFont = pygame.freetype.SysFont('monospace', 30)
Calculate the scaled size of the text area and render it directly to the resized screen. Note the text is scaled by the ratio of the new window width and original window width.
This implementation keeps the ration of the width and height of the text and doesn't stretch or squeeze the text:
pygame.event.pump()
event = pygame.event.wait()
if event.type == QUIT:
pygame.display.quit()
elif event.type == VIDEORESIZE:
screen = pygame.display.set_mode(event.dict['size'], HWSURFACE|DOUBLEBUF|RESIZABLE)
new_size = event.dict['size']
screen.blit(pygame.transform.scale(back_end_image_set, new_size), (0,0))
myFont.render_to(screen, (0, 0), "Check 1", fgcolor=red, size = 300 * new_size[0] // original_size[0])
pygame.display.flip()

Pygame player movement is being weird

I was making a pygame project and i made a square move and It would summon a square every frame and there would just be a line of squares.
I tried to update the screen every frame (Because i hadn't yet), but that did not work. Here is my code:
#Import Pygame
import pygame
#screen object(width, height)
screen_x = 750
screen_y = 600
screen = pygame.display.set_mode((screen_x, screen_y))
#Set the caption of the screen
pygame.display.set_caption('Game')
#Define a velocity, x, and y variable
velocity = 2.5x = 0.0y = 0.0
#Variable to keep our game loop running
running = True
#Game loop
while running:
# Initialing Color
color = (255,0,0)
if pygame.key.get_pressed()[pygame.K_w]:
y += 2.5
if pygame.key.get_pressed()[pygame.K_s]:
y -= 2.5
if pygame.key.get_pressed()[pygame.K_a]:
x -= 2.5
if pygame.key.get_pressed()[pygame.K_d]:
x += 2.5
# Drawing Rectangle
pygame.draw.rect(screen, color, pygame.Rect(x, y, 50, 50))
pygame.display.flip()
pygame.display.update()
# for loop through the event queue
for event in pygame.event.get():
# Check for QUIT event
if event.type == pygame.QUIT:
running = False

The entire scene is redrawn in every frame, therefore you have to clear the display in every frame:
import pygame
#screen object(width, height)
screen_x = 750
screen_y = 600
screen = pygame.display.set_mode((screen_x, screen_y))
#Set the caption of the screen
pygame.display.set_caption('Game')
#Define a velocity, x, and y variable
velocity = 2.5
x, y = 0, 0
color = (255,0,0)
clock = pygame.time.Clock()
running = True
while running:
clock.tick(100)
# for loop through the event queue
for event in pygame.event.get():
# Check for QUIT event
if event.type == pygame.QUIT:
running = False
keys = pygame.key.get_pressed()
x += (keys[pygame.K_d] - keys[pygame.K_a]) * velocity
y += (keys[pygame.K_s] - keys[pygame.K_w]) * velocity
# clear display
screen.fill((0, 0, 0))
# Drawing Rectangle
pygame.draw.rect(screen, color, pygame.Rect(x, y, 50, 50))
# update display
pygame.display.flip()
pygame.quit()
exit()
The typical PyGame application loop has to:
limit the frames per second to limit CPU usage with pygame.time.Clock.tick
handle the events by calling either pygame.event.pump() or pygame.event.get().
update the game states and positions of objects dependent on the input events and time (respectively frames)
clear the entire display or draw the background
draw the entire scene (blit all the objects)
update the display by calling either pygame.display.update() or pygame.display.flip()

The solution is very simple. You forgot to fill the screen with a color. Because your code just draw's a square to the screen surface every frame, and that's why it's drawing a line of squares. You have to fill the screen before drawing the things, because otherwise you will see an empty screen with that color, that you filled the surface with. Hope it helped.

How can i give my image an initial position before it starts moving with the mouse?

I'm working on this pygame game and i'm just getting started but got a bit confused because i want the image to move in the x-axis along with the mouse but when i run the program i want the image to show up at the center or the 'floor' but appears at the left side instead. This is my code and a screenshot of what's happening.
import pygame
import sys
pygame.init()
pygame.mixer.init()
WIDTH, HEIGHT = 400, 500
FPS = 60
TITLE = 'FOOD DROP'
SIZE = 190
# Colors
BLACK = (0, 0, 0)
WHITE = (255, 255, 255)
BLUE_SKY = (152, 166, 255)
# Display
SCREEN = pygame.display.set_mode((WIDTH, HEIGHT))
pygame.display.set_caption(TITLE)
# Surfaces
floor_surface = pygame.Surface((WIDTH, 100))
floor_surface.fill(BLUE_SKY)
floor_rect = floor_surface.get_rect(midbottom=(200, 500))
# Images
LOAD_DITTO = pygame.image.load('Graphics/ditto.png')
DITTO = pygame.transform.scale(LOAD_DITTO, (SIZE, SIZE))
# Time
CLOCK = pygame.time.Clock()
class Figure:
def draw_figure(self, mouse_x):
SCREEN.blit(DITTO, (mouse_x - 90, 330))
# Game loop
SCREEN_UPDATE = pygame.USEREVENT
# main_game = Main()
figure = Figure()
running = True
while running:
CLOCK.tick(FPS)
mx, my = pygame.mouse.get_pos()
for event in pygame.event.get():
if event.type == pygame.QUIT:
pygame.quit()
sys.exit()
SCREEN.fill(WHITE)
SCREEN.blit(floor_surface, floor_rect)
figure.draw_figure(mx)
pygame.display.update()
When i run the program, this happens:
And i want the image to appear right at the center or the x-axis, not the border, i don't know why is this happening. Just to state, that screenshot was taken when the mouse hadn't been placed over the display.

If the mouse pointer is not in the window (out of focus), the initial position of the mouse pointer is (0, 0). Therefore pygame.mouse.get_pos returns (0, 0). It is also not possible to set the mouse position with pygame.mouse.set_pos if it is not in the window.
Initialize the variables mx and mx with the center of the window. Change the mouse position only when the mouse pointer is in the window (in focus). pygame.mouse.get_focused can be used to test whether the mouse is in the window.
mx, my = SCREEN.get_rect().center
running = True
while running:
CLOCK.tick(FPS)
for event in pygame.event.get():
if event.type == pygame.QUIT:
running = False
if pygame.mouse.get_focused():
mx, my = pygame.mouse.get_pos()
SCREEN.fill(WHITE)
SCREEN.blit(floor_surface, floor_rect)
figure.draw_figure(mx)
pygame.display.update()
pygame.quit()
sys.exit()

surface doesn't disappear at the next frame

I'm pretty new to Python and programming in general.
I'm trying to draw a square (200px by 200px) on the screen when the user clicks on the screen.
I tried to create a surface and a rect around the surface ( when the user clicks on the screen) and then using the rect, placed the surface on the screen using the blit method.
for the x and y of the rect I used mouse position.
So, this in my head should have changed the position of the square whenever a user clicks somewhere else on the screen but it rather creates a new square every time.
so I have a couple of questions:
If the way I'm implementing this is wrong, then how can I implement this feature?
Shouldn't the square change place as Pygame draws it every frame?
Thank you :)
pygame.init()
# --- Column --------------- #
col_num = 8
col_size = 120
# --- Screen --------------- #
screen = pygame.display.set_mode((col_num * col_size, col_num * col_size))
screen.fill((255, 255, 255))
draw_board()
# --- Clock ---------------- #
clock = pygame.time.Clock()
white_player = Player()
# --- test surface --------- #
surface = pygame.Surface((200, 200))
surface.fill((255, 255, 255))
# --- Main Loop ------------ #
check = False
while True:
white_player.draw_piece()
for event in pygame.event.get():
if event.type == pygame.QUIT:
pygame.quit(), sys.exit()
if event.type == pygame.MOUSEBUTTONDOWN:
check = True
a_rect = surface.get_rect(center=pygame.mouse.get_pos())
print('here!')
if check:
screen.blit(surface, a_rect)
pygame.display.update()
clock.tick(60)
Output:
Even trying with a simple surface and a screen it doesn't work.
It adds another surface to the screen with the new x.
import pygame as pg
import sys
pg.init()
screen = pg.display.set_mode((400, 400))
clock = pg.time.Clock()
surface = pg.Surface((200, 200))
surface.fill((255, 255, 255))
xpos = 50
while True:
for event in pg.event.get():
if event.type == pg.QUIT:
pg.quit(), sys.exit()
xpos += 1
screen.blit(surface, (xpos, 100))
pg.display.flip()
clock.tick(60)

Oh, I just realized I forgot to fill the screen before each frame. fixed

Pygame: How to correctly use get_rect()

I'm trying to understand how get_rect() works. In this simple example, I have two images and want to obtain the location of the second and move the first image to the second image.
I have looked at a variety of examples online and cannot get this to work. What am I doing wrong?
import pygame, sys
from pygame.locals import *
import time
pygame.init()
FPS = 10 # frames per second setting
fpsClock = pygame.time.Clock()
# Set up the window
DISPLAYSURF = pygame.display.set_mode((600, 400), 0, 32)
pygame.display.set_caption('Test program for get_rect()')
WHITE = (255, 255, 255)
# Load two images
baseImg = pygame.image.load('image1.jpg')
spaceshipImg = pygame.image.load('image2.jpg')
DISPLAYSURF.fill(WHITE)
# Place one image at the bottom of the screen
DISPLAYSURF.blit(baseImg, (300, 300))
pygame.display.update()
# Place the second image at the top of the screen
DISPLAYSURF.blit(spaceshipImg, (300, 0))
pygame.display.update()
# Wait for one second
time.sleep(1)
# Obtain the rectangle for each image
baseRect = baseImg.get_rect()
spaceshipRect = spaceshipImg.get_rect()
# This is where I believe I'm going wrong
# I understand this to obtain the x,y of the spaceship image
# Set the xy coordinates for the top image to the xy of the bottom image
spaceshipRect.x = baseRect.x
spaceshipRect.y = baseRect.y
# Move the top image to new xy position
# However this doesn't work
DISPLAYSURF.blit(spaceshipImg, (spaceshipRect.x, spaceshipRect.y))
pygame.display.update()
while True:
for event in pygame.event.get():
if event.type == QUIT:
pygame.quit()
sys.exit()

First, images/pygame.Surfaces don't have a position, so you have to store the blit position in the rect. When you call the get_rect method of a pygame.Surface, Pygame creates a new rect with the size of the image and the x, y coordinates (0, 0). To give the rect other coords during the instantiation you can pass an argument to get_rect, mostly center or topleft is used. To move the rect later, you can change any of these attributes of the rect:
x,y
top, left, bottom, right
topleft, bottomleft, topright, bottomright
midtop, midleft, midbottom, midright
center, centerx, centery
size, width, height
w,h
Here's an example (press a or d to change the position of the rect and thereby the blit pos of the image):
import sys
import pygame as pg
BG_COLOR = pg.Color(80, 60, 70)
PLAYER_COLOR = pg.Color(90, 140, 190)
def main():
screen = pg.display.set_mode((640, 480))
clock = pg.time.Clock()
player_img = pg.Surface((40, 60))
player_img.fill(PLAYER_COLOR)
# Create a rect with the size of the image/pygame.Surface
# and immediately set it's topleft coords to (100, 300).
player_rect = player_img.get_rect(topleft=(100, 300))
done = False
while not done:
for event in pg.event.get():
if event.type == pg.QUIT:
done = True
if event.type == pg.KEYDOWN:
if event.key == pg.K_d:
# Set the center to these new coords.
player_rect.center = (400, 200)
if event.key == pg.K_a:
# Set the x coord to 300.
player_rect.x = 300
screen.fill(BG_COLOR)
screen.blit(player_img, player_rect)
pg.display.flip()
clock.tick(30)
if __name__ == '__main__':
pg.init()
main()
pg.quit()
sys.exit()