Fix canvas size having a 1-frame delay in Multiple resolutions (#819)

gui/multiple_resolutions/main.gd

@@ -27,11 +27,11 @@ func _ready():
 	# is resized whenever the window size changes. This is because the root Control node
 	# uses a Full Rect anchor, so its size will always be equal to the window size.
 	resized.connect(self._on_resized)
-	update_container()
+	call_deferred("update_container")
 
 
 func update_container():
-	# The code within this function needs to be run twice to work around an issue with containers
+	# The code within this function needs to be run deferred to work around an issue with containers
 	# having a 1-frame delay with updates.
 	# Otherwise, `panel.size` returns a value of the previous frame, which results in incorrect
 	# sizing of the inner AspectRatioContainer when using the Fit to Window setting.
@@ -75,17 +75,17 @@ func _on_gui_aspect_ratio_item_selected(index):
 		6:  # 21:9
 			gui_aspect_ratio = 21.0 / 9.0
 
-	update_container()
+	call_deferred("update_container")
 
 
 func _on_resized():
-	update_container()
+	call_deferred("update_container")
 
 
 func _on_gui_margin_drag_ended(_value_changed):
 	gui_margin = $"Panel/AspectRatioContainer/Panel/CenterContainer/Options/GUIMargin/HSlider".value
 	$"Panel/AspectRatioContainer/Panel/CenterContainer/Options/GUIMargin/Value".text = str(gui_margin)
-	update_container()
+	call_deferred("update_container")
 
 
 func _on_window_base_size_item_selected(index):
@@ -108,7 +108,7 @@ func _on_window_base_size_item_selected(index):
 			base_window_size = Vector2(1680, 720)
 
 	get_viewport().content_scale_size = base_window_size
-	update_container()
+	call_deferred("update_container")
 
 
 func _on_window_stretch_mode_item_selected(index):

gui/multiple_resolutions/main.tscn

@@ -19,12 +19,15 @@ border_width_bottom = 8
 border_color = Color(0.25, 0.38, 0.8, 0.5)
 
 [node name="Main" type="Control"]
+layout_mode = 3
+anchors_preset = 15
 anchor_right = 1.0
 anchor_bottom = 1.0
-script = ExtResource( "1" )
+script = ExtResource("1")
 
 [node name="OuterSideLabel" type="Label" parent="."]
 modulate = Color(1, 1, 1, 0.627451)
+layout_mode = 0
 offset_left = 8.0
 offset_top = 8.0
 offset_right = 165.0
@@ -35,12 +38,16 @@ metadata/_edit_layout_mode = 1
 metadata/_edit_use_custom_anchors = false
 
 [node name="Panel" type="Panel" parent="."]
+layout_mode = 1
+anchors_preset = 15
 anchor_right = 1.0
 anchor_bottom = 1.0
-theme_override_styles/panel = SubResource( "StyleBoxFlat_vvbdh" )
+theme_override_styles/panel = SubResource("StyleBoxFlat_vvbdh")
 
 [node name="InnerSideLabel" type="Label" parent="Panel"]
 modulate = Color(0.666667, 1, 0.501961, 1)
+layout_mode = 1
+anchors_preset = 2
 anchor_top = 1.0
 anchor_bottom = 1.0
 offset_left = 8.0
@@ -54,29 +61,36 @@ metadata/_edit_layout_mode = 1
 metadata/_edit_use_custom_anchors = false
 
 [node name="AspectRatioContainer" type="AspectRatioContainer" parent="Panel"]
+layout_mode = 1
+anchors_preset = 15
 anchor_right = 1.0
 anchor_bottom = 1.0
 
 [node name="Panel" type="Panel" parent="Panel/AspectRatioContainer"]
-offset_left = 212.0
-offset_right = 812.0
-offset_bottom = 600.0
-theme_override_styles/panel = SubResource( "StyleBoxFlat_dyby4" )
+layout_mode = 2
+theme_override_styles/panel = SubResource("StyleBoxFlat_dyby4")
 
 [node name="TopLeft" type="ColorRect" parent="Panel/AspectRatioContainer/Panel"]
+layout_mode = 0
 color = Color(1, 1, 1, 0.25098)
 
 [node name="TopRight" type="ColorRect" parent="Panel/AspectRatioContainer/Panel"]
+layout_mode = 1
+anchors_preset = 1
 anchor_left = 1.0
 anchor_right = 1.0
 color = Color(1, 1, 1, 0.25098)
 
 [node name="BottomLeft" type="ColorRect" parent="Panel/AspectRatioContainer/Panel"]
+layout_mode = 1
+anchors_preset = 2
 anchor_top = 1.0
 anchor_bottom = 1.0
 color = Color(1, 1, 1, 0.25098)
 
 [node name="BottomRight" type="ColorRect" parent="Panel/AspectRatioContainer/Panel"]
+layout_mode = 1
+anchors_preset = 3
 anchor_left = 1.0
 anchor_top = 1.0
 anchor_right = 1.0
@@ -84,41 +98,31 @@ anchor_bottom = 1.0
 color = Color(1, 1, 1, 0.25098)
 
 [node name="CenterContainer" type="CenterContainer" parent="Panel/AspectRatioContainer/Panel"]
+layout_mode = 1
+anchors_preset = 15
 anchor_right = 1.0
 anchor_bottom = 1.0
 
 [node name="Options" type="VBoxContainer" parent="Panel/AspectRatioContainer/Panel/CenterContainer"]
-offset_left = 112.0
-offset_top = 152.0
-offset_right = 488.0
-offset_bottom = 447.0
+layout_mode = 2
 theme_override_constants/separation = 10
 
 [node name="Title" type="Label" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options"]
-minimum_size = Vector2(0, 45)
-offset_right = 376.0
-offset_bottom = 45.0
+layout_mode = 2
 theme_override_colors/font_color = Color(1, 0.87, 0.62, 1)
 theme_override_font_sizes/font_size = 24
 text = "Options"
 horizontal_alignment = 1
 
 [node name="WindowBaseSize" type="HBoxContainer" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options"]
-offset_top = 55.0
-offset_right = 376.0
-offset_bottom = 86.0
+layout_mode = 2
 
 [node name="Label" type="Label" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/WindowBaseSize"]
-minimum_size = Vector2(190, 0)
-offset_top = 2.0
-offset_right = 190.0
-offset_bottom = 28.0
+layout_mode = 2
 text = "Window Base Size"
 
 [node name="OptionButton" type="OptionButton" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/WindowBaseSize"]
-offset_left = 194.0
-offset_right = 376.0
-offset_bottom = 31.0
+layout_mode = 2
 size_flags_horizontal = 3
 item_count = 8
 selected = 0
@@ -140,21 +144,14 @@ popup/item_7/text = "1680×720 (21:9)"
 popup/item_7/id = 7
 
 [node name="WindowStretchMode" type="HBoxContainer" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options"]
-offset_top = 96.0
-offset_right = 376.0
-offset_bottom = 127.0
+layout_mode = 2
 
 [node name="Label" type="Label" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/WindowStretchMode"]
-minimum_size = Vector2(190, 0)
-offset_top = 2.0
-offset_right = 190.0
-offset_bottom = 28.0
+layout_mode = 2
 text = "Window Stretch Mode"
 
 [node name="OptionButton" type="OptionButton" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/WindowStretchMode"]
-offset_left = 194.0
-offset_right = 376.0
-offset_bottom = 31.0
+layout_mode = 2
 size_flags_horizontal = 3
 item_count = 3
 selected = 1
@@ -166,21 +163,14 @@ popup/item_2/text = "Viewport"
 popup/item_2/id = 2
 
 [node name="WindowStretchAspect" type="HBoxContainer" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options"]
-offset_top = 137.0
-offset_right = 376.0
-offset_bottom = 168.0
+layout_mode = 2
 
 [node name="Label" type="Label" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/WindowStretchAspect"]
-minimum_size = Vector2(190, 0)
-offset_top = 2.0
-offset_right = 190.0
-offset_bottom = 28.0
+layout_mode = 2
 text = "Window Stretch Aspect"
 
 [node name="OptionButton" type="OptionButton" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/WindowStretchAspect"]
-offset_left = 194.0
-offset_right = 376.0
-offset_bottom = 31.0
+layout_mode = 2
 size_flags_horizontal = 3
 item_count = 5
 selected = 4
@@ -196,20 +186,14 @@ popup/item_4/text = "Expand"
 popup/item_4/id = 4
 
 [node name="WindowScaleFactor" type="HBoxContainer" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options"]
-offset_top = 178.0
-offset_right = 376.0
-offset_bottom = 204.0
+layout_mode = 2
 
 [node name="Label" type="Label" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/WindowScaleFactor"]
-minimum_size = Vector2(190, 0)
-offset_right = 190.0
-offset_bottom = 26.0
+layout_mode = 2
 text = "Window Scale Factor"
 
 [node name="HSlider" type="HSlider" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/WindowScaleFactor"]
-offset_left = 194.0
-offset_right = 330.0
-offset_bottom = 16.0
+layout_mode = 2
 size_flags_horizontal = 3
 size_flags_stretch_ratio = 100.0
 min_value = 0.75
@@ -218,33 +202,22 @@ step = 0.01
 value = 1.0
 
 [node name="Value" type="Label" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/WindowScaleFactor"]
-offset_left = 334.0
-offset_right = 376.0
-offset_bottom = 26.0
+layout_mode = 2
 size_flags_horizontal = 3
 text = "100%"
 
 [node name="HSeparator" type="HSeparator" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options"]
-offset_top = 214.0
-offset_right = 376.0
-offset_bottom = 218.0
+layout_mode = 2
 
 [node name="GUIMaxAspectRatio" type="HBoxContainer" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options"]
-offset_top = 228.0
-offset_right = 376.0
-offset_bottom = 259.0
+layout_mode = 2
 
 [node name="Label" type="Label" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/GUIMaxAspectRatio"]
-minimum_size = Vector2(190, 0)
-offset_top = 2.0
-offset_right = 190.0
-offset_bottom = 28.0
+layout_mode = 2
 text = "GUI Max Aspect Ratio"
 
 [node name="OptionButton" type="OptionButton" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/GUIMaxAspectRatio"]
-offset_left = 194.0
-offset_right = 376.0
-offset_bottom = 31.0
+layout_mode = 2
 size_flags_horizontal = 3
 item_count = 7
 selected = 0
@@ -264,28 +237,20 @@ popup/item_6/text = "21:9"
 popup/item_6/id = 6
 
 [node name="GUIMargin" type="HBoxContainer" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options"]
-offset_top = 269.0
-offset_right = 376.0
-offset_bottom = 295.0
+layout_mode = 2
 
 [node name="Label" type="Label" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/GUIMargin"]
-minimum_size = Vector2(190, 0)
-offset_right = 190.0
-offset_bottom = 26.0
+layout_mode = 2
 text = "GUI Margin"
 
 [node name="HSlider" type="HSlider" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/GUIMargin"]
-offset_left = 194.0
-offset_right = 362.0
-offset_bottom = 16.0
+layout_mode = 2
 size_flags_horizontal = 3
 size_flags_stretch_ratio = 100.0
 max_value = 50.0
 
 [node name="Value" type="Label" parent="Panel/AspectRatioContainer/Panel/CenterContainer/Options/GUIMargin"]
-offset_left = 366.0
-offset_right = 376.0
-offset_bottom = 26.0
+layout_mode = 2
 size_flags_horizontal = 3
 text = "0"
 

gui/multiple_resolutions/project.godot

@@ -28,17 +28,16 @@ with an overscan area to prevent GUI elements from being cut off.
 This can also improve the gameplay experience on large monitors
 by bringing HUD elements closer to the center of the screen."
 run/main_scene="res://main.tscn"
+config/features=PackedStringArray("4.0")
 run/low_processor_mode=true
 config/icon="res://icon.png"
-config/features=PackedStringArray("4.0")
 
 [display]
 
+window/size/viewport_width=648
 window/handheld/orientation="sensor"
 window/stretch/mode="canvas_items"
 window/stretch/aspect="expand"
-window/size/viewport_width=648
-window/size/viewport_height=648
 window/size/test_width=1152
 window/size/test_height=648
 
@@ -48,6 +47,6 @@ theme/default_font_multichannel_signed_distance_field=true
 
 [rendering]
 
-vulkan/rendering/back_end=1
 environment/defaults/default_clear_color=Color(0.133333, 0.133333, 0.2, 1)
+vulkan/rendering/back_end=1
 quality/driver/driver_name="GLES2"