Text box render on top of main code in pygame? - pygame

Question

I have implemented text box code to my simulation but now it is not rendering the main code, or rendering on top of my main code so nothing is displayed but the box :(
Here is my text box code :
def textbox(font20):
input_box = pygame.Rect(300,225,400,100)
color_inactive =(TURQUOISE)
color_active = (0,255,249)
color = color_inactive
active = False
text = ""
done = False
font = font20
while not done:
for event in pygame.event.get():
if event.type == pygame.MOUSEBUTTONDOWN:
if input_box.collidepoint(event.pos):
active = not active
else:
active = False
color = color_active if active else color_inactive
if event.type == pygame.KEYDOWN:
if active:
if event.key == pygame.K_RETURN:
print(text)
text = ""
done = True
elif event.key == pygame.K_BACKSPACE:
text = text[:-1]
else:
text += event.unicode
# Render the current text.
text_surface = font.render(text, True, color)
# Resize the box if the text is too long.
width = max(200, text_surface.get_width()+10)
input_box.w = width
# Blit the text.
screen.blit(text_surface, (input_box.x+5, input_box.y+5))
# Blit the input_box rect.
pygame.draw.rect(screen, color, input_box, 2)
pygame.display.flip()
I also screen.blit to turquoise at the bottom where I draw the screen and flip it.

Answer 1

Did you remember to click in the box? ;)
There's also a bunch of minor issues:
The code doesn't have a definition for TURQUOISE.
The loop didn't handle the pygame.QUIT event.
It also needs to propagate this event to the outer-loop
As the box grew, it made a mess, I added a black rectangle to erase the old.
It did not return the text value.
With all these, quite minor, bugs fixed, it works pretty well. But just remember to click in the box first!
import pygame
# Window size
WINDOW_WIDTH = 400
WINDOW_HEIGHT = 400
### initialisation
pygame.init()
screen = pygame.display.set_mode( ( WINDOW_WIDTH, WINDOW_HEIGHT ) )
pygame.display.set_caption("Text Box Test")
BLACK = (0,0,0)
TURQUOISE = (0,154,196)
CYAN = (0,255,249)
def textbox(font20):
#input_box = pygame.Rect(300,225,400,100)
input_box = pygame.Rect(10,10,400,100)
color_background = BLACK # for erasing
color_inactive = TURQUOISE
color_active = CYAN
color = color_inactive
active = False
text = ""
done = False
font = font20
while not done:
for event in pygame.event.get():
if event.type == pygame.QUIT:
pygame.event.post( pygame.event.Event( pygame.QUIT ) ) # re-send the quit event to the next loop
done = True
elif event.type == pygame.MOUSEBUTTONDOWN:
if input_box.collidepoint(event.pos):
active = not active
else:
active = False
color = color_active if active else color_inactive
elif event.type == pygame.KEYDOWN:
if active:
if event.key == pygame.K_RETURN:
print(text)
#text = ""
done = True
elif event.key == pygame.K_BACKSPACE:
text = text[:-1]
else:
text += event.unicode
print( "DEBUG: text is now [%s]" % ( text ) )
# Render the current text.
text_surface = font.render(text, True, color)
# Resize the box if the text is too long.
width = max(200, text_surface.get_width()+10)
input_box.w = width
# Blit the input_box rect.
pygame.draw.rect(screen, color_background, input_box) # filled box to clear the old one
pygame.draw.rect(screen, color, input_box, 2)
# Blit the text.
screen.blit(text_surface, (input_box.x+5, input_box.y+5))
pygame.display.flip()
return text
font = pygame.font.SysFont('', 24)
textbox( font )
pygame.quit()