How do I scale a PyGame image (Surface) with respect to its center?

I am fairly new to pygame and am working on my first game. (So sorry if I'm asking a stupid question) I am trying to get the title of the game to slowly increase and decrease in size like a sort of breathing effect in order to make the home screen more visually appealing.

Here's what I've got to import the image:

name = self.dir_path + "pixeltitle.png"
self.pixeltitle = pg.image.load(name)
self.pixeltitlerect = self.pixeltitle.get_rect()
self.pixeltitlerect.center = (250,120)
self.screen.blit(self.pixeltitle,self.pixeltitlerect)

I've got a while loop in which I'm increasing the size of the rect, however it gets moved over to the right and downwards. Is there any way to increase the size and have the centre of the rect stay in the same place? Also is there a way of making the increase/decrease in size more smooth? Here's the rest of the code:

clicked = False
        grow = 0
        mode = 'grow'
        while not clicked:
            if grow>40:
                mode = 'shrink'
            if grow<1:
                mode = 'grow'
                self.pixeltitle = pg.transform.scale(self.pixeltitle,(400,400))


            if mode == 'grow':
                grow+=1
            else:
                grow-=1

            xsize=400+int(grow)
            ysize=400+int(grow)

            self.pixeltitle = pg.transform.scale(self.pixeltitle,(xsize,ysize))
            self.pixeltitlerect.center = (250,120)
            self.screen.blit(self.pixeltitle,self.pixeltitlerect)
            pg.display.flip()

You missed to update the size of self.pixeltitlerect after the Surface has been scaled:

self.pixeltitle = pg.transform.scale(self.pixeltitle,(xsize,ysize))

# size of surface has been changed get the new rectangle
self.pixeltitlerect = self.pixeltitle.get_rect()

self.pixeltitlerect.center = (250,120)
self.screen.blit(self.pixeltitle,self.pixeltitlerect)

Or even shorter (see pygame.Surface.get_rect()):

self.pixeltitle = pg.transform.scale(self.pixeltitle,(xsize,ysize))
self.pixeltitlerect = self.pixeltitle.get_rect(center = (250,120))
self.screen.blit(self.pixeltitle,self.pixeltitlerect)

Do not scale the original Surface. If the original Surface is scaled it will get distorted. Keep the original image self.pixeltitleorig and scale the original image:

self.pixeltitle = pygame.transform.scale(self.pixeltitleorig,(xsize,ysize))

See also Transform scale and zoom surface

See the example:

import pygame
pygame.init()
window = pygame.display.set_mode((500, 500))
clock = pygame.time.Clock()

class ScalingSurface:
    def __init__(self):
        name = "pixeltitle.png"
        self.pixeltitleorig = pg.image.load(name)
        self.pixeltitle     = self.pixeltitleorig
        self.pixeltitlesize = self.pixeltitle.get_size()
        self.pixeltitlerect = self.pixeltitle.get_rect()
        self.pixeltitlerect.center = (250,120)
        self.mode = 'grow'
        self.grow = 0

    def update(self):
        if self.grow > 40:
            self.mode = 'shrink'
        if self.grow<1:
            self.mode = 'grow'
        self.grow += 1 if self.mode == 'grow' else -1

        xsize = self.pixeltitlesize[0] + round(self.grow)
        ysize = self.pixeltitlesize[1] + round(self.grow)
        self.pixeltitle = pygame.transform.scale(self.pixeltitleorig,(xsize,ysize))
        self.pixeltitlerect = self.pixeltitle.get_rect(center = (250,120))

    def draw(self, surf):
        surf.blit(self.pixeltitle,self.pixeltitlerect)

img = ScalingSurface()
run = True
while run:
    clock.tick(60)
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            run = False

    window.fill(0)
    img.update()
    img.draw(window)
    pygame.display.flip()

How do I scale a PyGame image (Surface) with respect to its center?

Related

Recent Posts