Search code examples
godotgdscript

How to create specific dark regions which can be illuminated by Light2D?


I have my game normally setup as such: enter image description here

and I'm trying to create "specific" dark regions within the game as such:

enter image description here

so that whenever a light source is present it would "light up" the view by making the ColorRect transparent within the texture provided to the light2D (a photoshoped image of what I'm trying to achieve) : enter image description here

I tried this demo but it only lights up the image instead of making it transparent

I also tried this demo but it seems to apply to the entire game instead of a particular region and I would have to change the properties of all objects entirely throughout the game

Is what I'm trying to achieve possible? Or is there a alternate approach I should be taking altogether?


Note, you might ask:

"Why don't you just add a shader to the ColorRect to make the desired region transparent?"

Because there are multiple light sources and it wouldn't be possible to tally them all and add them into a shader


Solution

  • Nvm I figured it out

    First, Make a CanvasLayer node and set it to the same layer you're working on (0 in my case) and check follow_viewport_enable:

    enter image description here

    Then add a CanvasModulate node and set it's color to black (or whatever you desire): enter image description here

    enter image description here

    Then add a ColorRect and add the shader code given below to it: enter image description here

    shader_type canvas_item;
    
    uniform float position : hint_range(-0.5, 0.5) = 0.0;
    uniform float size : hint_range(0.5, 2) = 0.5;
    uniform float angle : hint_range(0.0, 360.0) = 0.0;
    
    void fragment() {
        float pivot = position + 0.5;
        vec2 uv = UV - pivot;
        float pos = smoothstep((1.0 - size) + position, size + 0.0001 + position, uv.x + pivot);
        COLOR = texture(SCREEN_TEXTURE, SCREEN_UV);
        COLOR.a=1.0-pos; 
    }
    
    void light(){
        if(LIGHT.a!=0.0 && COLOR.a!=0.0)
            LIGHT.a/= COLOR.a;
    }
    

    Now add Lights (with mode set to Mix) and see it in action!

    enter image description here

    and if the overlapping lights looks weird in the editor then don't worry it looks perfectly fine when running the game: enter image description here

    Edit: Fixed darkness gradient overlapping with light