Button with different text size pygame

Question

I am creating a simulator in pygame for school. I have created 3 buttons, which change colur when you hover. However, I want one of the buttons to have smaller text in. Currently, to set the text I have it within a class, but not as a method. I have made the button smaller when calling it as an instance, but I am not sure how to make the text smaller for this button, without changing the text in the others.

this is my code for my button class

class button():
def __init__(self, color, x , y , width , height , text=''):
    self.color = color
    self.x = x
    self.y = y
    self.width = width
    self.height = height
    self.text = text

def draw(self,win,outline= None):
    if outline:
        pygame.draw.rect(win, outline, (self.x-2 , self.y-2, self.width+4, self.height+4),0)
    pygame.draw.rect(win, self.color, (self.x , self.y , self.width, self.height),0)

    if self.text != '':
        font = pygame.font.SysFont( "Times New Roman,Arial",40, bold = True)
        text = font.render(self.text, 1 , (0,0,0))
        win.blit(text, (self.x +(self.width/2 - text.get_width()/2), self.y + (self.height/2 - text.get_height()/2)))

def isOver(self,pos):
    if pos[0] > self.x and pos [0] < self.x + self.width:
        if pos [1] > self.y and pos[1] < self.y + self.height:
            return True

    return False

def redrawWindow():
    userButton.draw(win,(0,0,0))
    passButton.draw(win,(0,0,0))
    loginButton.draw(win,(0,0,0))

this is the code for creating the instances:

userButton = button((TURQUOISE), 300,225,400,100, 'Username' )
passButton = button((TURQUOISE), 300,350,400,100, 'Password' )
loginButton = button((TURQUOISE), 465,470,100,25, 'Login' )

score 0 · Accepted Answer · answered Nov 13 '20 at 13:08

Just add an additional argument textSize to the contrcutor of the button:

class button():
    def __init__(self, color, x , y , width , height , text='', textSize = 40):
        self.color = color
        self.x = x
        self.y = y
        self.width = width
        self.height = height
        self.text = text
        self.textSize = textSize 

    def draw(self,win,outline= None):
        # [...]

        if self.text != '':
            font = pygame.font.SysFont( "Times New Roman,Arial", self.textSize, bold = True)

Pass the size of the text to the constructor. For isntance

userButton = button((TURQUOISE), 300,225,400,100, 'Username', 40)
passButton = button((TURQUOISE), 300,350,400,100, 'Password', 40) 
loginButton = button((TURQUOISE), 465,470,100,25, 'Login', 30)

However creating a font object is a very expensive operation. You should avoid creating the font once per frame or even once per button drawing. See How to render/blit text in pygame for good performance.

I recommend to create the different fonts once at the begin of the application:

font30 = pygame.font.SysFont("Times New Roman,Arial", 30, bold = True)
font40 = pygame.font.SysFont("Times New Roman,Arial", 40, bold = True)

Add font attribute to the class instead of the text size attribute:

class button():
    def __init__(self, color, x, y, width, height, font, text=''):
        self.color = color
        self.x = x
        self.y = y
        self.width = width
        self.height = height
        self.font = font
        self.text = text

    def draw(self,win,outline= None):
        # [...]

        if self.text != '':
            text = self.font.render(self.text, 1 , (0,0,0))

Pass the font object to the constructor of button. For instance:

userButton = button((TURQUOISE), 300,225,400,100, font40, 'Username')
passButton = button((TURQUOISE), 300,350,400,100, font40, 'Password')
loginButton = button((TURQUOISE), 465,470,100,25, font30, 'Login')

Button with different text size pygame

1 Answers1