[solved] Custom UI

[Kaen]

I'd like to know more about costumizing the user interface.

I'm using a imagemap on the main menu and it's working fine but when I enter the Preference menu and click on Return the imagemap is gone on the main menu and it shows the default menu without custom. Any tips on how can I fix this?

Also could you guys tell me what those shortcuts on the right botton of the page are called and how can I costumize them? If it's possible to remove them I'd like to know too.



Thanks!

[chewpower]

Maybe you should post the code you're using for customizing the menu?

what those shortcuts on the right botton of the page are called and how can I costumize them? If it's possible to remove them I'd like to know too.

Those are quick_menu screen. You can find the lines on screens.rpy that begins with this "screen quick_menu" all the way till the bottom. That's where the menus are declared. Now if you look in earlier lines, there should be this line "use quick_menu" in few other screens, that's where the quick_menu is "inserted" to the other screen that will display it.

You can remove them by commenting the "use quick_menu" parts. Or if you really don't need them, you can delete them including the "use quick_menu" lines in the screens.rpy.

[apricotorange]

I'm using a imagemap on the main menu and it's working fine but when I enter the Preference menu and click on Return the imagemap is gone on the main menu and it shows the default menu without custom. Any tips on how can I fix this?

If screens.rpy exists in your project and you're customizing the main menu by doing something other than editing screens.rpy, you're going to get surprising results.

[Kaen]

Thanks for the answers guys!

The main menu code on screens.rpy I got on a tutorial.

If I finish the game or move to the main menu after I started the game the main menu is the imagemap as it should be. But if I move to the main menu by clicking Return on the Preferences or Load/Save screen the main menu is the default one.

Code: Select all

screen main_menu:

    # This ensures that any other menu screen is replaced.
    tag menu

    # The background of the main menu.
    window:
        style "mm_root"

    # The main menu buttons.
    frame:
        style_group "mm"
        xalign .98
        yalign .98

        has vbox

        textbutton _("Start Game") action Start()
        textbutton _("Load Game") action ShowMenu("load")
        textbutton _("Preferences") action ShowMenu("preferences")
        textbutton _("Help") action Help()
        textbutton _("Quit") action Quit(confirm=False)

init -2 python:
    layout.imagemap_main_menu("menu_ground.jpg", "menu_hover.jpg", [
        (111, 248, 392 ,313, "Start Game"),
        (111, 313, 392, 378, "Load Game"),
        (48, 432, 237, 529, "Preferences"),
        (48,529,237,576, "Quit"),
        (48, 435, 237, 482, "Help"),
        ])

    # Make all the main menu buttons be the same size.
    #style.mm_button.size_group = "mm"

[chewpower]

I think this part is unnecessary, for it's basically the old default menu. Try removing this?

Code: Select all

    frame:
        style_group "mm"
        xalign .98
        yalign .98

        has vbox

        textbutton _("Start Game") action Start()
        textbutton _("Load Game") action ShowMenu("load")
        textbutton _("Preferences") action ShowMenu("preferences")
        textbutton _("Help") action Help()
        textbutton _("Quit") action Quit(confirm=False)

[Kaen]

I think this part is unnecessary, for it's basically the old default menu. Try removing this?

Ok let me try that

@edit
This didn't work. When I click Return then I get the default screen without anything (since the buttons are gone).

Code: Select all

screen main_menu:

    # This ensures that any other menu screen is replaced.
    tag menu

    # The background of the main menu.
    window:
        style "mm_root"    

init -2 python:
    layout.imagemap_main_menu("menu_ground.jpg", "menu_hover.jpg", [
        (111, 248, 392 ,313, "Start Game"),
        (111, 313, 392, 378, "Load Game"),
        (48, 432, 237, 529, "Preferences"),
        (48,529,237,576, "Quit"),
        (48, 435, 237, 482, "Help"),
        ])

    # Make all the main menu buttons be the same size.
    #style.mm_button.size_group = "mm"

[chewpower]

Ah I'm sorry, try the code described in this: Tutorial: Cutomizing Menus. I did the example in the "Main Menu & Yes/No Prompt" and it works wonders. You only need to do something like this.

Code: Select all

screen main_menu:

    # This ensures that any other menu screen is replaced.
    tag menu

    imagemap:
        ground "menu_ground.jpg"
        hover "menu_hover.jpg"
       
        hotspot (273,122,257,67) action Start()
        hotspot (273,208,257,67) action ShowMenu("load")
        hotspot (273,286,257,67) action ShowMenu("preferences")
        hotspot (273,366,257,67) action Help()
        hotspot (273,450,257,67) action Quit(confirm=False)

Note that hotspot (x,y,w,h) takes 4 parameters: x, y, width, and height of your button in the image.

[Kaen]

Thank you chewpower!

The code works perfectly =)