Page 1 of 1

Grayscaling & focus for tutorial?

Posted: Sat May 08, 2021 11:50 am
by OrsonDeWitt
Hi!
I've been trying to make a tutorial for my game, wherein as everything is explained it is also highlighted with a contour, or the whole of the screen is made into grayscale except for the part of the screen in question (say, as a colored square while everything else is gray). I assume Renpy doesn't know how to make a whole scene go grayscale, but I also wouldn't want to go through im.Grayscale'ing every image on my screen. Is there some hack to do this quickly and efficiently?
Thanks.

Re: Grayscaling & focus for tutorial?

Posted: Sat May 08, 2021 11:18 pm
by philat
Quick and dirty easy way to do this is to just show a semitransparent black image on top of everything, darkening everything. Either fiddle with the order of the black image or whatever you need not to be darkened to "highlight".

Re: Grayscaling & focus for tutorial?

Posted: Sun May 09, 2021 3:17 am
by Ocelot
Another approach is to take screenshot, grayscale it, cut a hole in it and display over everything. While there is no public API to get taken screenshot as image, there are some functions RenPy uses internally, like renpy.game.interface.get_screenshot().

Re: Grayscaling & focus for tutorial?

Posted: Sun May 09, 2021 4:46 am
by Remix
The professional approach (Ren'Py 7.4 and above) would be to add a transform to the master (and maybe screen/overlay too) layer that used a conditional grayscale shader to calculate whether to draw each pixel with colour or not.

That would still have the caveat that any buttons would still be clickable even though they were grayscaled... so perhaps a semi-transparent mask (as a NullAction focus_masked button) over the top (as philat suggested) would be best.

Re: Grayscaling & focus for tutorial?

Posted: Sun May 09, 2021 6:45 am
by Remix
Seems you can use blend "multiply" in 7.4.5 to use an overlay image where-in the pixel colour values are used to multiply against the pixel behind... Not quite grayscale though certainly usable for darkening areas that are not active.

I might run up an example if I get time this afternoon.

Re: Grayscaling & focus for tutorial?

Posted: Tue May 11, 2021 2:25 pm
by Remix
Ren'Py 7.4.5 onwards...

Code: Select all

screen highlight_area(pos, size, bg="#455"):
    fixed:
        ## You could position and size this to just obscure a part of the screen
        add Transform(
            Flatten(Composite(
                (1280, 720), ## The size of the screen (or the obscured area)
                (0,0), Solid(bg),
                pos, Solid("#FFF", xysize=size))),
            blend = "multiply")

label start:
    show screen highlight_area( (50, 50), (150, 50) ) ## (xpos, ypos), (width, height)
    "Words"
    hide screen highlight_area
    
You could show that on a different layer to obscure everything behind it. (e.g. overlay or master)
As there are so many different ways to handle tutorial systems I have not shown anything more than just a very simple blend mask. If you wanted buttons deactivated etc you would need to handle that yourself.