Wie implementiere ich Optionsschaltflächen und ändere die Schaltflächenfarbe in PyGame?

Nov 29 2020

Bitte schlagen Sie vor, wie ich die Farbe der Taste ändern kann, wenn ich sie drücke, und die Farbe der ersten Taste wird in die Standardfarbe geändert, wenn ich die zweite Taste drücke.

Wenn ich beispielsweise auf die Schaltfläche GERADE geklickt habe, wird die Schaltfläche grün, und wenn ich auf die Schaltfläche LINKS klicke, ändert sich die Schaltfläche LINKS in grüne Farbe, und die Schaltfläche GERADE wird zur Standardfarbe, die weiße Farbe ist. Danke im Voraus :)

CODE:

def draw_button(self):

    global clicked
    action = False

    # get mouse position
    pos = pygame.mouse.get_pos()

    # create pygame Rect object for the button
    button_rect = Rect(self.x, self.y, self.width, self.height)

    # check mouseover and clicked conditions
    if button_rect.collidepoint(pos):
        if pygame.mouse.get_pressed()[0] == 1:
            clicked = True
            pygame.draw.rect(screen, self.click_col, button_rect)
        elif pygame.mouse.get_pressed()[0] == 0 and clicked == True:
            clicked = False
            action = True
           
        else:
            pygame.draw.rect(screen, self.hover_col, button_rect)
    else:
        pygame.draw.rect(screen, self.button_col, button_rect)

Antworten

1 Rabbid76 Nov 29 2020 at 19:01

Wenn Sie die Schaltfläche zeichnen, müssen Sie die Farbe abhängig von der globalen Variablen festlegen clicked:

def draw_button(self):

    global clicked
    
    # get mouse position
    pos = pygame.mouse.get_pos()

    # create pygame Rect object for the button
    button_rect = Rect(self.x, self.y, self.width, self.height)

    # check mouseover and clicked conditions
    hover = button_rect.collidepoint(pos)
    if hover and pygame.mouse.get_pressed()[0] == 1:
        clicked = not clicked

    color = self.button_col
    if clicked:
        color = self.click_col
    elif hover:
        color = self.hover_col

    pygame.draw.rect(screen, color, button_rect)

Das wird Sie jedenfalls nicht zufrieden stellen, da pygame.mouse.get_pressed()eine Liste von Booleschen Werten zurückgegeben wird, die den Status ( Trueoder False) aller Maustasten darstellen. Der Status einer Taste ist Trueso lange, wie eine Taste gedrückt gehalten wird.
Sie müssen MOUSEBUTTONDOWNevent verwenden. Das MOUSEBUTTONDOWNEreignis tritt einmal auf, wenn Sie mit der Maustaste klicken, und das MOUSEBUTTONUPEreignis tritt einmal auf, wenn die Maustaste losgelassen wird. Das pygame.event.Event()Objekt verfügt über zwei Attribute, die Informationen zum Mausereignis bereitstellen. posist ein Tupel, das die Position speichert, auf die geklickt wurde. buttonspeichert die Schaltfläche, auf die geklickt wurde.


Wenn Sie mehrere Schaltflächen haben, mit denen Sie interagieren müssen, reicht ein einziger clickedStatus nicht aus. Sie benötigen für jede Schaltfläche einen eigenen "angeklickten" Status. Wenn der angeklickte Status der Schaltfläche 1 angezeigt wird True, müssen die Status der anderen Tasten auf gesetzt werden False. Ich empfehle, dafür eine RadioButtonKlasse zu implementieren .

Siehe auch Maus und Sprite .

Minimales Beispiel:

import pygame

class RadioButton(pygame.sprite.Sprite):
    def __init__(self, x, y, w, h, font, text):
        super().__init__() 
        text_surf = font.render(text, True, (0, 0, 0))
        self.button_image = pygame.Surface((w, h))
        self.button_image.fill((96, 96, 96))
        self.button_image.blit(text_surf, text_surf.get_rect(center = (w // 2, h // 2)))
        self.hover_image = pygame.Surface((w, h))
        self.hover_image.fill((96, 96, 96))
        self.hover_image.blit(text_surf, text_surf.get_rect(center = (w // 2, h // 2)))
        pygame.draw.rect(self.hover_image, (96, 196, 96), self.hover_image.get_rect(), 3)
        self.clicked_image = pygame.Surface((w, h))
        self.clicked_image.fill((96, 196, 96))
        self.clicked_image.blit(text_surf, text_surf.get_rect(center = (w // 2, h // 2)))
        self.image = self.button_image
        self.rect = pygame.Rect(x, y, w, h)
        self.clicked = False
        self.buttons = None

    def setRadioButtons(self, buttons):
        self.buttons = buttons

    def update(self, event_list):
        hover = self.rect.collidepoint(pygame.mouse.get_pos())
        for event in event_list:
            if event.type == pygame.MOUSEBUTTONDOWN:
                if hover and event.button == 1:
                    for rb in self.buttons:
                        rb.clicked = False
                    self.clicked = True
        
        self.image = self.button_image
        if self.clicked:
            self.image = self.clicked_image
        elif hover:
            self.image = self.hover_image


pygame.init()
window = pygame.display.set_mode((300, 300))
clock = pygame.time.Clock()
font50 = pygame.font.SysFont(None, 50)

radioButtons = [
    RadioButton(50, 40, 200, 60, font50, "option 1"),
    RadioButton(50, 120, 200, 60, font50, "option 2"),
    RadioButton(50, 200, 200, 60, font50, "option 3")
]
for rb in radioButtons:
    rb.setRadioButtons(radioButtons)
radioButtons[0].clicked = True

group = pygame.sprite.Group(radioButtons)

run = True
while run:
    clock.tick(60)
    event_list = pygame.event.get()
    for event in event_list:
        if event.type == pygame.QUIT:
            run = False 

    group.update(event_list)

    window.fill(0)
    group.draw(window)
    pygame.display.flip()

pygame.quit()
exit()
GameDev Nov 29 2020 at 18:15
your_button_rect = pygame.Rect(x,y,width,height)
color = (0,0,0)
pos = pygame.mouse.get_pos()
def change_button_color():
    if your_button_rect.colliderect(pos):
        if event.type == pygame.MOUSEBUTTONDOWN: #checks if mouse button is pressed down while the cursor is on the rectangle
            color = (your_desired_Color_RGBvalue)

while True:
    pygame.draw.rect(screen,color,your_button_rect)
    change_button_color()