How to deal with a wrap-around rectangle for an object in pygame if the object's coordinates are at (0,0)

Question

I have some code to wrap a rectangle around some text in pygame:

import pygame as pg
font = pg.font.SysFont("Comic Sans MS", 30)

def wrapRect(obj, color='Black'):
    rect = obj.get_rect()
    pg.draw.rect(obj, color, rect.inflate(10,10), 2)
    return obj

playButton = wrapRect(font.render('Play', True, 'Black'))
screen.blit(playButton, (200, 170))

I made wrapRect to wrap a rectangle around the object given as a parameter.

This code doesn't work because before the blit() function places the text at the desired coordinates, I'm assuming the play button's default coordinates were (0,0), so when I used the inflate() function, it made those coordinates negative. As a result, the surrounding rectangle did not show. How do I make it so that wrapRect takes into account the fact that I may want to reposition the object beyond (0,0)?

Answer 1

You can interpret this line of code "pg.draw.rect(object, color[r,g,b], rect[x,y,w,h], width)" as drawing a (w,h) size, (r,g,b) color, (width) size border rectangle at the (x,y) position of the object on the object.

Yes, it is at the (x,y) position of the object, which means that the surface has a separate coordinate system from the screen. Like you cannot see the part drawn outside the screen, you can not see the part drawn outside the surface (ie. negative coordinate).

In the "wrapRect" function, you inflate the rect of the text surface, which will cause the coordinate of the rect to become negative. You also set the border width to 2, so you can not see anything drawn on the text surface. If you set the width to 0, which means fill, you will see the text surface be filled with color.

To solve this, you can create a rect surface (background), and then draw the border and text surface on the rect surface.

def wrapRect(obj,color='Black'):
    obj_rect=obj.get_rect()
    inflated_rect=obj_rect.inflate((10,10))
    nw,nh=inflated_rect.size
    # create a new surface called rect_surf
    # you can think of it as the background of the button
    rect_surf=pygame.Surface((nw,nh))
    rect_surf.fill('White')
    # draw the border on rect_surf
    pygame.draw.rect(rect_surf,color,(0,0,nw,nh),2)
    # draw obj on the center of rect_surf
    obj_rect.center=nw//2,nh//2
    rect_surf.blit(obj,obj_rect)
    return rect_surf

Now you can draw the button not only at (0,0) but also at other coordinates. (just change the coordinate of "screen.blit()")