How draw button in window in pygame

Question

I have this code in my program, if I click on the choosen area that the server start new game. How to do it that in this place will be button or a square with text 'new game'?

with socket.create_connection((SERVER, PORT)) as sock:
    with context.wrap_socket(sock, server_hostname="localhost") as client:
        session_id = None
        while True:
            #command = str(input("Podaj komendę"))
            #command = translate_pos_to_number(pos[0] // 200, pos[1] // 200)
            czy_wyjsc = True
            while czy_wyjsc:
                for event in pygame.event.get():
                    if event.type == pygame.QUIT:
                        running = False
                    if event.type == pygame.MOUSEBUTTONDOWN:
                        if pygame.mouse.get_pressed()[0]:  # [0] Jeśli lewy przycisk myszki jest kliknięty
                            pos = pygame.mouse.get_pos()
                            print(pos[0] // 200, pos[1] // 200)
                            czy_wyjsc = False
                            break
                surface.fill((20, 189, 172))

                grid.draw(surface)

                pygame.display.flip()

            if (pos[0] // 200 == 1, pos[1] // 200 == 3):
                command = "start"
                if command == "start":
                    login = np.random.randint(100, 999)
                    msg_start = f'To:SER\r\nLogin:{login}\r\nContent-length:5\r\nMessage:START\r\n\r\n'
                    client.sendall(msg_start.encode())

score 1 · Accepted Answer · edited Jun 19 '20 at 08:17

1

To create a button in pygame, you first need to add a font to your python program and then, create a label to show some text in that button:

font = pygame.font.SysFont("monospace", 30)
label = font.render("SomeText", 1, [COLOR])

After that, you need to create a rectangle on your screen:

pygame.draw.rect(YOUR_SCREEN, YOUR_COLOR ,(X_POS,Y_POS,X_SIZE,Y_SIZE),1)
YOUR_SCREEN.blit(label,(X_POS,Y_POS))

And after that, you only need to add the collision in your pygame events:

for events in pygame.event.get():
        if events.type == pygame.QUIT:
            pygame.quit()
        if events.type == pygame.MOUSEBUTTONDOWN:
                if pygame.Rect(X_POS,Y_POS,X_SIZE,Y_SIZE).collidepoint(pygame.mouse.get_pos()):
                    Your_Function() #Your_Function is the function you want to execute when clicking the button.

I hope I helped you ! (and if you have any questions, feel free to ask)

edited Jun 19 '20 at 08:17

sloth

99,095
21
171
219

answered Jun 19 '20 at 07:08

Romanov3

36
6

In your example, how does the text show up on the screen? – sloth Jun 19 '20 at 07:26
1

The text shows up on the screen with the `YOUR_SCREEN.blit(label, (X_POS, Y_POS))` – Romanov3 Jun 19 '20 at 07:36
It should work if you already have a pygame working screen. – Romanov3 Jun 19 '20 at 07:37
I see. I think you missed the variable assignment and took the liberty to add it to your answer. – sloth Jun 19 '20 at 08:18
Hi, I add following code ` font = pygame.font.SysFont("monospace", 30) label = font.render("New Game", 1, (0, 0, 0)) pygame.draw.rect(surface, (255,255,255), (200, 600, 200, 100), 1) surface.blit(label, (225,620))` but the background is transparent. How do it that it will be white bacground and text on it? – Kamil Stępniewski Jun 19 '20 at 11:42
1

Hello kamil, to put the background, you simply have to modify the draw rect line like that: `pygame.draw.rect(YOUR_SCREEN, YOUR_COLOR ,(X_POS,Y_POS,X_SIZE,Y_SIZE))` (I just removed ",1" from the line) – Romanov3 Jun 19 '20 at 11:46
1

just do that: `pygame.draw.rect(surface, (255,255,255), (200, 600, 200, 100))` – Romanov3 Jun 19 '20 at 11:51
Thanks, could you also read this question? https://stackoverflow.com/questions/62459547/why-text-display-for-2-seconds-in-pygame – Kamil Stępniewski Jun 19 '20 at 11:57
of course, i'll take a look, if I understand, it's the next part of your program, am I right ? – Romanov3 Jun 19 '20 at 11:58
Sorry, I need more informations to help you with the other question. – Romanov3 Jun 19 '20 at 12:03
please add comment what you need in question https://stackoverflow.com/questions/62459547/why-text-display-for-2-seconds-in-pygame – Kamil Stępniewski Jun 19 '20 at 12:06
I can't, I don't have enough reputation :( and honestly, I don't really know how I could solve your new issue just by the snippet you posted – Romanov3 Jun 19 '20 at 12:08

How draw button in window in pygame

1 Answers1