Page 1 of 1

Making "animated" main menu backgrounds? [SOLVED]

Posted: Wed May 24, 2017 1:22 pm
by Rainbow Colors
Hello, I'm trying to make a main menu background that's animated - but not with a video. I have already tried doing one where there's only one image that "infinitely scrolls [diagonally]".

This time though, I'm trying to make something that has multiple images.

Code: Select all

image mmenu:
    "images/background.png"
    xanchor 0
    yanchor 0
    block:
        "images/ba.png"
        xpos 100
        ypos 100
        linear 2.0 alpha 1.0
        linear 2.0 alpha 0.0
        repeat
    block:
        "images/y.png"
        xpos 200
        ypos 100
        linear 2.0 alpha 1.0
        linear 2.0 alpha 0.0
        repeat
    block:
        "images/ba.png"
        xpos 300
        ypos 100
        linear 2.0 alpha 1.0
        linear 2.0 alpha 0.0
        repeat
    block:
        "images/ye.png"
        xpos 400
        ypos 100
        linear 2.0 alpha 1.0
        linear 2.0 alpha 0.0
        repeat
    block:
        "images/n.png"
        xpos 500
        ypos 100
        linear 2.0 alpha 1.0
        linear 2.0 alpha 0.0
        repeat

define gui.main_menu_background = "mmenu"
Something like that. The idea is to have a static background image, with the title sort of fading in and out. The only thing that shows up in the main menu after using the code above is the first block with ba.png(but the animation works for it, so there's that, ha).

I suspect the problem is with the usage of blocks (because I'm not too sure about them), if the problems isn't about being unable to use multiple images in... one image? It would be fantastic if anyone can tell me about possible tweaks, if not alternatives for making this. Thank you!

Re: Making "animated" main menu backgrounds?

Posted: Wed May 24, 2017 2:20 pm
by trooper6
Do you want these to be 5 separate images that are all on the screen at the same time and all fade in and out? Or do you want image 1 to fade in and out, then image 2 to fade in and out, then image 3 to fade in and out, then image 4 to fade in and out, then image 5 to fade in and out, then image 1 to fade in and out, etc?

Re: Making "animated" main menu backgrounds?

Posted: Wed May 24, 2017 4:27 pm
by xavimat
I would change the main_menu screen directly, instead of using define gui.main_menu_background = "mmenu"

Re: Making "animated" main menu backgrounds?

Posted: Wed May 24, 2017 9:19 pm
by Rainbow Colors
trooper6 wrote:Do you want these to be 5 separate images that are all on the screen at the same time and all fade in and out? Or do you want image 1 to fade in and out, then image 2 to fade in and out, then image 3 to fade in and out, then image 4 to fade in and out, then image 5 to fade in and out, then image 1 to fade in and out, etc?
The former.
xavimat wrote:I would change the main_menu screen directly, instead of using define gui.main_menu_background = "mmenu"
I'll try that, then, thank you.

Re: Making "animated" main menu backgrounds?

Posted: Thu May 25, 2017 11:41 am
by Rainbow Colors
Hey, thank you once again for the suggestion. I think I managed to work something out, although I'm not quite sure about its efficiency or something (but hey, if it works, then that's that :D)

Code: Select all

transform pls_transform:
    linear 2.0 alpha 1.0
    linear 2.0 alpha 0.25
    repeat

screen main_menu():
    tag menu

    style_prefix "main_menu"

    add gui.main_menu_background
    add "images/ba.png" xpos 150 ypos 50 at pls_transform
    add "images/y.png" xpos 300 ypos 100 at pls_transform
    add "images/ba.png" xpos 450 ypos 50 at pls_transform
    add "images/ye.png" xpos 600 ypos 100 at pls_transform
    add "images/n.png" xpos 750 ypos 50 at pls_transform
The title symbols fade in and out quite nicely, too.

Re: Making "animated" main menu backgrounds? [SOLVED]

Posted: Thu May 25, 2017 12:50 pm
by trooper6
That's the way to do it!

My undergrad compsci teacher once said: if you find yourself writing the same code more than three times, there is a more efficient way of doing what you are doing.