CODEWITHSUNDEEP
pythonpygamealpha
Ben McAlindin
Ben McAlindin

Reputation: 542

How to add an alpha value to surface objects in pygame?

I am trying to make a menu screen where the 'New Game' and 'Load Game' icons appear to have no box around them until the mouse is over them at which point they have an opaque blue box. I have yet to implement the mouse controls in the code as I currently cannot get the blue box to become opaque. Any advice would be great. Currently the screen is black when the code is run, however removing line 30 causes the screen to appear as it should but with no alpha values.

import random, pygame, sys
from pygame.locals import *

FPS = 30 # frames per second, the general speed of the program
WINDOWWIDTH = 1000 # size of the window's width in pixels
WINDOWHEIGHT = 600 # size of window's height in pixels

#            R    G    B
WHITE    = (255, 255, 255)
RED      = (255, 0, 0)
BLUEINVIS = (0, 0, 255, 255)
BLUEOP = (0, 0, 255, 128)

# Colors

TEXTCOLOR = WHITE
TEXTBOXCOLOR = BLUEINVIS
HIGHLIGHTCOLOR = BLUEOP

BASICFONTSIZE = 20


def main():
    global FPSCLOCK, DISPLAYSURF, BASICFONT
    pygame.init()
    FPSCLOCK = pygame.time.Clock()
    DISPLAYSURF = pygame.display.set_mode((WINDOWWIDTH, WINDOWHEIGHT))
    DISPLAYSURF = DISPLAYSURF.convert_alpha()
    pygame.display.set_caption('Menu')

    BASICFONT = pygame.font.Font('freesansbold.ttf', 50)


    NEW_SURF, NEW_RECT = makeText('New Game', TEXTCOLOR, TEXTBOXCOLOR, WINDOWWIDTH /     2, WINDOWHEIGHT - (WINDOWHEIGHT * 3 / 8))
    LOAD_SURF, LOAD_RECT = makeText('Load Game', TEXTCOLOR, TEXTBOXCOLOR, WINDOWWIDTH / 2, WINDOWHEIGHT - (WINDOWHEIGHT / 4))

    DISPLAYSURF.convert_alpha()

    while True: # main game loop

        DISPLAYSURF.fill(RED)
        DISPLAYSURF.blit(NEW_SURF, NEW_RECT)
        DISPLAYSURF.blit(LOAD_SURF, LOAD_RECT)


        for event in pygame.event.get(): # event handling loop
            #if event.type == MOUSEBUTTONUP:

                #if NEW_RECT.collidepoint(event.pos):

                #elif LOAD_RECT.collidepoint(event.pos):

            #if newRectObj.collidepoint(event.pos):
                #newSurfaceObj = fontObj.render('New Game', True, TEXTCOLOR, HIGHLIGHTCOLOR)            

            if event.type == QUIT:
                pygame.quit()
                sys.exit()

        pygame.display.update()
        FPSCLOCK.tick(FPS)

def makeText(text, color, bgcolor, x, y):
    # create the Surface and Rect objects for some text.
    textSurf = BASICFONT.render(text, True, color, bgcolor)
    textRect = textSurf.get_rect()
    textRect.center = (x, y)
    return (textSurf, textRect)

if __name__ == '__main__':
    main()

Upvotes: 0

Views: 959

Answers (2)

Frodon
Frodon

Reputation: 3775

If I replace your code by this snippet, it displays your text (white on blue) when the cursor hovers it (inspired from this SO question). I also added some transparency if you want (uncomment the set_alpha lines):

def main():
    global BASICFONT
    pygame.init()
    FPSCLOCK = pygame.time.Clock()
    DISPLAYSURF = pygame.display.set_mode((WINDOWWIDTH, WINDOWHEIGHT))
    background=pygame.Surface((DISPLAYSURF.get_rect().width, DISPLAYSURF.get_rect().height))
    background.fill(RED)

    BASICFONT = pygame.font.Font('freesansbold.ttf', 50)

    pygame.display.set_caption('Menu')

    NEW_SURF, NEW_RECT = makeText('New Game', TEXTCOLOR, TEXTBOXCOLOR, WINDOWWIDTH /     2, WINDOWHEIGHT - (WINDOWHEIGHT * 3 / 8))
    LOAD_SURF, LOAD_RECT = makeText('Load Game', TEXTCOLOR, TEXTBOXCOLOR, WINDOWWIDTH / 2, WINDOWHEIGHT - (WINDOWHEIGHT / 4))
    #NEW_SURF.set_alpha(128)
    #LOAD_SURF.set_alpha(128)

    while True: # main game loop

        DISPLAYSURF.blit(background, background.get_rect())
        DISPLAYSURF.blit(NEW_SURF, NEW_RECT)
        DISPLAYSURF.blit(LOAD_SURF, LOAD_RECT)

        for event in pygame.event.get(): # event handling loop
            if event.type == MOUSEMOTION:
                if NEW_RECT.collidepoint(event.pos):
                  NEW_SURF = BASICFONT.render('New Game', True, TEXTCOLOR, HIGHLIGHTCOLOR)
                  #NEW_SURF.set_alpha(255)

                elif LOAD_RECT.collidepoint(event.pos):
                  LOAD_SURF = BASICFONT.render('Load Game', True, TEXTCOLOR, HIGHLIGHTCOLOR)
                  #LOAD_SURF.set_alpha(255)

                else:
                  NEW_SURF = BASICFONT.render('New Game', True, TEXTCOLOR, TEXTBOXCOLOR)
                  LOAD_SURF = BASICFONT.render('Load Game', True, TEXTCOLOR, TEXTBOXCOLOR)
                  #NEW_SURF.set_alpha(128)
                  #LOAD_SURF.set_alpha(128)

Upvotes: 1

The-IT
The-IT

Reputation: 728

Use: surface = surface.convert_alpha()

Using surface.convert_alpha() alone does nothing. The convert_alpha() returns a suface with an alpha value.

http://www.pygame.org/docs/ref/surface.html#pygame.Surface.convert_alpha

Eg.: image1 = pygame.image.load("images/person.png").convert_alpha()

Upvotes: 1

Related Questions