This project is a demo of how to use a shader to create 2D directional shadows! You can customise the color, length, angle and softness of the shadows. The shader uses Signed Distance Fields provided by the Godot engine.
Built with Godot 4.1.2
![Screenshot of shadows demo](https://private-user-images.githubusercontent.com/59108399/302193247-4a3cc525-f1d5-42e9-b82b-cd1dcfe6b7cb.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTU0NjY3MzEsIm5iZiI6MTcxNTQ2NjQzMSwicGF0aCI6Ii81OTEwODM5OS8zMDIxOTMyNDctNGEzY2M1MjUtZjFkNS00MmU5LWI4MmItY2QxZGNmZTZiN2NiLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA1MTElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNTExVDIyMjcxMVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWQ5OTA5M2VhNzI3NzE1NTRjMzkzZTU5Njc1Y2ZkNjkwY2IxYWU2MGI2ZjczMTFkMzU4MTllZjhhNWYyNTIwNmQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.RsqOF3aQnbExIZ3jEC0P8Xq9uoKgLUwu9OikuSQpMZE)
(Adjust the gradient in the shader params to acheive this)
![Screenshot 2024-02-05 at 5 29 47 pm](https://private-user-images.githubusercontent.com/59108399/302194926-00e5a4f5-17c1-406b-9bae-51605aa08110.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTU0NjY3MzEsIm5iZiI6MTcxNTQ2NjQzMSwicGF0aCI6Ii81OTEwODM5OS8zMDIxOTQ5MjYtMDBlNWE0ZjUtMTdjMS00MDZiLTliYWUtNTE2MDVhYTA4MTEwLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA1MTElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNTExVDIyMjcxMVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTBhZTE2ODI2NzZiNDJmNWU4ZGFlNDExNDljZWI0NTIwNGJlYjYyMWVmMjM0YWM0MWVhOGI1ZmRkMWRhZjFkOWMmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.XMhSi9U4uFpLpy3mOckjS1vW_PfCZ2ixHGypb_lyKNg)
On my M1 Macbook Pro, I found that this shader ran fine. However, I noticed some framerate issues when the resolution is particularly large, for example on an ultra-wide monitor. Thankfully Godot provides some project settings that helps us combat this:
Oversize
controls how much of the original viewport size should be covered by the 2D signed distance field.Scale
is the resolution scale to use for the 2D signed distance field. Higher values lead to a more precise and more stable signed distance field as the camera moves, at the cost of performance. The default value (50%) renders at half the resolution of the viewport size on each axis, which means the SDF is generated with 25% of the viewport's pixel count.
Pixel art assets are from https://cupnooble.itch.io/sprout-lands-asset-pack
Shader code heavily based from https://godotengine.org/article/godots-2d-engine-gets-several-improvements-upcoming-40/