{"id":7225,"date":"2020-09-04T10:15:56","date_gmt":"2020-09-04T08:15:56","guid":{"rendered":"https:\/\/pythonprogramming.altervista.org\/?p=7225"},"modified":"2023-09-17T20:29:00","modified_gmt":"2023-09-17T18:29:00","slug":"buttons-in-pygame","status":"publish","type":"post","link":"https:\/\/pythonprogramming.altervista.org\/buttons-in-pygame\/","title":{"rendered":"How to make Buttons in pygame"},"content":{"rendered":"\n

A new version of the code here:<\/h2>\n\n\n\n
import pygame\n\n\nscreen = pygame.display.set_mode((800, 600))\nbuttons = pygame.sprite.Group()\nclass Button(pygame.sprite.Sprite):\n    ''' Create a button clickable with changing hover color'''\n\n    def __init__(self, text=\"Click\",\n                pos=(0,0), fontsize=16,\n                colors=\"white on blue\", hover_colors=\"red on green\",\n                command=lambda: print(\"No command activated for this button\")):\n\n        super().__init__()\n        self.text = text\n        self.command = command\n        self.colors = colors\n        self.original_colors = colors\n        self.fg, self.bg = self.colors.split(\" on \")\n        self.fgh, self.bgh = hover_colors.split(\" on \")\n        self.font = pygame.font.SysFont(\"Arial\", fontsize)\n        self.pos = pos\n        self.create_original()\n        self.create_hover_image()\n\n    def create_original(self):\n        self.image = self.create_bg(self.text, self.fg, self.bg)\n        self.original_image = self.image.copy()\n\n\n    def create_hover_image(self):\n        self.hover_image = self.create_bg(self.text, self.fgh, self.bgh)\n        self.pressed = 1\n        buttons.add(self)\n\n\n    def create_bg(self, text, fg, bg):\n        self.text = text\n        image = self.font.render(self.text, 1, fg)\n        self.rect = image.get_rect()\n        self.rect.x, self.rect.y = self.pos\n        bgo = pygame.Surface((self.rect.w, self.rect.h))\n        bgo.fill(bg)\n        bgo.blit(image, (0,0))\n        return bgo\n\n\n    def update(self):\n        ''' CHECK IF HOVER AND IF CLICK THE BUTTON '''\n        if self.rect.collidepoint(pygame.mouse.get_pos()):\n            self.image = self.hover_image\n            self.check_if_click()\n        else:\n            self.image = self.original_image\n\n\n    def check_if_click(self):\n        ''' checks if you click on the button and makes the call to the action just one time'''\n        if self.rect.collidepoint(pygame.mouse.get_pos()):\n            if pygame.mouse.get_pressed()[0] and self.pressed == 1:\n                # print(\"Execunting code for button '\" + self.text + \"'\")\n                self.command()\n                self.pressed = 0\n            if pygame.mouse.get_pressed() == (0,0,0):\n                self.pressed = 1\n\n\nif __name__ == \"__main__\":\n# Hello, this is a snippet\n\n    pygame.init()\n\n    pygame.display.set_caption('Example of button')\n    screen = pygame.display.set_mode((1000, 800))\n    clock = pygame.time.Clock()\n\n    def window():\n        b1 = Button(\"CLICK ME\", pos=(100,100),\n            fontsize=36,\n            colors=\"red on green\",\n            hover_colors=\"green on red\",\n            command=lambda: print(\"clicked right now\"))\n\n\n    window()\n\n\n    is_running = True\n    while is_running:\n\n        for event in pygame.event.get():\n         if event.type == pygame.QUIT:\n             is_running = False\n\n        # to show buttons created\n        buttons.update()\n        buttons.draw(screen)\n\n        pygame.display.update()\n        clock.tick(60)\n\n    pygame.quit()<\/pre>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n
If you go over the button, it will change the color. If you click it it will do some action (in the example, it will just print a text on the terminal.<\/p>\n\n\n\n
Repository<\/h2>\n\n\n\n
https:\/\/github.com\/formazione\/pygame_widgets<\/a><\/p>\n\n\n\n
There’s an update to this code, you can find it at the end of this post and also in this new post: https:\/\/pythonprogramming.altervista.org\/button-widget-in-pygame-updated\/<\/a>. I added the command to each button. The style is sick, so, go check it.<\/p>\n\n\n\n
<\/p>\n\n\n\n
Welcome to our blog about creating buttons in Pygame<\/strong>! In this post, we will be discussing the step-by-step process of creating buttons <\/strong>in Pygame. Buttons are an essential element of any user interface, and they allow users to interact with the program. Pygame provides an easy and straightforward way to create buttons for your game or application. We will cover topics such as creating a basic window<\/strong>, creating a class for the Button<\/strong>, rendering text<\/strong> to show on the button, creating a surface<\/strong> with the size of the text, giving the surface a color <\/strong>or image<\/strong>, blitting the text on the surface, creating a method to change the text of the button, blitting the button surface on the screen, and intercepting the click of the mouse<\/strong>. By the end of this post, you will have a solid understanding of how to create buttons in Pygame and implement them into your projects.<\/p>\n\n\n\n
Github repository with the code for buttons in pygame<\/h2>\n\n\n\n
Click on this link to get the code to make buttons with pygame.<\/p>\n\n\n\n
https:\/\/github.com\/formazione\/pygame_button<\/a><\/p>\n\n\n\n
Repository with a quiz that uses buttons and labels in pygame<\/p>\n\n\n\n
https:\/\/github.com\/formazione\/pygame_quiz.git<\/a><\/p>\n\n\n\n
How to make a button in pygame<\/h2>\n\n\n\n
So here is the steps we will follow in the process of making a button: <\/p>\n\n\n\n