How to show an image above everything (including the text) ?

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
Amethysts
Regular
Posts: 41
Joined: Thu Aug 23, 2018 1:17 pm
Projects: Coalescence
Skype: amethysts-studio
itch: amethysts
Contact:

How to show an image above everything (including the text) ?

#1 Post by Amethysts »

Hello world !

I want to make a special effect for important sentences. My game is composed of dialogues, and sometimes, i want to highlight a sentence by showing it above everything. But when i do so, the text is barely readable because of the other sentences.
Here is the screen of my problem:

Image

So I want either to :
- change the alpha/color of the previous sentences (I already tried to change gui.text_color = '#ffffff20' but it only updates the text color for the next sentences)
- show a black image with 50%alpha above everything including the text (changing zorder is useless)

By the way, this is what the code looks like:

Code: Select all

label message_important(who, name, important_sentence):
    $ gui.text_color = '#ffffff50'
    who "[important_sentence]{fast}{nw}"
    show black zorder 0:
        alpha 0.0               #pb : not above text !!!
        linear 0.2 alpha 0.3 
    show text "{size=48}{color=#a0a0a0}[name]{/color}{/size}" as sayer with Dissolve(0.3):
        xalign 0.5
        yalign 0.3
    show text "{size=+10}[important_sentence]{/size}" as saying with Dissolve(0.2):
        xalign 0.5
        yalign 0.5
    n ""
    $ gui.text_color = '#ffffffff'
    hide black with Dissolve(0.2)
    hide sayer with Dissolve(0.2)
    hide saying with Dissolve(0.2)
    return
I call this label and that's it !

Thank you for reading and sorry for my rough English

rames44
Veteran
Posts: 233
Joined: Sun May 29, 2016 4:38 pm
Contact:

Re: How to show an image above everything (including the text) ?

#2 Post by rames44 »

You could put the black/50% image in a screen, and then show/hide the screen. Z-order in the screen itself will allow you to stack things on top of pretty much anything else.

Either that, or you could create a custom layer, and show the image on that layer. https://www.renpy.org/doc/html/displayi ... ight=layer

User avatar
Amethysts
Regular
Posts: 41
Joined: Thu Aug 23, 2018 1:17 pm
Projects: Coalescence
Skype: amethysts-studio
itch: amethysts
Contact:

Re: How to show an image above everything (including the text) ?

#3 Post by Amethysts »

Thank you, my problem is solved !
Here is the effect I wanted to create :

Image

And here is the code :

Code: Select all

screen message_important(name, important_sentence, color = "#a0a0a0", trans = message_transform):
    zorder 10
    window:
        at trans
        background "#000000dd"
        xalign 0.5
        yalign 0.5
        xysize (720, 720)
        vbox:
            xalign 0.5
            xsize 720
            text name:
                xalign 0.5
                yoffset 120
                color color
                size 44
                id name
            text important_sentence:
                xalign 0.5
                yoffset 300
                size 40
                id important_sentence

Post Reply

Who is online

Users browsing this forum: Google [Bot]