Styling specific menu choices

Discuss how to use the Ren'Py engine to create visual novels and story-based games. New releases are announced in this section.
Forum rules
This is the right place for Ren'Py help. Please ask one question per thread, use a descriptive subject like 'NotFound error in option.rpy' , and include all the relevant information - especially any relevant code and traceback messages. Use the code tag to format scripts.
Post Reply
Message
Author
User avatar
Arowana
Miko-Class Veteran
Posts: 531
Joined: Thu May 31, 2012 11:17 pm
Completed: a2 ~a due~
Projects: AXIOM.01, The Pirate Mermaid
Organization: Variable X, Navigame
Tumblr: navigame-media
itch: navigame
Contact:

Styling specific menu choices

#1 Post by Arowana »

Hi all! I was wondering if there was a way to change the style (background image, color, etc.) of a specific menu choice based on a variable. Right now, I am duplicating each choice with different text tags based on my variable, e.g.:

Code: Select all

menu:
    "Choice is not colored." if variable == False: 
        jump next_part
    "{color=#99CCFF}Choice is colored blue.{/color}" if variable == True: # change color based on variable
        jump next_part
Of course, this is not very efficient and doesn't let me switch the choice background. What i really want is to define a new button style, which I can switch my choice to if variable == True.

I have seen how to grey out previously-chosen choices or how to alternate button styles in all the choice menus, but still can't figure out how to control the style of a specific choice. If anyone has any advice, I'd definitely appreciate it!

apricotorange
Veteran
Posts: 479
Joined: Tue Jun 05, 2012 2:01 am
Contact:

Re: Styling specific menu choices

#2 Post by apricotorange »

Depending on what you're doing, it might be sufficient to use interpolation in a text tag to specify a color, as follows:

Code: Select all

    $ coolcolor = '#F00'
    menu:
        "{color=[coolcolor]}... to ask her right away.":
            jump rightaway
        "... to ask her later.":
            jump later
You can squeeze a little more flexibility out of this using a style, with something like the following:

Code: Select all

    $ coolstyle = 'coolstyle_text'
    menu:
        "{=[coolstyle]}... to ask her right away.":
            jump rightaway
        "... to ask her later.":
            jump later
And define the style with

Code: Select all

    style.coolstyle_text.color="#f00"
If you actually need to customize the button based on some variable, you can modify the choice screen to restyle based on the caption. Here's a choice screen that adds support for a tag like "{buttonstyle=coolstyle}":

Code: Select all

init python:
    def split_choice_caption(caption):
        m = re.match("\{buttonstyle\=(.*)\}(.*)", caption)
        if m:
            return (m.group(2), m.group(1))
        return (caption, "")

screen choice:

    window: 
        style "menu_window"        
        xalign 0.5
        yalign 0.5
        
        vbox:
            style "menu"
            spacing 2
            
            for caption, action, chosen in items:
                $ caption = renpy.substitutions.substitute(caption)
                $ (caption, capstyle) = split_choice_caption(caption)
                if action:  

                    button:
                        action action
                        style style.menu_choice_button[capstyle]

                        text caption substitute False style style.menu_choice[capstyle]
                    
                else:
                    text caption style "menu_caption"
Then, specify the style:

Code: Select all

    style.menu_choice_button["coolstyle"].background = "#F00"
And then, the menu looks like this:

Code: Select all

    $ mystyle = 'coolstyle'
    menu:
        "{buttonstyle=[mystyle]}... to ask her right away.":
            jump rightaway
        "... to ask her later.":
            jump later

User avatar
Arowana
Miko-Class Veteran
Posts: 531
Joined: Thu May 31, 2012 11:17 pm
Completed: a2 ~a due~
Projects: AXIOM.01, The Pirate Mermaid
Organization: Variable X, Navigame
Tumblr: navigame-media
itch: navigame
Contact:

Re: Styling specific menu choices

#3 Post by Arowana »

apricotorange, you are awesome - I just tried your code, and it's exactly what I wanted! Thanks for replying so quickly, too!

A note to anyone else using the python code - you might need to write "import re" right before "def split_choice_caption(caption)" (no quotes).

Again, thanks a bunch! I'm glad I finally delurked and started using the help forum. :)

Post Reply

Who is online

Users browsing this forum: Bing [Bot], Google [Bot]