How can I create a screen color overlay

Question

Hi,
I'm currently working on a simple 3D VR game with Godot. What I couldn't figure out yet is how to create color overlays for the whole screen.

To make clearer what I want two achieve, here are my two main use cases:

1) When the player takes damage, the screen should get tinted red for a few milliseconds.
(this helps the player to realize he has been hit, especially if the enemy is behind him/her)

2) When changing the scenes, I want to fade the old scene to black, then fade in the new scene after it has been loaded.
(especially in VR this makes scene transitions much more pleasant)

For both use cases I would need to draw a color (with variable alpha) over the actual scene. Can anyone give me a hint on how this can be achieved with Godot?

Comments

Have you looked into covering the entire screen with a ColorRect? When it comes time to show the color, change the self_modulate property's value to change the visibility of the ColorRect.

---

That sounds like the solution I'm looking for. Sadly I'm quite new to Godot, so I don't know how to implement this. Can you briefly describe the steps required to add a full screen color rect to a 3D scene?

Answer 1

As per @Ertain's comment, a ColorRect would probably be the way to go.

Here's how I would do it:

1. Create a ColorRect, probably as a part of your game GUI, on a separate CanvasLayer, so that it always stays on top of your other game content

2. Make sure that the ColorRect is always true to the game window size, e.g. by resizing it when Viewport detects game window resize ( size_changed signal )

3. Create an AnimationPlayer that controls the ColorRect's color when the player has been hit OR create a Tween that interpolates the ColorRect's color

(if you get stuck trying to code this, let us know)