Gradual darkening of the screen.

Question

I want to do such a thing. After selecting in the main menu, the screen gradually dims, then loaded another scene, the screen is gradually lightened. How is this implemented?

Answer 1

The simplest way would be to put a dark texture on top of your scene (with the highest Z), make it visible and with opacity 0 at first, and gradually increase its opacity in _process.

Then change the scene, and do the same the other way around (full opacity -> opacity 0).

Comments

AFAIK the highest Z is what is shown on top, not the lowest.

---

Right, fixed :)

---

Why not doing it with a polygon node? You don't need a texture and it saves texture lookups in the shader.
Also, a CanvasModulate node could work too and involves less overdraw :p
I do that in my game with an AnimationPlayer so I don't even have to script it.

---

Don't hesitate to post your suggestion as an answer instead of a comment. This is the purpose of a Q&A: everyone proposes their answer and the OP can select the most fitting one. Here I just gave a quick and dirty solution, if you have a better one we'll all be happy to read it and maybe learn from it :)

---

Sorry sometimes I put things in comments that could be an answer, and I forget to use Answer. I posted it then :)

---

I have finally done it. Thanks, I took your advice.

Answer 2

You can also do it with a polygon node, you don't need a texture and it saves texture lookups in the shader.
Also, a CanvasModulate node could work too and involves less overdraw :p
I do that in my game with an AnimationPlayer so I don't even have to script it.

Comments

Node that currently Polygon2D opacity does not work.

---

Gaaah yes Polygon transparency doesn't works in 2.1... a little shader tinkering and it should work I guess.