Creating a button in python

Question

I'm trying to make an interactive game for special needs children, where you click on a button and it moves the photo on. I need some help however as when I run my code, the console prints "..." as it should when you click on the button, and when you click away from the buttons it does not. All is working there. No matter where you click above or below a button, it recognises it as the button. So it cannot distinguish the y coordinate column as not part of the button's co-ordinates. Help would be appreciated! See photos: [Game window][1]... Code:

import pygame
import random

pygame.init()
#define variables
BLACK = (0, 0, 0)
WHITE = (255, 255, 255)
GREEN = (0, 255, 0)
RED = (255, 0, 0)
background_colour = (255, 255, 255)
(width, height) = (700, 500)
x = 250
y = 100
mpos = pygame.mouse.get_pos()
mpress = pygame.mouse.get_pressed()
Button1 = 'photos/buttonCow.png'
Button2 = 'photos/buttonDuck.png'
Button3 = 'photos/buttonHorse.png'
Button4 = 'photos/buttonSheep.png'

imageOption1 = pygame.image.load(Button1)
imageOption2 = pygame.image.load(Button2)
imageOption3 = pygame.image.load(Button3)
imageOption4 = pygame.image.load(Button4)


screen = pygame.display.set_mode((width, height))
pygame.display.set_caption('Game!')
screen.fill(background_colour)
running = True


def buttons():
    if pygame.mouse.get_pos() >= (200, 400):
        if pygame.mouse.get_pos() <= (260, 430):
            print("horse")
    if pygame.mouse.get_pos() >= (300, 400):
        if pygame.mouse.get_pos() <= (360, 430):
            print("duck")
    if pygame.mouse.get_pos() >= (400, 400):
        if pygame.mouse.get_pos() <= (460, 430):
            print("cow")
    if pygame.mouse.get_pos() >= (500, 400):
        if pygame.mouse.get_pos() <= (560, 430):
            print("sheep")


def displayOptions():
    screen.blit(imageOption1, (400, 400))
    screen.blit(imageOption2, (300, 400))
    screen.blit(imageOption3, (200, 400))
    screen.blit(imageOption4, (500, 400))


def whichAnimalFunc():
    whichAnimal = random.randint(0, 4)
    if whichAnimal == 1:
        image = pygame.image.load('photos/cow.png')
        screen.fill(WHITE)
        screen.blit(image, (x, y))
        displayOptions()
        pygame.display.update()
    if whichAnimal == 2:
        image = pygame.image.load('photos/duck.png')
        screen.fill(WHITE)
        screen.blit(image, (x, y))
        displayOptions()
        pygame.display.update()
    if whichAnimal == 3:
        image = pygame.image.load('photos/horse.png')
        screen.fill(WHITE)
        screen.blit(image, (x, y))
        displayOptions()
        pygame.display.update()
    elif whichAnimal == 4:
        image = pygame.image.load('photos/sheep.jpg')
        screen.fill(WHITE)
        screen.blit(image, (x, y))
        displayOptions()
        pygame.display.update()
    else:
        pygame.QUIT


while running:
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            running = False  # allows quit button to work
        if event.type == pygame.MOUSEBUTTONDOWN:
            pos = pygame.mouse.get_pos()
            print(pos)
            buttons()
            whichAnimalFunc()
            pygame.display.update()```



  [1]: https://i.stack.imgur.com/xDCa0.png

IMHO, this code is going in a wrong direction. You have a lot of duplicate code which could be resolved by using object oriented design. That way you'll also get rid of all the variable names with numbers (you'll be able to use a list instead). — Thomas Weller, Jan 27 '20 at 11:51
Does this answer your question? [How does tuple comparison work in Python?](https://stackoverflow.com/questions/5292303/how-does-tuple-comparison-work-in-python) — Thomas Weller, Jan 27 '20 at 11:52
I think your current issue is related to the tuple comparison. You expect a comparison in a way like a 2D math coordinate system. That's not the case. Implement a function that takes 3 tuples as input (topleft, bottomright and current) and calculate the boolean logic for each x and y coordinate individually — Thomas Weller, Jan 27 '20 at 11:54

VVend · Answer 1 · 2020-01-27T13:55:02.937

4

You have to check coordinates separately. And don't forget the button size:

mx, my = pygame.mouse.get_pos()
if mx >= 200 and my >= 400 and mx < 200 + imageOption3.get_width() and my < 400 + imageOption3.get_height():
    print("horse")

Also you can shorten whole thing using list (if you are not familliar with objects):

gameData = [
# (buttonX, buttonY, name) - will be extended by button image
[400, 400, 'Cow'],
[500, 400, 'Duck'],
#...
]

# load buttons:
for item in gameData:
    item.append(pygame.image.load("photos/button%s.png"%item[2]))

def displayOptions():
    for button in gameData:
        screen.blit(button[3], (button[0], button[1]))

def buttons():
    mx, my = pygame.mouse.get_pos()
    for button in gameData:
        bx, by = button[0], item[1]
        bw, bh = button[3].get_size()
        if mx >= bx and my >= by and mx < bx+bw and my < by+bh:
            print(button[2])

# etc.

edited Jan 27 '20 at 13:55

answered Jan 27 '20 at 13:49

VVend

163
1
9

Thanks VVend! Doesnt seem to work, however. Thanks for the quick reply but could you possibly help any more? I have tried the first suggestion, however I do not understand the entire shortening with lists bit. What happens now, with the first suggestion implemented, is that the game completely ignores the fact it is a button and prints nothing. Thanks. – super coolie Jan 27 '20 at 16:28
First suggestion is replacement for your 'horse' condition in buttons() function and it should work. – VVend Jan 28 '20 at 20:01
'List solution' uses list gameData containing buttons definitions. So you can just iterate list items instead of writing code for each button. – VVend Jan 28 '20 at 20:04
List version here: https://wendigo.online-siesta.com/hidden/animalguess.py – VVend Jan 28 '20 at 20:45

Wouterr · Answer 2 · 2020-01-28T12:10:22.567

3

You can't just say pygame.mouse.get_pos() >= (200, 400), you have to say:

mouse_pos = pygame.mouse.get_pos()
if mouse[0] >= 200 and mouse[1] >= 400:
   # hovering

edited Jan 28 '20 at 12:10

answered Jan 27 '20 at 12:04

Wouterr

516
7
16

Creating a button in python

2 Answers2