feat: Add UI scaling using GameTools

.github/workflows/visual_tests.yaml

@@ -51,7 +51,7 @@ jobs:
       - name: 💾 Install Graphics Driver Emulators
         uses: awalsh128/cache-apt-pkgs-action@latest
         with:
-          packages: mesa-vulkan-drivers binutils
+          packages: mesa-vulkan-drivers binutils x11-xserver-utils
           version: 1.0
 
       - name: 🤖 Setup Godot

GameDemo.csproj

@@ -31,7 +31,8 @@
     <RunTests>false</RunTests>
   </PropertyGroup>
 
-  <PropertyGroup Condition="('$(Configuration)' == 'Debug' or '$(Configuration)' == 'ExportDebug') and '$(SkipTests)' != 'true' ">
+  <PropertyGroup
+    Condition="('$(Configuration)' == 'Debug' or '$(Configuration)' == 'ExportDebug') and '$(SkipTests)' != 'true' ">
     <RunTests>true</RunTests>
     <DefineConstants>$(DefineConstants);RUN_TESTS</DefineConstants>
   </PropertyGroup>
@@ -49,7 +50,7 @@
   </ItemGroup>
 
   <ItemGroup>
-    <AdditionalFiles Include="**/*.tscn"/>
+    <AdditionalFiles Include="**/*.tscn" />
   </ItemGroup>
 
   <ItemGroup>
@@ -62,12 +63,15 @@
     <PackageReference Include="Chickensoft.Collections" Version="3.1.4" />
     <PackageReference Include="Chickensoft.GodotNodeInterfaces" Version="2.4.52" />
     <PackageReference Include="Chickensoft.Introspection" Version="3.0.2" />
-    <PackageReference Include="Chickensoft.Introspection.Generator" Version="3.0.2" PrivateAssets="all" OutputItemType="analyzer" />
+    <PackageReference Include="Chickensoft.Introspection.Generator" Version="3.0.2"
+      PrivateAssets="all" OutputItemType="analyzer" />
     <PackageReference Include="Chickensoft.Serialization" Version="3.1.0" />
     <PackageReference Include="Chickensoft.Serialization.Godot" Version="0.8.40" />
     <PackageReference Include="Chickensoft.LogicBlocks" Version="5.20.0" />
-    <PackageReference Include="Chickensoft.LogicBlocks.DiagramGenerator" Version="5.20.0" PrivateAssets="all" OutputItemType="analyzer" />
+    <PackageReference Include="Chickensoft.LogicBlocks.DiagramGenerator" Version="5.20.0"
+      PrivateAssets="all" OutputItemType="analyzer" />
     <PackageReference Include="Chickensoft.UMLGenerator" Version="1.0.0" />
+    <PackageReference Include="Chickensoft.GameTools" Version="3.1.0" />
   </ItemGroup>
 
   <ItemGroup Condition="'$(RunTests)' != 'true'">

project.godot

@@ -21,16 +21,23 @@ settings/stdout/print_fps=true
 
 [display]
 
-window/size/viewport_width=1920
-window/size/viewport_height=1080
-window/stretch/mode="canvas_items"
-window/stretch/aspect="keep_height"
+window/size/viewport_width=3840
+window/size/viewport_height=2160
+window/size/initial_position_type=4
+window/size/window_width_override=1920
+window/size/window_height_override=1080
 window/vsync/vsync_mode=0
 
 [dotnet]
 
 project/assembly_name="GameDemo"
 
+[gui]
+
+theme/default_font_multichannel_signed_distance_field=true
+theme/default_font_generate_mipmaps=true
+theme/default_theme_scale=2.0
+
 [input]
 
 move_up={

src/Main.cs

@@ -1,6 +1,7 @@
 namespace GameDemo;
 
 using Godot;
+using Chickensoft.GameTools.Displays;
 
 #if RUN_TESTS
 using System.Reflection;
@@ -14,12 +15,16 @@ namespace GameDemo;
 
 public partial class Main : Node2D
 {
+  public Vector2I DesignResolution => Display.UHD4k;
 #if RUN_TESTS
   public TestEnvironment Environment = default!;
 #endif
 
   public override void _Ready()
   {
+    // Correct any erroneous scaling and guess sensible defaults.
+    GetWindow().LookGood(WindowScaleBehavior.UIProportional, DesignResolution);
+
 #if RUN_TESTS
     // If this is a debug build, use GoDotTest to examine the
     // command line arguments and determine if we should run tests.

src/app/App.tscn

@@ -71,14 +71,14 @@ stretch = true
 [node name="GamePreview" type="SubViewport" parent="SubViewportContainer"]
 unique_name_in_owner = true
 handle_input_locally = false
-size = Vector2i(1920, 1080)
+size = Vector2i(3840, 2160)
 render_target_update_mode = 4
 
 [node name="AnimationPlayer" type="AnimationPlayer" parent="."]
 unique_name_in_owner = true
 deterministic = true
 libraries = {
-"": SubResource("AnimationLibrary_piei0")
+&"": SubResource("AnimationLibrary_piei0")
 }
 
 [node name="Menu" parent="." instance=ExtResource("4_kh3vh")]

src/death_menu/DeathMenu.tscn

@@ -5,24 +5,24 @@
 
 [sub_resource type="StyleBoxFlat" id="StyleBoxFlat_8nr2f"]
 bg_color = Color(0.890805, 0.000373708, 0.0286205, 0.266667)
-corner_radius_top_left = 8
-corner_radius_top_right = 8
-corner_radius_bottom_right = 8
-corner_radius_bottom_left = 8
+corner_radius_top_left = 16
+corner_radius_top_right = 16
+corner_radius_bottom_right = 16
+corner_radius_bottom_left = 16
 
 [sub_resource type="StyleBoxFlat" id="StyleBoxFlat_bjrl7"]
 bg_color = Color(0.6, 0, 0.0117647, 0.266667)
-corner_radius_top_left = 8
-corner_radius_top_right = 8
-corner_radius_bottom_right = 8
-corner_radius_bottom_left = 8
+corner_radius_top_left = 16
+corner_radius_top_right = 16
+corner_radius_bottom_right = 16
+corner_radius_bottom_left = 16
 
 [sub_resource type="SystemFont" id="SystemFont_yn3ou"]
 subpixel_positioning = 0
 
 [sub_resource type="Theme" id="Theme_48i0m"]
 default_font = SubResource("SystemFont_yn3ou")
-default_font_size = 24
+default_font_size = 48
 Button/styles/focus = SubResource("StyleBoxFlat_8nr2f")
 Button/styles/normal = SubResource("StyleBoxFlat_8nr2f")
 Button/styles/pressed = SubResource("StyleBoxFlat_bjrl7")
@@ -53,11 +53,11 @@ variation_embolden = 0.54
 
 [sub_resource type="LabelSettings" id="LabelSettings_7gk1r"]
 font = SubResource("FontVariation_ps6b3")
-font_size = 48
+font_size = 96
 font_color = Color(1, 0.239216, 0.239216, 1)
 
 [sub_resource type="LabelSettings" id="LabelSettings_jxos6"]
-font_size = 36
+font_size = 72
 font_color = Color(0.788235, 0.227451, 0.227451, 1)
 
 [sub_resource type="Animation" id="Animation_ifg22"]
@@ -192,18 +192,18 @@ anchor_right = 1.0
 anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
-theme_override_constants/margin_left = 80
-theme_override_constants/margin_top = 80
-theme_override_constants/margin_right = 80
-theme_override_constants/margin_bottom = 80
+theme_override_constants/margin_left = 160
+theme_override_constants/margin_top = 160
+theme_override_constants/margin_right = 160
+theme_override_constants/margin_bottom = 160
 
 [node name="VBoxContainer" type="VBoxContainer" parent="MarginContainer"]
 layout_mode = 2
 alignment = 1
 
 [node name="MarginContainer" type="MarginContainer" parent="MarginContainer/VBoxContainer"]
 layout_mode = 2
-theme_override_constants/margin_bottom = 24
+theme_override_constants/margin_bottom = 48
 
 [node name="Title" type="Label" parent="MarginContainer/VBoxContainer/MarginContainer"]
 layout_mode = 2
@@ -219,15 +219,15 @@ horizontal_alignment = 1
 
 [node name="MarginContainer2" type="MarginContainer" parent="MarginContainer/VBoxContainer"]
 layout_mode = 2
-theme_override_constants/margin_top = 48
+theme_override_constants/margin_top = 96
 
 [node name="VBoxContainer" type="VBoxContainer" parent="MarginContainer/VBoxContainer/MarginContainer2"]
 layout_mode = 2
-theme_override_constants/separation = 24
+theme_override_constants/separation = 48
 
 [node name="TryAgainButton" type="Button" parent="MarginContainer/VBoxContainer/MarginContainer2/VBoxContainer"]
 unique_name_in_owner = true
-custom_minimum_size = Vector2(256, 64)
+custom_minimum_size = Vector2(512, 128)
 layout_mode = 2
 size_flags_horizontal = 4
 size_flags_vertical = 0
@@ -236,7 +236,7 @@ text = "Try Again"
 
 [node name="MainMenuButton" type="Button" parent="MarginContainer/VBoxContainer/MarginContainer2/VBoxContainer"]
 unique_name_in_owner = true
-custom_minimum_size = Vector2(256, 64)
+custom_minimum_size = Vector2(512, 128)
 layout_mode = 2
 size_flags_horizontal = 4
 size_flags_vertical = 0

src/in_game_ui/InGameUI.tscn

@@ -35,34 +35,34 @@ alignment = 2
 
 [node name="MarginContainer" type="MarginContainer" parent="HBoxContainer"]
 layout_mode = 2
-theme_override_constants/margin_top = 48
-theme_override_constants/margin_right = 96
+theme_override_constants/margin_top = 96
+theme_override_constants/margin_right = 192
 
 [node name="HBoxContainer" type="HBoxContainer" parent="HBoxContainer/MarginContainer"]
 layout_mode = 2
 
 [node name="CoinsLabel" type="Label" parent="HBoxContainer/MarginContainer/HBoxContainer"]
 unique_name_in_owner = true
-custom_minimum_size = Vector2(200, 2.08165e-12)
+custom_minimum_size = Vector2(400, 2.08165e-12)
 layout_mode = 2
-theme_override_font_sizes/font_size = 48
+theme_override_font_sizes/font_size = 96
 text = "## / ##"
 horizontal_alignment = 2
 
 [node name="MarginContainer" type="MarginContainer" parent="HBoxContainer/MarginContainer/HBoxContainer"]
 layout_mode = 2
-theme_override_constants/margin_left = 24
+theme_override_constants/margin_left = 48
 
 [node name="SubViewportContainer" type="SubViewportContainer" parent="HBoxContainer/MarginContainer/HBoxContainer/MarginContainer"]
-custom_minimum_size = Vector2(128, 128)
+custom_minimum_size = Vector2(256, 256)
 layout_mode = 2
 
 [node name="SubViewport" type="SubViewport" parent="HBoxContainer/MarginContainer/HBoxContainer/MarginContainer/SubViewportContainer"]
 own_world_3d = true
 world_3d = SubResource("World3D_5xwgl")
 transparent_bg = true
 handle_input_locally = false
-size = Vector2i(128, 128)
+size = Vector2i(256, 256)
 render_target_update_mode = 4
 
 [node name="CoinScene" parent="HBoxContainer/MarginContainer/HBoxContainer/MarginContainer/SubViewportContainer/SubViewport" instance=ExtResource("1_eo2h2")]

src/menu/Menu.tscn

@@ -4,38 +4,38 @@
 
 [sub_resource type="StyleBoxFlat" id="StyleBoxFlat_aq8ij"]
 bg_color = Color(1, 1, 1, 0.219608)
-corner_radius_top_left = 8
-corner_radius_top_right = 8
-corner_radius_bottom_right = 8
-corner_radius_bottom_left = 8
+corner_radius_top_left = 16
+corner_radius_top_right = 16
+corner_radius_bottom_right = 16
+corner_radius_bottom_left = 16
 
 [sub_resource type="StyleBoxFlat" id="StyleBoxFlat_nkv16"]
 bg_color = Color(1, 1, 1, 0.513726)
-corner_radius_top_left = 8
-corner_radius_top_right = 8
-corner_radius_bottom_right = 8
-corner_radius_bottom_left = 8
+corner_radius_top_left = 16
+corner_radius_top_right = 16
+corner_radius_bottom_right = 16
+corner_radius_bottom_left = 16
 
 [sub_resource type="StyleBoxFlat" id="StyleBoxFlat_vps5y"]
 bg_color = Color(0.282353, 0.282353, 0.282353, 0.894118)
-corner_radius_top_left = 8
-corner_radius_top_right = 8
-corner_radius_bottom_right = 8
-corner_radius_bottom_left = 8
+corner_radius_top_left = 16
+corner_radius_top_right = 16
+corner_radius_bottom_right = 16
+corner_radius_bottom_left = 16
 
 [sub_resource type="SystemFont" id="SystemFont_yn3ou"]
 subpixel_positioning = 0
 
 [sub_resource type="Theme" id="Theme_orto1"]
 default_font = SubResource("SystemFont_yn3ou")
-default_font_size = 24
+default_font_size = 48
 Button/styles/focus = SubResource("StyleBoxFlat_aq8ij")
 Button/styles/hover = SubResource("StyleBoxFlat_nkv16")
 Button/styles/normal = SubResource("StyleBoxFlat_aq8ij")
 Button/styles/pressed = SubResource("StyleBoxFlat_vps5y")
 
 [sub_resource type="LabelSettings" id="LabelSettings_5fc0a"]
-font_size = 48
+font_size = 96
 
 [node name="Control" type="Control"]
 layout_mode = 3
@@ -54,10 +54,10 @@ anchor_right = 1.0
 anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
-theme_override_constants/margin_left = 80
-theme_override_constants/margin_top = 80
-theme_override_constants/margin_right = 80
-theme_override_constants/margin_bottom = 80
+theme_override_constants/margin_left = 160
+theme_override_constants/margin_top = 160
+theme_override_constants/margin_right = 160
+theme_override_constants/margin_bottom = 160
 
 [node name="HBoxContainer" type="HBoxContainer" parent="MarginContainer"]
 layout_mode = 2
@@ -79,26 +79,26 @@ label_settings = SubResource("LabelSettings_5fc0a")
 [node name="MarginContainer" type="MarginContainer" parent="MarginContainer/HBoxContainer/VBoxContainer3/VBoxContainer"]
 layout_mode = 2
 size_flags_vertical = 3
-theme_override_constants/margin_top = 24
+theme_override_constants/margin_top = 48
 
 [node name="VBoxContainer2" type="VBoxContainer" parent="MarginContainer/HBoxContainer/VBoxContainer3"]
 layout_mode = 2
-theme_override_constants/separation = 20
+theme_override_constants/separation = 40
 
 [node name="NewGameButton" type="Button" parent="MarginContainer/HBoxContainer/VBoxContainer3/VBoxContainer2"]
 unique_name_in_owner = true
-custom_minimum_size = Vector2(2.08165e-12, 64)
+custom_minimum_size = Vector2(2.08165e-12, 128)
 layout_mode = 2
 size_flags_horizontal = 3
 text = "New Game"
 
 [node name="LoadGameButton" type="Button" parent="MarginContainer/HBoxContainer/VBoxContainer3/VBoxContainer2"]
 unique_name_in_owner = true
-custom_minimum_size = Vector2(2.08165e-12, 64)
+custom_minimum_size = Vector2(2.08165e-12, 128)
 layout_mode = 2
 size_flags_horizontal = 3
 text = "Load Game"
 
 [node name="MarginContainer" type="MarginContainer" parent="MarginContainer/HBoxContainer/VBoxContainer3/VBoxContainer2"]
 layout_mode = 2
-theme_override_constants/margin_top = 160
+theme_override_constants/margin_top = 320