How to fade in a text or an image with PyGame

Question

Can someone help me on this ? :

I try to make a title that appear smoothly on the user screen :

def image(name,x,y,u):
   screen.blit(name,(x,y))
   if u = 1
      pygame.display.update()

Window == 'main'
While windows = 'main':
   image(background,0,0)
   image(title, 640, 120)
   pygame.display.update()

But texte appaers suddently and not as I would like...

What do you mean, when you write "as I would like..."? How would you like it, then? — mbuechmann, Feb 08 '19 at 13:43
Alright. Please be so kind and add that info to your question. — mbuechmann, Feb 08 '19 at 13:47
Sorry I was offline during some days, a little problem, but yes I think It's okay — , Feb 23 '19 at 19:35

Rabbid76 · Answer 1 · 2019-02-08T17:25:51.627

pygame.Surface.blit() already does what you want. It bends a surface to an other surface, depended on its alpha channel. All you have to do is to set the alpha channel by pygame.Surface.set_alpha():

image.set_alpha(min(1.0,alpha)*255)

Write a function, which "blends" a surface to the screen. In the following function BlendSurface, the parameter alpha is the opacity value of the surface in range[0, 1]. 0.0 would generate a completely transparent (invisible) surface. 1.0 would generate a completely opaque surface:

def BlendSurface(image, pos, alpha):
    image.set_alpha(min(1.0,alpha)*255)
    screen.blit(image, pos)

See the simple demo program:

import pygame
import pygame.font
pygame.init()

BLUE    = (  0,   0, 255)
YELLOW  = (255, 255,   0)

size = (800,600)
screen = pygame.display.set_mode(size)

def BlendSurface(image, pos, alpha):
    image.set_alpha(min(1.0,alpha)*255)
    screen.blit(blendImage, pos)

clock = pygame.time.Clock()

font = pygame.font.SysFont('Times New Roman', 100)
text = font.render('blend text', False, YELLOW)

i = 0
done = False
while not done:
    clock.tick(60)
    i += 1
    if i > 200:
        i = 0

    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            done = True

    screen.fill(BLUE)
    BlendSurface(text, (100, 100), i/200) 
    pygame.display.flip()

score 1 · Accepted Answer · edited Jun 20 '20 at 09:12

You want to use transparency, and pygame uses three different types:

There are three types of transparency supported in pygame: colorkeys, surface alphas, and pixel alphas. Surface alphas can be mixed with colorkeys, but an image with per pixel alphas cannot use the other modes. Colorkey transparency makes a single color value transparent. Any pixels matching the colorkey will not be drawn. The surface alpha value is a single value that changes the transparency for the entire image. A surface alpha of 255 is opaque, and a value of 0 is completely transparent.

Per pixel alphas are different because they store a transparency value for every pixel. This allows for the most precise transparency effects, but it also the slowest. Per pixel alphas cannot be mixed with surface alpha and colorkeys.

So let's use colorkey to create a transparent Surface and blit some text to it, and then use surface alpha to create the fade in effect by calling set_alpha and the Surface:

import pygame

def main():
    screen = pygame.display.set_mode((300, 100))
    FONT = pygame.font.SysFont(None, 64)
    text = FONT.render('Hello World', False, pygame.Color('darkorange'))
    surf = pygame.Surface(text.get_rect().size)
    surf.set_colorkey((1,1,1))
    surf.fill((1,1,1))
    surf.blit(text, (0, 0))
    clock = pygame.time.Clock()
    alpha = 0
    while True:
        for e in pygame.event.get():
            if e.type == pygame.QUIT:
                return

        alpha = (alpha + 1) % 256
        surf.set_alpha(alpha)
        
        screen.fill(pygame.Color('dodgerblue'))
        screen.blit(surf, (20, 20))
        clock.tick(120)
        print(alpha)
        pygame.display.update()

if __name__ == '__main__':
    pygame.init()
    main()

How to fade in a text or an image with PyGame

2 Answers2

Linked

Related