my firsts steps with GLSL
authorEduardo <[email protected]>
Sun, 24 Sep 2023 01:17:03 +0000 (03:17 +0200)
committerEduardo <[email protected]>
Sun, 24 Sep 2023 01:17:03 +0000 (03:17 +0200)
im doing the shaders for the home background, its just dots moving all together

scenes/main_menu/MainMenu.tscn
themes/default/backgrounds/home_screen_dots.gdshader [new file with mode: 0644]

index 3ea47d5aefc2b46c8945cf0295f277a2d297d277..45c409634a715f65d3158ef6220d04d83cae782e 100644 (file)
@@ -1,10 +1,18 @@
-[gd_scene load_steps=6 format=3 uid="uid://dls3hhkaqyydv"]
+[gd_scene load_steps=8 format=3 uid="uid://dls3hhkaqyydv"]
 
 [ext_resource type="Script" path="res://scenes/main_menu/MainMenu.gd" id="1_yx80n"]
 [ext_resource type="Texture2D" uid="uid://c3q0pfh7e8xj0" path="res://themes/default/back_pain_logo_text.png" id="2_6x8ou"]
 [ext_resource type="Texture2D" uid="uid://bjwbk76qmspia" path="res://themes/default/main_bunny.jpg" id="3_vaxsw"]
 [ext_resource type="PackedScene" uid="uid://wcc3vm8lhbp6" path="res://buttons/AnimatedButton.tscn" id="4_71840"]
 [ext_resource type="PackedScene" uid="uid://b3077obpgfwkx" path="res://themes/default/buttons/menu_button/MenuButton.tscn" id="5_qjr8j"]
+[ext_resource type="Shader" path="res://themes/default/backgrounds/home_screen_dots.gdshader" id="6_xkkpt"]
+
+[sub_resource type="ShaderMaterial" id="ShaderMaterial_v5r1v"]
+shader = ExtResource("6_xkkpt")
+shader_parameter/dots_color = Vector4(1, 0.86, 0.83, 1)
+shader_parameter/bg_color = Vector4(1, 0.95, 0.91, 1)
+shader_parameter/grid_size = 50.0
+shader_parameter/dot_size = 0.1
 
 [node name="MainMenu" type="Control"]
 layout_mode = 3
@@ -15,9 +23,10 @@ grow_horizontal = 2
 grow_vertical = 2
 mouse_filter = 2
 script = ExtResource("1_yx80n")
-metadata/_edit_vertical_guides_ = [540.0, 64.0, 1023.0]
+metadata/_edit_vertical_guides_ = [540.0, 93.0, 1023.0]
 
 [node name="Background" type="ColorRect" parent="."]
+material = SubResource("ShaderMaterial_v5r1v")
 layout_mode = 1
 anchors_preset = 15
 anchor_right = 1.0
@@ -25,7 +34,7 @@ anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
 mouse_filter = 2
-color = Color(0.996078, 0.886275, 0.792157, 1)
+color = Color(1, 0.94902, 0.905882, 1)
 
 [node name="BackPainLogo" type="TextureRect" parent="."]
 layout_mode = 1
@@ -56,13 +65,15 @@ qlo"
 
 [node name="VBoxContainer" type="VBoxContainer" parent="."]
 layout_mode = 1
-anchors_preset = 15
-anchor_right = 1.0
-anchor_bottom = 1.0
-offset_left = 64.0
-offset_top = 256.0
-offset_right = -57.0
-offset_bottom = 52.0
+anchors_preset = 8
+anchor_left = 0.5
+anchor_top = 0.5
+anchor_right = 0.5
+anchor_bottom = 0.5
+offset_left = -479.5
+offset_top = -810.0
+offset_right = 479.5
+offset_bottom = -20.0
 grow_horizontal = 2
 grow_vertical = 2
 
diff --git a/themes/default/backgrounds/home_screen_dots.gdshader b/themes/default/backgrounds/home_screen_dots.gdshader
new file mode 100644 (file)
index 0000000..2f51100
--- /dev/null
@@ -0,0 +1,65 @@
+shader_type canvas_item;
+
+uniform vec4 dots_color = vec4(1, 0.86, 0.83, 10);
+uniform vec4 bg_color = vec4(0, 0, 0, 0);
+uniform float grid_size: hint_range(0.0, 200, 0.1) = 100;
+uniform float dot_size: hint_range(0.0, 1.0, 0.01) = 500;
+
+const float angle = 45.0;
+const float RADIANS = angle * 0.0174532;
+const ivec2 reps = ivec2(2, 2);
+const vec2 mid = vec2(0.5);
+const float rad = 0.25;
+
+void fragment() {
+       vec2 tile_coord = mod(FRAGCOORD.xy * SCREEN_PIXEL_SIZE.x, vec2(1.0 / grid_size));
+       
+       vec2 uv =  tile_coord * grid_size - mid;
+       float len = clamp(length(uv) / dot_size, 0, 1);
+       
+       // anti-aliased
+       float sharpness = 50.;
+       float circ = dot_size * sharpness - length(uv) * sharpness;
+       
+       if (abs(circ - 50.) > 50.) {
+               COLOR = bg_color;
+       } else {
+               COLOR = dots_color;
+       }
+
+       
+//     // the uv.. we are calling it p for pixel
+//     vec2 p = FRAGCOORD.xy / SCREEN_PIXEL_SIZE.xy;
+//     // account for non square image aspect
+//     p.y *= float(SCREEN_PIXEL_SIZE.y)/ float(SCREEN_PIXEL_SIZE.x);
+//     //rotating the whole scene
+//     mat2 rot = mat2(vec2(cos(RADIANS), -sin(RADIANS)), vec2(sin(RADIANS), cos(RADIANS)));
+//     p *= rot;
+//
+//
+//     // q is just an offset - .5
+//     vec2 q = p - vec2(0.5, 0.5);
+//
+//     // creates a repeating 0-1 range
+//     vec2 repeat = vec2(fract(q.x * float(reps.x)), fract(q.y * float(reps.y)) );
+//
+//     vec2 distFromMid = repeat - mid;
+//
+//     // drawing circles based on distance from center of each cell
+//     float dist = length(distFromMid);
+//
+//     // anti-aliased
+//     float sharpness = 50.;
+//     float circ = rad * sharpness - dist * sharpness;
+//     // for black on white, subtract rad from dist
+//
+//     // holds the color
+//     vec3 col;
+//     if (abs(circ - 50.) > 50.) {
+//             col = bg_color;
+//     } else {
+//             col = dots_color;
+//     }
+//
+//     COLOR = vec4(col, 1);
+}
\ No newline at end of file