How to make a popup radial menu in Pygame?

Question

I was wondering if anybody could give me any advice on how to create a radial menu with options e.g. 'Attack', 'Talk' that automatically pops up when you click on an object within the game... kind of like the radial menus used in numerous strategy/RPG games etc.

I'm quite new to Python/Pygame so please explain as fully as possible.

Thanks in advance, Ilmiont

Answer 1

I've actually used this quite recently in one of my games that I am programming. So what you need to do generally is check for clicking of the sprite/object.

#example
def make_popup(self):
    popupSurf = pygame.Surface(width, height)
    options = ['Attack',
               'Talk']
    for i in range(len(options)):
        textSurf = BASICFONT.render(options[i], 1, BLUE)
        textRect = textSurf.get_rect()
        textRect.top = self.top
        textRect.left = self.left
        self.top += pygame.font.Font.get_linesize(BASICFONT)
        popupSurf.blit(textSurf, textRect)
    popupRect = popupSurf.get_rect()
    popupRect.centerx = SCREENWIDTH/2
    popupRect.centery = SCREENHEIGHT/2
    DISPLAYSURFACE.blit(popupSurf, popupRect)
    pygame.display.update()

OK so now to explain this and how it all works.

The line with popupSurf = pygame.Surface creates popupSurf as a surface to draw things to.

Options is pretty self explanatory. Then we have a for loop which will take all of the options and display each one individually. So next is textSurf = BASICFONT... BASICFONT is the font that you create in the beginning my favorite personally is to use SysFont because it is easy to use with py2exe.

So then is textRect, this creates a rect to use when blitting your text to the screen. Then you change the top coordinate to whatever is the current top coordinate. Which you then do the same to the left. However the next line 'self.top += ...' is to adjust for the text previously blitted to the screen so you don't end up with text over text over text. Then you just blit it to popupSurf.

After every option is blitted to the popupSurf you then need to blit popupSurf to your main surface which is created using 'pygame.display.set_mode' at the beginning of your program. From all of the information you gave it is assumed that you wanted the popup to appear in the center of the screen so I took the centerx and the centery and centered them on the screen. Then all there is left to do is blit it to the screen and update the display. Please comment if you don't fully understand.

Answer 2

To do that just have the while loop constantly check where mouse is and then check for the mouse to be clicked. Once the mouse has been clicked then check for what option is selected, and if the option is None get out of the popup menu.

#example
def doPopup(self):
    #popup loop
    while True:
        #draw the popup
        make_popup(self)
        #check for keyboard or mouse events
        for event in pygame.event.get():
            if event.type == QUIT:
                pygame.quit()
                sys.exit()
            elif event.type == MOUSEMOTION:
                #update mouse position
                self.mousex, self.mousey = event.pos
            #check for left click
            elif event.type == MOUSEBUTTONDOWN and event.button == 1:
                OPTION = option_selected(self)
                if OPTION != None:
                    return OPTION'
                else:
                    return None
        FPSCLOCK.tick(FPS)

def option_selected(self):
    popupSurf = pygame.Surface(width, height)
    options = ['Attack',
               'Talk']
    #draw up the surf, but don't blit it to the screen
    for i in range(len(options)):
        textSurf = BASICFONT.render(options[i], 1, BLUE)
        textRect = textSurf.get_rect()
        textRect.top = self.top
        textRect.left = self.left
        self.top += pygame.font.Font.get_linesize(BASICFONT)
        popupSurf.blit(textSurf, textRect)
        if textSurf.collidepoint(self.mousex, self.mousey):
            return options[i]
    popupRect = popupSurf.get_rect()
    popupRect.centerx = SCREENWIDTH/2
    popupRect.centery = SCREENHEIGHT/2