My animated main menu stays on top of my preferences/load/about screens

[Rainvillain]

Hi there,

I've been trying to figure out how to animate my main menu and think I turned a new leaf on it... but noticed that when I click on some of my main menu options (such as preferences, load game, about) the animation still plays on top of the popped up screen

Basically my animation will be is a few moving PNGs on top of a static background image. When I click on one of my menu options, the background image goes behind the popped up screen but the animated PNGs stay in front.

This is what the Main Menu section of my screens.rpy looks like. As you can see, I actually use the "Navigation" screen for my main menu.

Code: Select all

screen main_menu():
    ## This ensures that any other menu screen is replaced.
    tag menu

    style_prefix "main_menu"

    add gui.main_menu_background

    ## This empty frame darkens the main menu.
    frame:
        pass

    ## The use statement includes another screen inside this one. The actual
    ## contents of the main menu are in the navigation screen.
    use navigation

    if gui.show_name:

        vbox:
            text "[config.name!t]":
                style "main_menu_title"

            text "[config.version]":
                style "main_menu_version"


style main_menu_frame is empty
style main_menu_vbox is vbox
style main_menu_text is gui_text
style main_menu_title is main_menu_text
style main_menu_version is main_menu_text

style main_menu_frame:
    xsize 420
    yfill True

    background "gui/overlay/main_menu.png"



style main_menu_vbox:
    xalign 1.0
    xoffset -30
    xmaximum 1200
    yalign 1.0
    yoffset -30

style main_menu_text:
    properties gui.text_properties("main_menu", accent=True)

style main_menu_title:
    properties gui.text_properties("title")

style main_menu_version:
    properties gui.text_properties("version")

So then here is what the Navigation section of my screens.rpy file looks like (I've abbreviated part of it because it's got other stuff in there too)

Code: Select all

screen navigation():

    if main_menu:
        add "images/menu element.png" xpos 150 ypos 50 at pls_transform #THIS IS PART OF MY ANIMATED main menu
	add "images/menu element.png" xpos 150 ypos 50 at pls_transform #THIS IS ANOTHER PART OF MY ANIMATED main menu
    vbox:
        style_prefix "navigation"

        xpos gui.navigation_xpos
        yalign 0.84

        spacing gui.navigation_spacing


        if main_menu:

            #textbutton _("Start") action Start()
            textbutton "Start" action [Play("sfx1", "sfx/ui_first.opus"), Start() ]


        else:

            textbutton _("History") action ShowMenu("history")

            textbutton _("Save") action ShowMenu("save")


        textbutton _("Load") action ShowMenu("load")

        textbutton _("Preferences") action ShowMenu("preferences")

        if _in_replay:

            textbutton _("End Replay") action EndReplay(confirm=True)

        elif not main_menu:

            textbutton _("Main Menu") action MainMenu()

        textbutton _("Credits") action ShowMenu("about")

        if renpy.variant("pc"):

            ## Help isn't necessary or relevant to mobile devices.
            textbutton _("Help") action ShowMenu("help")

            ## The quit button is banned on iOS and unnecessary on Android.
            textbutton _("Quit") action Quit(confirm=not main_menu)



style navigation_button is gui_button
style navigation_button_text is gui_button_text

style navigation_button:
    size_group "navigation"
    properties gui.button_properties("navigation_button")

style navigation_button_text:
    properties gui.button_text_properties("navigation_button")

I use the Navigation menu on the main menu and in game, it just displays different stuff depending on if you are on the main menu or not, such as the animation! The problem is, when I click on "Preferences" for example, the animated PNGs stay on top of the preference screen.

My question is (I hope!) simple: Is there a way for my main menu's animated elements to stay "behind" the popped up screens?
In case it's needed, here is the screen that shows when you click on Preferences, for example:

Code: Select all

screen preferences():

    tag menu

    use game_menu(_("Preferences"), scroll="viewport"):

        vbox:

            hbox:
                box_wrap True

                if renpy.variant("pc"):

                    vbox:
                        style_prefix "radio"
                        label _("Display")
                        textbutton _("Window") action Preference("display", "window")
                        textbutton _("Fullscreen") action Preference("display", "fullscreen")

                vbox:
                    style_prefix "radio"
                    label _("Rollback Side")
                    textbutton _("Disable") action Preference("rollback side", "disable")
                    textbutton _("Left") action Preference("rollback side", "left")
                    textbutton _("Right") action Preference("rollback side", "right")

                vbox:
                    style_prefix "check"
                    label _("Skip")
                    textbutton _("Unseen Text") action Preference("skip", "toggle")
                    textbutton _("After Choices") action Preference("after choices", "toggle")
                    textbutton _("Transitions") action InvertSelected(Preference("transitions", "toggle"))

                ## Additional vboxes of type "radio_pref" or "check_pref" can be
                ## added here, to add additional creator-defined preferences.

            null height (4 * gui.pref_spacing)

            hbox:
                style_prefix "slider"
                box_wrap True

                vbox:

                    label _("Text Display Speed")

                    bar value Preference("text speed")

                    label _("Auto-Forward Speed")

                    bar value Preference("auto-forward time")

                vbox:

                    if config.has_music:
                        label _("Music")

                        hbox:
                            bar value Preference("music volume")


                    if config.has_sound:

                        label _("SFX")

                        hbox:
                            bar value Preference("sound volume")

                            if config.sample_sound:
                                textbutton _("Test") action Play("sound", config.sample_sound)

                        label _("Click")

                        hbox:
                            bar value Preference("mixer click volume")

                            #if config.sample_sound:
                                #textbutton _("Test") action Play("sound", config.sample_sound)


                    #if config.has_voice:
                        #label _("Voice Volume")

                        #hbox:
                            #bar value Preference("voice volume")

                            #if config.sample_voice:
                                #textbutton _("Test") action Play("voice", config.sample_voice)

                    #if config.has_music or config.has_sound or config.has_voice:
                        #null height gui.pref_spacing

                        #textbutton _("Mute All"):
                            #action Preference("all mute", "toggle")
                            #style "mute_all_button"


style pref_label is gui_label
style pref_label_text is gui_label_text
style pref_vbox is vbox

style radio_label is pref_label
style radio_label_text is pref_label_text
style radio_button is gui_button
style radio_button_text is gui_button_text
style radio_vbox is pref_vbox

style check_label is pref_label
style check_label_text is pref_label_text
style check_button is gui_button
style check_button_text is gui_button_text
style check_vbox is pref_vbox

style slider_label is pref_label
style slider_label_text is pref_label_text
style slider_slider is gui_slider
style slider_button is gui_button
style slider_button_text is gui_button_text
style slider_pref_vbox is pref_vbox

style mute_all_button is check_button
style mute_all_button_text is check_button_text

style pref_label:
    top_margin gui.pref_spacing
    bottom_margin 3

style pref_label_text:
    yalign 1.0

style pref_vbox:
    xsize 338

style radio_vbox:
    spacing gui.pref_button_spacing

style radio_button:
    properties gui.button_properties("radio_button")
    foreground "gui/button/check_[prefix_]foreground.png"

style radio_button_text:
    properties gui.button_text_properties("radio_button")

style check_vbox:
    spacing gui.pref_button_spacing

style check_button:
    properties gui.button_properties("check_button")
    foreground "gui/button/check_[prefix_]foreground.png"

style check_button_text:
    properties gui.button_text_properties("check_button")

style slider_slider:
    xsize 525

style slider_button:
    properties gui.button_properties("slider_button")
    yalign 0.5
    left_margin 15

style slider_button_text:
    properties gui.button_text_properties("slider_button")

style slider_vbox:
    xsize 675

[gas]

That something actually enervating of the new gui, and totally hard to grasp.
navigation is called by game_menu(), responsible to set areas of the screen, and calling the actual screen on the right and navigation on the left.
What happen is that navigation is ON TOP of everything else.
What you can do is to add such animations on the game_menu screen, not the navigation screen, or use another screen on your own at approapiate moment in that framework.

[Rainvillain]

That something actually enervating of the new gui, and totally hard to grasp.
navigation is called by game_menu(), responsible to set areas of the screen, and calling the actual screen on the right and navigation on the left.
What happen is that navigation is ON TOP of everything else.
What you can do is to add such animations on the game_menu screen, not the navigation screen, or use another screen on your own at approapiate moment in that framework.

Thanks for the help! I should probably have mentioned I'm mostly fumbling in the dark when it comes to programming... so I tried to add a few test elements to the game_menu to see if they would show up and so far no dice.
Here is the code for the game_menu:

Code: Select all

screen game_menu(title, scroll=None, yinitial=0.0):

    style_prefix "game_menu"

    if main_menu:
        add gui.main_menu_background
        add "images/menu element.png" xpos 150 ypos 50 at pls_transform ##THIS IS WHAT I ADDED
        add "images/menu element.png" xpos 550 ypos 450 at pls_transform ##THIS IS WHAT I ADDED
    else:
        add gui.game_menu_background

    frame:
        style "game_menu_outer_frame"

        hbox:

            ## Reserve space for the navigation section.
            frame:
                style "game_menu_navigation_frame"

            frame:
                style "game_menu_content_frame"

                if scroll == "viewport":

                    viewport:
                        yinitial yinitial
                        scrollbars "vertical"
                        mousewheel True
                        draggable True

                        side_yfill True

                        vbox:
                            transclude

                elif scroll == "vpgrid":

                    vpgrid:
                        cols 1
                        yinitial yinitial

                        scrollbars "vertical"
                        mousewheel True
                        draggable True

                        side_yfill True

                        transclude

                else:

                    transclude

    use navigation

    textbutton _("Return"):
        style "return_button"

        action Return()

    label title

    if main_menu:
        key "game_menu" action ShowMenu("main_menu")


style game_menu_outer_frame is empty
style game_menu_navigation_frame is empty
style game_menu_content_frame is empty
style game_menu_viewport is gui_viewport
style game_menu_side is gui_side
style game_menu_scrollbar is gui_vscrollbar

style game_menu_label is gui_label
style game_menu_label_text is gui_label_text

style return_button is navigation_button
style return_button_text is navigation_button_text

style game_menu_outer_frame:
    bottom_padding 45
    top_padding 180

    background "gui/overlay/game_menu.png"

style game_menu_navigation_frame:
    xsize 420
    yfill True

style game_menu_content_frame:
    left_margin 60
    right_margin 30
    top_margin 15

style game_menu_viewport:
    xsize 1380

style game_menu_vscrollbar:
    unscrollable gui.unscrollable

style game_menu_side:
    spacing 15

style game_menu_label:
    xpos 75
    ysize 180

style game_menu_label_text:
    size gui.title_text_size
    color gui.accent_color
    yalign 0.5

style return_button:
    xpos gui.navigation_xpos
    yalign 1.0
    yoffset -45

As you can see I added it under the first "if main_menu:"... but nothing is showing up. Am I maybe misplacing it?

[gas]

Ok, I was really on a rush, so my explanation was a bit rough, I'm very sorry.

The structure is
MAIN MENU
+NAVIGATION

or
GAME MENU
+the called screen
+NAVIGATION

So, if you want for an animation that play on the background of the main menu you should add it to the main_menu screen.
If you want the same or another animation that play in the game menu (preferences, load, and so on) you should add it to the game_menu too.
If you'll add it to the navigation, that animation run the same above everything (and if I'm correct that's something you don't want for).

[Rainvillain]

Ok, I was really on a rush, so my explanation was a bit rough, I'm very sorry.

The structure is
MAIN MENU
+NAVIGATION

or
GAME MENU
+the called screen
+NAVIGATION

So, if you want for an animation that play on the background of the main menu you should add it to the main_menu screen.
If you want the same or another animation that play in the game menu (preferences, load, and so on) you should add it to the game_menu too.
If you'll add it to the navigation, that animation run the same above everything (and if I'm correct that's something you don't want for).

That did it thanks! I placed my animated images inside main_menu (specifically, I placed them after the "use navigation" code line) and now the animation plays on the main menu but not on the pop up screens.

THANKS!