CODEWITHSUNDEEP
pythonpygametransparencyblending
M_Sea
M_Sea

Reputation: 491

python pygame set color transparency

I want to create an tranparent button and text on the screen, i search for the way to do this, the fourth RGB parameter and set_alpha can transparent the color

So i use self.button_color=(0,100,100,128) to set the button and self.text.set_alpha(128) to change the color on text

But nothing change when i run the scripts

Here's the code:

#!/usr/bin/python
import sys,os
import pygame


class Setting():
    def __init__(self,width,height):
        self.w=width
        self.h=height
        self.flag=pygame.RESIZABLE
        self.screen=pygame.display.set_mode((self.w,self.h),self.flag)
        self.screen_rect=self.screen.get_rect()
        pygame.display.set_caption("Test")

class Button():
    def __init__(self,setting,text):            
        self.width,self.height = 400,100

        self.button_color=(0,100,100,128)

        self.text_color=(255,0,0)
        self.text = pygame.font.Font(None,100).render(text,True,self.text_color)
        self.text.set_alpha(128)
        self.rect = pygame.Rect(0,0,self.width,self.height)
        self.rect.center = setting.screen_rect.center
        self.text_rect = self.text.get_rect()
        self.text_rect.center = self.rect.center
    def draw_button(self,setting):
        setting.screen.fill(self.button_color,self.rect)
        setting.screen.blit(self.text,self.text_rect)


def game():
    pygame.init()
    setting=Setting(1200,800)
    button=Button(setting,'PLAY')
    while True:
        for event in pygame.event.get():
            if event.type == pygame.QUIT:
                sys.exit()
        setting.screen.fill((0,0,0))
        button.draw_button(setting)
        pygame.display.flip()
game()

Upvotes: 4

Views: 4323

Answers (1)

Rabbid76
Rabbid76

Reputation: 210880

Read the documentation of pygame.font.Font.render:

[...] Depending on the type of background and antialiasing used, this returns different types of Surfaces. For performance reasons, it is good to know what type of image will be used. [...] If the background is transparent a colorkey will be set. Antialiased images are rendered to 24-bit RGB images. If the background is transparent a pixel alpha will be included.

That means, if the antialias argument is True, then you have to set a transparent background color to generate a transparent text. e.g:

self.button_color=(0,100,100,128) # transparent alpha=128
self.text_color=(255,0,0)
self.text = pygame.font.Font(None,100).render(text,True,self.text_color, self.button_color)

Read the documentation of pygame.Surface.fill:

[...] The color argument can be either a RGB sequence, a RGBA sequence or a mapped color index. If using RGBA, the Alpha (A part of RGBA) is ignored unless the surface uses per pixel alpha (Surface has the SRCALPHA flag).

You have to create a pygame.Surface object with attribute SCRALPHA to draw a transparent rectangle:

rectsurf = pygame.Surface(self.rect.size,pygame.SRCALPHA)
rectsurf.fill(self.button_color)
setting.screen.blit(rectsurf,self.rect.topleft)

To achieve what you want, you have to blit the text on the rectangle, by using the special flag BLEND_MAX. draw_button just have to blit, the button rectangle, which contains the text, on the screen. e.g:

class Button():
    def __init__(self,setting,text):
        self.width,self.height = 400,100

        self.button_color=(0,100,100,128)
        self.text_color=(255,0,0,128)
        self.text = pygame.font.Font(None,100).render(text,True,self.text_color, self.button_color)

        self.rect = pygame.Rect(0,0,self.width,self.height)
        self.text_rect = self.text.get_rect()
        self.text_rect.center = self.rect.center

        self.btnsurf = pygame.Surface(self.rect.size,pygame.SRCALPHA)
        self.btnsurf.fill(self.button_color)
        self.btnsurf.blit(self.text, self.text_rect, special_flags=pygame.BLEND_MAX)

        self.rect.center = setting.screen_rect.center

    def draw_button(self,setting):
        setting.screen.blit(self.btnsurf,self.rect)

Upvotes: 4

Related Questions