[SOLVED] animation and layers to the main menu

Discuss how to use the Ren'Py engine to create visual novels and story-based games. New releases are announced in this section.
Forum rules
This is the right place for Ren'Py help. Please ask one question per thread, use a descriptive subject like 'NotFound error in option.rpy' , and include all the relevant information - especially any relevant code and traceback messages. Use the code tag to format scripts.
Post Reply
Message
Author
User avatar
SpicyMayo1429
Newbie
Posts: 8
Joined: Tue Mar 20, 2018 11:23 am
Contact:

[SOLVED] animation and layers to the main menu

#1 Post by SpicyMayo1429 » Tue May 22, 2018 7:57 pm

I've been working on customizing the main menu for a game I'm working on. I was wondering how to go about making it like Doki Doki Literature Club's menu where there's a moving background then something comes in from the side (and stays) and finally another image will appear on top of the moving bg. Like the image below...
Attachments
menu idea.jpg
Last edited by SpicyMayo1429 on Wed May 23, 2018 11:36 am, edited 1 time in total.

kivik
Miko-Class Veteran
Posts: 720
Joined: Fri Jun 24, 2016 5:58 pm
Contact:

Re: animation and layers to the main menu

#2 Post by kivik » Wed May 23, 2018 4:48 am

You can create animated images using Renpy's transform properties and the ATL:
https://www.renpy.org/doc/html/atl.html ... properties
https://www.renpy.org/doc/html/atl.html

Have a read, experiment with it and see if you can figure it out.

Then to apply it to the main menu, go into the screens.rpy and find the main_menu screen - you can add your animated images there.

User avatar
ComputerArt.Club
Veteran
Posts: 228
Joined: Mon May 22, 2017 8:12 am
Completed: Santa's workshop, Cat's Bath, Computer Art Club
Location: Taiwan
Contact:

Re: animation and layers to the main menu

#3 Post by ComputerArt.Club » Wed May 23, 2018 10:22 am

In the screens section you are going to just add the image which will be animated and defined elsewhere.

find the screen for your main menu and add the background image. This is normally done in screens.rpy
probably:

Code: Select all

screen main_menu():
	add "background"
	add "menu_right"
	add "sprite"
You might decide to use imagemap or imagebutton instead of add for some of the code.

The next part is usually done in the scripts.rpy, but people often have separate files for transformations and images, depending on how big the project is. Renpy reads all the files and disregards the names, so you don't need to overthink it too much.
Define the images with the transformations that you are applying to them.

Code: Select all

image menu_bg:
    "gui/menuname.png"
    menutransform1
etc.
Then define the transformations

Code: Select all

transform menutransform1:
	xoffset 0 yoffset 0
        linear 3.0 xoffset -100 yoffset -100
        repeat
You will need to use similar transforms for alpha to fade in etc.

I was planning on doing something similar with regards the moving background, but decided against it for my current project.

You can also unpack the files in Doki Doki to see how they did it, though I vaguely remember that they might have a warning about doing that somewhere, like they do not give consent for that.

It is not particularly simple, it will probably take quite a bit of work.

User avatar
SpicyMayo1429
Newbie
Posts: 8
Joined: Tue Mar 20, 2018 11:23 am
Contact:

Re: [SOLVED] animation and layers to the main menu

#4 Post by SpicyMayo1429 » Wed May 23, 2018 12:13 pm

Thanks for the suggestions guys. I'll totally read into things and experiment with stuff!

Post Reply

Who is online

Users browsing this forum: Roxie