Ren'Py - Stuck with layering image on top of another

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
HtFde
Newbie
Posts: 2
Joined: Fri Sep 03, 2021 5:33 pm
Deviantart: HtFde
Contact:

Ren'Py - Stuck with layering image on top of another

#1 Post by HtFde »

Hi there, pretty much a newbie in terms of Ren'Py - I tried the online documentation and Google but didn't really find a solution.

What I want to do: I have an interactive menu on the screen that can be used at any time. One option of it does change a variable which is reflected in the images used in the story via DynamicImage. The problem is that I try to smooth the sudden change by adding a sort of cut scene and then revert back to the original place in the story where the change has taken place.

Imagine: Superman in his office clothes in the office. User presses "Wear Costume" button. What I want is to ease the switch from office clothes to Superman in his costume. So I want to put a blurred version of the current background image over ANYTHING that is currently visible. Then show 2 to 3 images where Superman strips off his suit and dons his costume along with some VISIBLE snazzy lines of text and then remove all that and return to the previous image where Superman now wears his costume instead of the office suit.

I tried to define a new screen and add the blurred background image to it. Which worked. When I set the zorder to 0 it covered everything and the text during the change was visible (Ah, such a relief to get out of this suit ... etc.) BUT when I tried to add the images of the change, those did not appear. I used show and tried zorder with values greater than 0 but they never showed up. When I removed my screen they DID show up so filenames, etc. are ok - they just won't pop over the newly loaded image. For the screen I tried:

Code: Select all

screen htf_cutscene():
        # zorder 0
        add "bg room blurry.png" xalign 0.0 yalign 1.0
And the label called by the button was:

Code: Select all

    label ChangeCostume:
        show screen htf_cutscene
        show guy change part1 zorder 1
        K "Ah - how I hate these office clothes"
        $ heroed = True
        $ append = "herosuit"
        show guy change part2 zorder 1
        K "This so much more me!"
        hide screen htf_cutscene
        hide guy change part2
        return()
When I press the button, the blurry background is placed over everything visible - check
The two text lines appear and are visible - check
The two images with show do NOT show up - fail
When the code is done it restores the image that was visible when the button was clicked - check
Our hero now wears the costume instead of the office suit thanks to DynamicImage and the variable append - check

So if anyone could help me with why "show ...." does NOT show the images, I would be quite happy ...

User avatar
Alex
Lemma-Class Veteran
Posts: 3094
Joined: Fri Dec 11, 2009 5:25 pm
Contact:

Re: Ren'Py - Stuck with layering image on top of another

#2 Post by Alex »

HtFde wrote: Fri Sep 03, 2021 6:10 pm ...So if anyone could help me with why "show ...." does NOT show the images, I would be quite happy ...
This happens 'cause images are shown on layer 'master' and screens - on layer 'screens', and the order of layers is 'master', 'transient', 'screens', 'overlay'
https://www.renpy.org/doc/html/config.h ... fig.layers

So, you could try either to show images on layer 'screens' or add them as apart of the screen with blurred bg.

https://www.renpy.org/doc/html/displayi ... -statement
https://www.renpy.org/doc/html/screens. ... -statement
https://www.renpy.org/doc/html/screens.html#timer
https://www.renpy.org/doc/html/atl.html ... -atl-block

HtFde
Newbie
Posts: 2
Joined: Fri Sep 03, 2021 5:33 pm
Deviantart: HtFde
Contact:

Re: Ren'Py - Stuck with layering image on top of another

#3 Post by HtFde »

Ah, thanks - I went through the documentation you listed but it somehow did not make click. You provided the crucial info that there is a hierarchy and that show, initially, uses master which is now covered by my screen which is automatically on a different layer and thus on a different level of visibility. I actually tried to name my layer but couldn't find how - the documentation is a bit consfusing about screens, layers, frames, windows and suchlike - I kind of missed an entry level explanation (with pictures) how these things interact - it's a bit hard to grasp the concept from the written text alone.

Thanks to your input I changed:

Code: Select all

show guy change part1 zorder 1
into

Code: Select all

show guy change part1 onlayer screens
and my cutscene images appear where they should appear, yay! Hide, however, also needed to info to remove it from the layer with explicit naming of the layer but with

Code: Select all

hide guy change part2 onlayer screens
the cutscene images vanished properly

All problems solved (for now) - thanks!

Post Reply

Who is online

Users browsing this forum: Google [Bot], voluorem