[How?] Specific Menu Custom Button

[mahoop]

I saw I can customize my menu buttons with pre-made images. But I cannot find a way to change the image of the buttons of a specific menu of the game.
I want to make just my first menu choice be different. This is possible?
My first menu is a normal menu like:

Code: Select all

menu:
        "yes!":
            jump accepted
        "No!":
            jump denied

[IrinaLazareva]

create the menu by screen and issue it somehow
https://www.renpy.org/doc/html/screens.html
https://www.renpy.org/doc/html/screen_actions.html
for example:

Code: Select all

screen Special_select:
    textbutton("Yes!): 
        area(25, 25, 200, 40)
        background "Button.png"
        hover_background "ButtonActivated.png"
        hover_sound "synthwoosh.wav"
        activate_sound "click.wav"
        action Jump("accepted")
    textbutton("No!"): 
        area(25, 70, 200, 40)
        background "Button.png"
        hover_background "ButtonActivated.png"
        hover_sound "synthwoosh.wav"
        activate_sound "click.wav"
        action Jump("denied")

then after a label start:

Code: Select all

label start:
    "......"
    call screen Special_select   #call our special menu
    "....."
    return
    
label accepted:
    "...1."
    menu:
        "This is standard menu"
        "Go to West":
            pass
        "Go to North":
            pass
    return
label denied:
    "..2."
    menu:
        "This is standard menu"
        "Go to East":
            pass
        "Go to South":
            pass    
    return

[namastaii]

This is how I have custom menus

First, define the style you want for the menu choice. Something like:

Code: Select all

    style.menu_choice_custom_button.set_parent(style.menu_choice_button)
    style.menu_choice_custom_button.background=Frame("mycustombutton.png",25,25)
    style.menu_choice_custom_button.font = "myfont.ttf"
    style.menu_choice_custom_text.font = "myfont.ttf"
    style.menu_choice_custom_text.size = 30
    style.menu_choice_custom_text.hover_color = "ffffff"

This is just an example. You get the idea. And you can change 'custom' to whatever you want and make multiple styles too.

Then you're going to need to go into your screens.rpy and add in some lines. This is what it should basically look like. (for the menu choice screen)

Code: Select all

screen choice:

    window:
        style "menu_window"
        xalign 0.5
        yalign 0.5

        vbox:
            style "menu"
            spacing 2

            for caption, action, chosen in items:

                if action:
                    if "(custom)" in caption:
                        $ caption = caption.replace(" (custom)", "")
                        button:
                            action action
                            style "menu_choice_custom_button"
                            text caption style "menu_choice_custom_text"
           
                            
                            
                    else:
                    
                        button:
                            action action
                            style "menu_choice_button"

                            text caption style "menu_choice"

                else:
                    text caption style "menu_caption"



init -2:
    $ config.narrator_menu = True

    style menu_window is default

    style menu_choice is button_text:
        clear

    style menu_choice_button is button:
        xminimum int(config.screen_width * 0.75)
        xmaximum int(config.screen_width * 0.75)

So now when you put (custom) next to your text in your menu option, it is programmed to hide that from showing and also changing the style of the button.

When you create a menu:

Code: Select all

menu:
    "This is a custom menu choice (custom)":
        # do something
    "This is a normal menu choice":
        # do something

In this example, the first menu choice is going to look the way you set up your custom style and the second choice is going to look like the default.

[mahoop]

@IrinaLazareva
Thanks for the tip. Know about screen function will help me in the future!

@namastaii
Everything worked perfectly! Thank you!

There is a way to make a "hover" animation like the common menus?

[namastaii]

animation?

[mahoop]

animation?

The default in-game menus have an sprite change when you pass with the mouse over it or click. I want to do the same with the custom one.

[namastaii]

I'm not entirely sure what you mean but hover_color changes the color when you hover over it (mouse passing over it)

[mahoop]

Can I put an image instead of the color?

[namastaii]

yes you can do it for both hotspots and imagebuttons.

Code: Select all

imagebutton:
  idle "youridleimage.png"
  hover "yourhoverimage.png"

Code: Select all

imagemap:
  ground "ground.png"
  idle "idle.png"
  hover "hover.png"

  hotspot(20,20,20,20) action #something

and then when you hover over the hotspot, it will take on the hover image you set for the imagemap.
or you can do the imagebutton in the first example.

edit****: oh yeah, sorry i forgot we were talking about menu choices.

Code: Select all

style.menu_choice_custom_button.hover_background="image.png"

I think is what you're looking for

[mahoop]

yes you can do it for both hotspots and imagebuttons.

Code: Select all

style.menu_choice_custom_button.hover_background="image.png"

I think is what you're looking for

Perfect! Thank you for your help!

[AnnieTiamat]

Sorry to year-plus-later thread-necro, but I'm attempting to try this out with the new GUI format, and hitting walls. If I can appeal for any advice or wisdom, my thread is here!