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?
Darken all but part of the screen
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.
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.
- Ocelot
- Lemma-Class Veteran
- Posts: 2437
- Joined: Tue Aug 23, 2016 10:35 am
- Github: MiiNiPaa
- Discord: MiiNiPaa#4384
- Contact:
Re: Darken all but part of the screen
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:
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
< < insert Rick Cook quote here > >
- Tess
- Regular
- Posts: 59
- Joined: Thu Aug 04, 2022 3:43 pm
- Projects: The Songbird Guild
- Organization: Yurisoft
- Github: wainwt2
- Discord: Tess#7782
- Contact:
Re: Darken all but part of the screen
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
- Lemma-Class Veteran
- Posts: 2437
- Joined: Tue Aug 23, 2016 10:35 am
- Github: MiiNiPaa
- Discord: MiiNiPaa#4384
- Contact:
Re: Darken all but part of the screen
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.
You code can work if you make Solid in highlight opaque and add invert=True to the AlphaMask call.
< < insert Rick Cook quote here > >
Who is online
Users browsing this forum: Ahrefs [Bot], Google [Bot]