A Main Menu with Multiple Images? [Solved]

[Katy133]

I'm trying to create a custom Main Menu in Ren'Py. I've figured out how to program the various elements, but I'm not sure how to combine them all into a Main Menu.

• The side menu (Start, Load, Quit, etc).
• A slideshow of images of various objects that dissolve from one to another. The player "unlocks" what images appear, by finding different endings. (If/Else switch and ending Flags).
• An image with transparency, to show the layer beneath it.
• An animated looping pattern.

I'm using Ren'Py's default UI code for the Main Menu and the Side Menu.

This is the code for the sildeshow of objects:

Code: Select all

image slideshowfade:
        "gui/main menu item 1.png" with dissolve
        2.0
        "gui/main menu item 2.png" with dissolve
        2.0
        "gui/main menu item 3.png" with dissolve
        2.0
        repeat
    
    show slideshowfade

Code for animated looping pattern:

Code: Select all

image menuscroll:
        subpixel True
        xpan True
        ypan True
        xalign 0.5
        yalign 1.0
        HBox ("gui/main_menu pattern.png", "gui/main_menu pattern.png")
        linear 60 xpos -0.5 ypos 2.0
        repeat
        
    show menuscroll

[Imperf3kt]

Just use "add" as if they were regular images.

Place the ones you want in front, nearer the bottom.

[Katy133]

Just use "add" as if they were regular images.

Place the ones you want in front, nearer the bottom.

Where in Ren'Py's default code for the Main Menu (screens.rpy file) should I insert them? I've tried playing the slideshow code in places like right under the
background "gui/overlay/main_menu.png"
code, but I keep getting "end of line expected" error messages. Ren'Py won't even display the VN at that point.

[XxrenxX]

maybe this article would help?

[Katy133]

maybe this article would help?

Thank you. I found that section of code in the screen.rpy file and added this, and the image showed up properly!

Code: Select all

screen main_menu():

    tag menu

    style_prefix "main_menu"

    add gui.main_menu_background
    
    image "gui/main_menu image.png"#This is what I added
 

But then I tried to add the slideshow right underneath:

Code: Select all

    image slideshowfade:
        "gui/main menu item 1.png" with dissolve
        2.0
        "gui/main menu item 2.png" with dissolve
        2.0
        "gui/main menu item 3.png" with dissolve
        2.0
        repeat
    
    show slideshowfade

This caused the following error:

Code: Select all

I'm sorry, but errors were detected in your script. Please correct the
errors listed below, and try again.


File "game/screens.rpy", line 403: expected a keyword argument or child statement.
    "gui/main menu item 1.png" with dissolve
    ^

Ren'Py Version: Ren'Py 7.2.2.491
Thu Apr 11 20:49:36 2019

I don't know how to get past this. Any advice?

[XxrenxX]

Code: Select all

File "game/screens.rpy", line 403: expected a keyword argument or child statement.

Might be an indentation error? It says it's expecting a statement after the : for slideshowfade.

My only other thought is if you want it to be the whole page change the add to slideshowfade instead of the image. Add acts as the background so if you put the image call there maybe that will work?

Code: Select all

screen main_menu():
    tag menu
    style_prefix "main_menu"

    add slideshowfade

Also are the 2.0's under each iamge suppose to be the pause? you might have to say pause else idk if the game knows what you mean.

Edit: You should be able to use if statements in the image define to set up what images will show and more can be added once player unlocks them.

[Matalla]

In a screen you don't use show "image" and don't use transitions, those things are used inside the game.

For what you want to do, you first have to define the image outside any label or screen with atl. Your code for that seems right, but better check it if you're not sure.

https://www.renpy.org/doc/html/atl.html?highlight=atl#

Then, inside the screen, after the background add the image.

Code: Select all

add slideshowfade

Optionally you can include the position or other parameters directly or applying a transform with "at"

[Katy133]

In a screen you don't use show "image" and don't use transitions, those things are used inside the game.

For what you want to do, you first have to define the image outside any label or screen with atl. Your code for that seems right, but better check it if you're not sure.

https://www.renpy.org/doc/html/atl.html?highlight=atl#

Then, inside the screen, after the background add the image.

Code: Select all

add slideshowfade

Optionally you can include the position or other parameters directly or applying a transform with "at"

I've now changed show slideshowfade to add slideshowfade , but I still can't figure out where to put the atl block of code. I've tried placing it before the Main Menu screen, but I keep getting a "slideshowfade not defined" error.

[Matalla]

I've now changed show slideshowfade to add slideshowfade , but I still can't figure out where to put the atl block of code. I've tried placing it before the Main Menu screen, but I keep getting a "slideshowfade not defined" error.

Put it anywhere outside a label or a screen. I'd put it at the start of the script, where you declare variables with default and such things. No indentation.

[Katy133]

Put it anywhere outside a label or a screen. I'd put it at the start of the script, where you declare variables with default and such things. No indentation.

I've placed it here in the script:

Code: Select all

label start:

    image slideshowfade:
        "gui/main menu item 1.png" with dissolve
        2.0
        "gui/main menu item 2.png" with dissolve
        2.0
        "gui/main menu item 3.png" with dissolve
        2.0
        repeat

But unfortunately, I'm still getting a "'slideshowfade' is not defined" error.

[Matalla]

I said outside a label with no indentation. Label start is still a label. Try something like this:

Code: Select all

image slideshowfade:
    "gui/main menu item 1.png" with dissolve
    2.0
    "gui/main menu item 2.png" with dissolve
    2.0
    "gui/main menu item 3.png" with dissolve
    2.0
    repeat
        
label start:
    "Whatever"
    return

[Katy133]

I said outside a label with no indentation. Label start is still a label. Try something like this:

Code: Select all

image slideshowfade:
    "gui/main menu item 1.png" with dissolve
    2.0
    "gui/main menu item 2.png" with dissolve
    2.0
    "gui/main menu item 3.png" with dissolve
    2.0
    repeat
        
label start:
    "Whatever"
    return

I had tried that, but I got the same error.

[Matalla]

My bad, I never did something like this. What I said would work to put it in a label (with show instead of add). You have to define it as a transform in order to put in the main menu, Same method, though. Outside label or screen, no indentation.

Code: Select all

transform slideshowfade:
    "yellow.png" with dissolve
    2.0
    "grey.png" with dissolve
    2.0
    "black.png" with dissolve
    2.0
    repeat
    
label start:

Code: Select all

    add gui.main_menu_background
    
    add slideshowfade

[Katy133]

My bad, I never did something like this. What I said would work to put it in a label (with show instead of add). You have to define it as a transform in order to put in the main menu, Same method, though. Outside label or screen, no indentation.

Code: Select all

transform slideshowfade:
    "yellow.png" with dissolve
    2.0
    "grey.png" with dissolve
    2.0
    "black.png" with dissolve
    2.0
    repeat
    
label start:

Code: Select all

    add gui.main_menu_background
    
    add slideshowfade

Thank you so, so much! It works now. I was also able to add the animated looping pattern using the same method.