Darken all but part of the screen

[Tess]

I want to highlight a section of the screen as part of a tutorial, preferably by darkening all the other areas.

Darkening the screen has been easy, I have Frame(Solid("#000022EE")) and I add it to the screen at whatever alpha feels good.

Carving out the space to *not* darken has been the challenge. So far, I've been trying to do it with AlphaMask() (https://www.renpy.org/doc/html/displaya ... #AlphaMask) using my black frame as the child and an image with transparency where I want the bright spot as the mask. This works great, but it'd require a new image for every shape and size of thing I want to highlight on the screen, and if I ever moved any of my UI elements, I'd have to remake all the related highlight images too.

Does anyone have a more eloquent way of carving out that bright spot in the darkness?

[Ocelot]

So, you want something like that: https://drive.google.com/file/d/1MYJJpK ... p=drivesdk

In this case I suggest to:
1) Create a completely opaque image the size of your cutout. Crop((0, 0, SIZE_X, SIZE_Y), Solid("#000")) works well for that.
2) Create a completely transparent image the size of your screen.
3) Position non-transparent image over transparent one where you want the cutout to be.
4) Use resulting image as a mask, but set invert to True.

Example:

Code: Select all

transform cutout:
    Crop((0, 0, 100, 200), Solid("#000"))
    align (0.0, 0.0)
    linear 5 align (0.5, 1.0)
    linear 5 align (1.0, 0.0)
    linear 4 align (0.75, 1.0)
    linear 4 align (0.5, 0.0)
    linear 4 align (0.25, 1.0)
    linear 4 align (0.0, 0.0)
    repeat

image mask_frame:
    Solid("#fff0")
    contains cutout


label start:
    scene 
    show expression Solid("#F00")
    show expression AlphaMask("#0004", "mask_frame", invert=True)
    "You've created a new Ren'Py game."

    "Once you add a story, pictures, and music, you can release it to the world!"
    return

[Tess]

Thanks for the response! I tried implementing it in a screen that I can call up, but the transparent highlight seems to erase all the darkness instead of part of it...

Code: Select all

screen highlight_area(highlight_size=(0.1,0.1),highlight_location=(0.5,0.5),dark_alpha=0.6):
    zorder 50
    python:
        dark = Transform(Solid("#000022EE"),xysize=(1.0,1.0),alpha=dark_alpha)
        highlight = Transform(Solid("#fff0"),xysize=highlight_size,pos=highlight_location)
    add AlphaMask(dark,highlight)

[Ocelot]

Your first problem is that you are creating trasparent image and posing it over transparent canvas. You need to work backwards: pose a opaque image over transparent canvas and use it in AlphaMask inverted

You code can work if you make Solid in highlight opaque and add invert=True to the AlphaMask call.