0

I'm making a game with pygame, but I have a problem that button does not work as a toggle.

while True:
mousepos = pygame.mouse.get_pos()
mouseclk = pygame.mouse.get_pressed()
game.fill((0,0,0))
game.blit(cic, (0,0))

if mouseclk[0] and 1227 > mousepos[0] > 1120 and 485 > mousepos[1] > 413:
    while True:
        game.blit(pbut_rgm84, (1120,413))
        pygame.mixer.music.load("sounds\se_beep.mp3")
        pygame.mixer.music.play(0)
        current_weaponinf = font.render(current_weapon[1], True, (255, 0, 0))
        game.blit(current_weaponinf, (930,45))
else:
    game.blit(but_rgm84, (1120,413))

This is my code for the button. As you know, If I click on that button, image of the button will be changed and sound will be played. But it will happen while i'm pressing on the button. So, I want to the button to be toggle type. Do you have any ideas on it?

scopchanov
  • 7,966
  • 10
  • 40
  • 68
  • Take a look at these [button examples](https://stackoverflow.com/a/47664205/6220679). Do you just want to swap an image when the button gets pressed once? – skrx Sep 23 '18 at 06:56

1 Answers1

2

EDIT 1: Sorry for the ramble. The answer is in the first part. The rest is just some notes on a more standard way to do what you asked for in PyGame. After all, the answer is not just for the OP, but everyone who visits this page.

EDIT 2: Notice also I had to change the code to lower down the FPS to 5 for this to work fine. The way you checked for a click meant that the mouse button was down for about 30 - 40 frames every click on my machine, hence resulting in 30 to 40 button toggles when only one was needed, so I had to lower down the FPS to 5 in the code. This is another reason why you might want to use the other method I described for event handling.


Answer:

I honestly appreciate the simple logic you used to check if the mouse click was in range of the object being pressed.

I could extend your code slightly to get the "toggle" type button you want (i.e, on a click, the image and sound changes. Click again, and the image and sound go back to normal).

However, I also would like to show you some better ways of dealing with mouse click events and click detection available in the Pygame module to improve your code. If you are interested and want to know what I mean, please read on after the code below. If you just wanna take the code and leave, I totally respect that (it's something I did a lot as well).

Here is your code modified to match your "toggle" button requirements (if I understood what you want to do right). Replace this with the part of your code you showed in your answer, but be aware that this may not work as I don't have your full code or the images / soundtracks you used :

toggle = False
pygame.mixer.music.load("sounds\se_beep.mp3")
pygame.mixer.music.play(-1)
pygame.mixer.music.pause()
clock = pygame.time.Clock()

while True:
    mousepos = pygame.mouse.get_pos()
    mouseclk = pygame.mouse.get_pressed()

    game.fill((0, 0, 0))
    game.blit(cic, (0, 0))

    if mouseclk[0] and 1227 > mousepos[0] > 1120 and 485 > mousepos[1] > 413:
        if toggle:
            toggle = False
            pygame.mixer.music.pause()
        else:
            toggle = True
            pygame.mixer.music.unpause()

    if toggle:
        game.blit(pbut_rgm84, (1120, 413))
        current_weaponinf = font.render(current_weapon[1], True, (255, 0, 0))
        game.blit(current_weaponinf, (930,45))
    else:
        game.blit(but_rgm84, (1120,413))

    clock.tick(5)

A Better Way: Handling Events

Handling mouse click events and in fact all other events is simple with what is called an event loop. Although there is a little bit more to it than this, for now we can say than an event loop checks for certain events triggered (such as key press, mouse click, quit game events) at every frame, and then triggers a callback function.

You already have one in your code! - At every loop in your while loop, you check if the mouse was clicked using mouseclk = pygame.mouse.get_pressed()

However this is incomplete and is not the standard way to implement event loops using the Pygame module. Here is how you do it (read the comment above each line to understand what it is doing) :

import pygame
from pygame.locals import *

...

# Main game loop - this is the while loop you have in your code. This is where frames are rendered on every new loop
while True: 
    #Get all event that have been triggered from the last frame
    events = pygame.event.get()

    # Now we go through each event separately
    for event in events:
        #Use an if statement to check what the event is. For example...
        if event.type == MOUSEBUTTONDOWN:  #If this event was a mouse button click
            print("Clicked")  #Do whatever function
        elif event.type == QUIT: #If this event was quitting the game, i.e: pressing the X button on the game window
            pygame.quit() #Close the game
        #and so on. You can have as many elifs to check all the events you need


   game.fill((0,0,0)) #... The rest of your code goes after the for loop (event loop)

So essentially in your main game loop (your while loop) you have inside it a for loop (the event loop), then after it back in the main while loop you have the rest of the code you need to run on every frame such as rendering images and animating sprites.


A Better Way: Rect Objects

You will find that to see if the mouse click position (x, y) was in range of the mouse button, you had to check if the mouse click's x value was in range of the X1 to X2 of the object you're clicking (top right and top left corners), and at the same time it also has to be in range Y1 to Y2 of the object (top right and bottom right corners), which effectively means the mouse was somewhere on the object when the mouse click event was triggered

For this, Pygame implements Rect objects. A rect can be explained as an imaginary rectangle with a width and height that you define when you create it ( I will show you how that is done in code below ). To be more realistic, it is a pygame object for storing rectangular co-ordinates (a range of all points within that rectangle).

Now the thing is that this rect object has methods like Rect.collidepoint, which will return True if the mouse click position is inside the rect. This is a more simplified, easier to understand way of detecting if a mouse click position is inside a rect or outside it.

So..

# Constructing a rect at position (0, 0) with width 100 and height 500
r = pygame.Rect(0, 0, 100, 50)

# Now lets assume that above there is code where a mouse click is detect and the position is stored in `mousepos`, where `mousepos[0]` is the X and `mousepos[1]` is the Y
# All we have to do now is tell pygame to check if this position is inside our Rect object *r* or not
if r.collidepoint(mousepos):
    print("You clicked inside an imaginary box")
else:
    print("You clicked outside my imaginary box")

# Simple!!!

Much easier and more readable! (especially after you remove the comments you will be dumbfounded by the simplicity of this (collidepoint means inside the rect).

In reality, this is not how you usually use rects, although it gives you the basic idea of what they are. Rects are used in a more object-oriented method where the button is a child class of the Pygame.sprite.Sprite class. Then you can assign a rect object as its self.image.rect property and use it from there. NOTE: this is not very detailed :D .

Also, this is not the only use of rects. You can check if one rect is inside another. You can check if a group of objects is inside a rect. You can even with only one line of code check whether one object of a group is inside a certain rect, and if so, remove it!


To understand more about how to code pygame from start to finish (as the extra part of this answer talking about events and rects is very incomplete and only there as a starting point), I would suggest this excellent yet very simple and easy to understand book. And all you need is a basic understanding of python syntax.