Improve UI

src/scenes/main.tscn

@@ -1,4 +1,4 @@
-[gd_scene load_steps=13 format=3 uid="uid://bjah7k4bxo044"]
+[gd_scene load_steps=15 format=3 uid="uid://bjah7k4bxo044"]
 
 [ext_resource type="Script" uid="uid://5sbslwysin5a" path="res://src/Main.gd" id="1_64y3g"]
 [ext_resource type="Script" uid="uid://d106170kuigl3" path="res://src/ImageCompositor.gd" id="2_4ykh7"]
@@ -9,6 +9,7 @@
 [ext_resource type="Theme" uid="uid://cwqlns34rj3vx" path="res://src/theme.tres" id="6_rjp5f"]
 [ext_resource type="Script" uid="uid://bxgmf2ny7yuc8" path="res://src/MainUI.gd" id="7_5puhk"]
 [ext_resource type="Script" uid="uid://bh0gpu3i2p47f" path="res://src/VersionLabel.gd" id="8_kod8x"]
+[ext_resource type="Shader" uid="uid://brjouqq6wqp5u" path="res://src/shader/uibarbg.gdshader" id="9_lp058"]
 
 [sub_resource type="ShaderMaterial" id="ShaderMaterial_y2ea0"]
 shader = ExtResource("3_0fllm")
@@ -17,9 +18,11 @@ shader_parameter/zoom_level = Vector2(1, 1)
 [sub_resource type="ViewportTexture" id="ViewportTexture_lct1c"]
 viewport_path = NodePath("Compositor")
 
+[sub_resource type="ShaderMaterial" id="ShaderMaterial_24j03"]
+shader = ExtResource("9_lp058")
+
 [sub_resource type="LabelSettings" id="LabelSettings_6o860"]
 font_size = 12
-shadow_color = Color(0, 0, 0, 1)
 
 [node name="Main" type="Node2D"]
 script = ExtResource("1_64y3g")
@@ -36,7 +39,7 @@ script = ExtResource("4_pbpx2")
 
 [node name="Camera" type="Camera2D" parent="."]
 unique_name_in_owner = true
-offset = Vector2(0, -64)
+offset = Vector2(0, -32)
 script = ExtResource("5_hkdq6")
 
 [node name="CanvasLayerBg" type="CanvasLayer" parent="."]
@@ -74,6 +77,27 @@ pivot_offset = Vector2(320, 320)
 theme = ExtResource("6_rjp5f")
 script = ExtResource("7_5puhk")
 
+[node name="TopBarBg" type="ColorRect" parent="CanvasLayer/MainUI"]
+material = SubResource("ShaderMaterial_24j03")
+layout_mode = 1
+anchors_preset = 10
+anchor_right = 1.0
+offset_bottom = 48.0
+grow_horizontal = 2
+color = Color(0, 0, 0, 0.39215687)
+
+[node name="BottomBarBg" type="ColorRect" parent="CanvasLayer/MainUI"]
+material = SubResource("ShaderMaterial_24j03")
+layout_mode = 1
+anchors_preset = 12
+anchor_top = 1.0
+anchor_right = 1.0
+anchor_bottom = 1.0
+offset_top = -26.0
+grow_horizontal = 2
+grow_vertical = 0
+color = Color(0, 0, 0, 0.39215687)
+
 [node name="OpenShaderDialog" type="FileDialog" parent="CanvasLayer/MainUI"]
 unique_name_in_owner = true
 auto_translate_mode = 1
@@ -118,27 +142,27 @@ ok_button_text = "Close"
 unique_name_in_owner = true
 layout_mode = 1
 offset_left = 16.0
-offset_top = 16.0
+offset_top = 8.0
 offset_right = 128.0
-offset_bottom = 48.0
+offset_bottom = 40.0
 text = "Open Shader"
 
 [node name="OpenImageButton" type="Button" parent="CanvasLayer/MainUI"]
 unique_name_in_owner = true
 layout_mode = 1
-offset_left = 16.0
-offset_top = 56.0
-offset_right = 128.0
-offset_bottom = 88.0
+offset_left = 144.0
+offset_top = 8.249329
+offset_right = 256.0
+offset_bottom = 40.24933
 text = "Open Image"
 
 [node name="SaveImageButton" type="Button" parent="CanvasLayer/MainUI"]
 unique_name_in_owner = true
 layout_mode = 1
-offset_left = 144.0
-offset_top = 16.0
-offset_right = 216.0
-offset_bottom = 48.0
+offset_left = 272.0
+offset_top = 8.249329
+offset_right = 344.0
+offset_bottom = 40.24933
 disabled = true
 text = "Export"
 
@@ -149,9 +173,9 @@ anchors_preset = 1
 anchor_left = 1.0
 anchor_right = 1.0
 offset_left = -176.0
-offset_top = 16.0
+offset_top = 8.249329
 offset_right = -128.0
-offset_bottom = 48.0
+offset_bottom = 40.24933
 grow_horizontal = 0
 text = "Fit"
 
@@ -162,9 +186,9 @@ anchors_preset = 1
 anchor_left = 1.0
 anchor_right = 1.0
 offset_left = -112.0
-offset_top = 16.0
+offset_top = 8.249329
 offset_right = -16.0
-offset_bottom = 48.0
+offset_bottom = 40.24933
 grow_horizontal = 0
 text = "Apply (F5)"
 
@@ -175,9 +199,9 @@ anchors_preset = 1
 anchor_left = 1.0
 anchor_right = 1.0
 offset_left = -220.0
-offset_top = 21.0
+offset_top = 13.0
 offset_right = -196.0
-offset_bottom = 45.0
+offset_bottom = 37.0
 grow_horizontal = 0
 disabled = true
 ignore_texture_size = true

src/shader/ivd_outline.gdshader

@@ -1,4 +1,5 @@
 shader_type canvas_item;
+render_mode unshaded;
 
 uniform vec2 zoom_level = vec2(1.0);
 const float thickness = 3.0;

src/shader/uibarbg.gdshader

@@ -0,0 +1,11 @@
+shader_type canvas_item;
+render_mode unshaded;
+
+uniform sampler2D screen_texture: hint_screen_texture, filter_linear_mipmap;
+
+void fragment() {
+	vec4 screen = textureLod(screen_texture, SCREEN_UV, 4.0);
+	vec3 col = mix(screen.rgb, COLOR.rgb, COLOR.a);
+	COLOR.rgb = col;
+	COLOR.a = 1.0;
+}

src/shader/uibarbg.gdshader.uid

@@ -0,0 +1 @@
+uid://brjouqq6wqp5u