Browse Source

Improve and update Control Gallery for Godot 4.0

- Add a Tree example.
- Add more tabs to make tab scroll buttons visible.
- Use default project font, which is now a DynamicFont in Godot 4.0.
- Make splitters thinner but have a larger draggable area,
  thanks to the new Minimum Grab Thickness theme item.
- Tweak background color to be more visually pleasant.
- Use Compatibility backend to maximize performance and compatibility.
- Disable V-Sync to reduce input lag (while keeping low-processor mode).
Hugo Locurcio 2 years ago
parent
commit
a0ad65d7df

+ 2 - 2
gui/control_gallery/README.md

@@ -11,10 +11,10 @@ space between panels to resize them.
 
 
 Language: GDScript
 Language: GDScript
 
 
-Renderer: Vulkan Mobile
+Renderer: Compatibility
 
 
 Check out this demo on the asset library: https://godotengine.org/asset-library/asset/890
 Check out this demo on the asset library: https://godotengine.org/asset-library/asset/890
 
 
 ## Screenshots
 ## Screenshots
 
 
-![Screenshot](screenshots/control_gallery.png)
+![Screenshot](screenshots/control_gallery.webp)

+ 277 - 229
gui/control_gallery/control_gallery.tscn

@@ -1,18 +1,12 @@
-[gd_scene load_steps=7 format=3 uid="uid://dy11txudwdmgy"]
+[gd_scene load_steps=5 format=3 uid="uid://dy11txudwdmgy"]
 
 
-[ext_resource type="Texture2D" uid="uid://bc22e06hdx8c" path="res://icon.png" id="1"]
-[ext_resource type="FontData" uid="uid://b2qlx6s5n2787" path="res://noto_sans_ui_regular.ttf" id="2"]
-
-[sub_resource type="Font" id="1"]
-data/0 = ExtResource( "2" )
-
-[sub_resource type="Theme" id="2"]
-default_font = SubResource( "1" )
+[ext_resource type="Texture2D" uid="uid://bc22e06hdx8c" path="res://icon.png" id="1_8tycj"]
+[ext_resource type="Script" path="res://tree.gd" id="2_68sc3"]
 
 
 [sub_resource type="StyleBoxFlat" id="StyleBoxFlat_bl4wp"]
 [sub_resource type="StyleBoxFlat" id="StyleBoxFlat_bl4wp"]
 content_margin_left = 10.0
 content_margin_left = 10.0
-content_margin_right = 10.0
 content_margin_top = 10.0
 content_margin_top = 10.0
+content_margin_right = 10.0
 content_margin_bottom = 10.0
 content_margin_bottom = 10.0
 bg_color = Color(0.309804, 0.309804, 0.309804, 1)
 bg_color = Color(0.309804, 0.309804, 0.309804, 1)
 corner_radius_top_left = 5
 corner_radius_top_left = 5
@@ -23,332 +17,389 @@ corner_radius_bottom_left = 5
 [sub_resource type="ButtonGroup" id="ButtonGroup_t0nh8"]
 [sub_resource type="ButtonGroup" id="ButtonGroup_t0nh8"]
 
 
 [node name="ControlGallery" type="Control"]
 [node name="ControlGallery" type="Control"]
+layout_mode = 3
+anchors_preset = 15
 anchor_right = 1.0
 anchor_right = 1.0
 anchor_bottom = 1.0
 anchor_bottom = 1.0
-theme = SubResource( "2" )
+grow_horizontal = 2
+grow_vertical = 2
 
 
 [node name="MainPanel" type="ColorRect" parent="."]
 [node name="MainPanel" type="ColorRect" parent="."]
+layout_mode = 1
+anchors_preset = 15
 anchor_right = 1.0
 anchor_right = 1.0
 anchor_bottom = 1.0
 anchor_bottom = 1.0
-color = Color(0.631373, 0.631373, 0.631373, 1)
+grow_horizontal = 2
+grow_vertical = 2
+color = Color(0.211765, 0.211765, 0.211765, 1)
 
 
 [node name="HSplitContainer" type="HSplitContainer" parent="MainPanel"]
 [node name="HSplitContainer" type="HSplitContainer" parent="MainPanel"]
+layout_mode = 1
+anchors_preset = 15
 anchor_right = 1.0
 anchor_right = 1.0
 anchor_bottom = 1.0
 anchor_bottom = 1.0
-offset_left = 10.0
-offset_top = 10.0
-offset_right = -10.0
-offset_bottom = -10.0
+offset_left = 5.0
+offset_top = 5.0
+offset_right = -5.0
+offset_bottom = -5.0
+grow_horizontal = 2
+grow_vertical = 2
+theme_override_constants/separation = 0
+theme_override_constants/minimum_grab_thickness = 24
 
 
 [node name="BasicControls" type="PanelContainer" parent="MainPanel/HSplitContainer"]
 [node name="BasicControls" type="PanelContainer" parent="MainPanel/HSplitContainer"]
-offset_right = 328.0
-offset_bottom = 580.0
+layout_mode = 2
 size_flags_horizontal = 3
 size_flags_horizontal = 3
-theme_override_styles/panel = SubResource( "StyleBoxFlat_bl4wp" )
+theme_override_styles/panel = SubResource("StyleBoxFlat_bl4wp")
 
 
 [node name="VBoxContainer" type="VBoxContainer" parent="MainPanel/HSplitContainer/BasicControls"]
 [node name="VBoxContainer" type="VBoxContainer" parent="MainPanel/HSplitContainer/BasicControls"]
-offset_left = 10.0
-offset_top = 10.0
-offset_right = 318.0
-offset_bottom = 570.0
+layout_mode = 2
 size_flags_horizontal = 3
 size_flags_horizontal = 3
 
 
 [node name="Title" type="Label" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
 [node name="Title" type="Label" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
-offset_right = 308.0
-offset_bottom = 26.0
+layout_mode = 2
+theme_override_font_sizes/font_size = 24
 text = "Basic controls"
 text = "Basic controls"
 horizontal_alignment = 1
 horizontal_alignment = 1
-__meta__ = {
-"_edit_use_anchors_": false
-}
 
 
 [node name="Button" type="Button" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
 [node name="Button" type="Button" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
-offset_top = 30.0
-offset_right = 308.0
-offset_bottom = 61.0
+layout_mode = 2
 text = "Button"
 text = "Button"
 
 
 [node name="LinkButton" type="LinkButton" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
 [node name="LinkButton" type="LinkButton" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
-offset_top = 65.0
-offset_right = 308.0
-offset_bottom = 88.0
-hint_tooltip = "Hint Tooltip"
+layout_mode = 2
+tooltip_text = "This is a tooltip.
+
+Its background is styled using the TooltipPanel class within a Theme resource.
+Its text is styled using the TooltipLabel class within a Theme resource."
 text = "LinkButton (hover me for tooltip)"
 text = "LinkButton (hover me for tooltip)"
-__meta__ = {
-"_edit_use_anchors_": false
-}
 
 
 [node name="ColorPickerContainer" type="HBoxContainer" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
 [node name="ColorPickerContainer" type="HBoxContainer" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
-offset_top = 92.0
-offset_right = 308.0
-offset_bottom = 123.0
+layout_mode = 2
 
 
 [node name="ColorPickerButton" type="ColorPickerButton" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/ColorPickerContainer"]
 [node name="ColorPickerButton" type="ColorPickerButton" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/ColorPickerContainer"]
-offset_right = 70.0
-offset_bottom = 31.0
+layout_mode = 2
 size_flags_horizontal = 3
 size_flags_horizontal = 3
 size_flags_stretch_ratio = 0.3
 size_flags_stretch_ratio = 0.3
 color = Color(0.278431, 0.54902, 0.74902, 1)
 color = Color(0.278431, 0.54902, 0.74902, 1)
-__meta__ = {
-"_edit_use_anchors_": false
-}
 
 
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/ColorPickerContainer"]
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/ColorPickerContainer"]
-offset_left = 74.0
-offset_top = 2.0
-offset_right = 308.0
-offset_bottom = 28.0
+layout_mode = 2
 size_flags_horizontal = 3
 size_flags_horizontal = 3
 text = "ColorPickerButton"
 text = "ColorPickerButton"
 
 
 [node name="CheckBox" type="CheckBox" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
 [node name="CheckBox" type="CheckBox" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
-offset_top = 127.0
-offset_right = 308.0
-offset_bottom = 158.0
+layout_mode = 2
 text = "CheckBox"
 text = "CheckBox"
 
 
 [node name="CheckButton" type="CheckButton" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
 [node name="CheckButton" type="CheckButton" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
-offset_top = 162.0
-offset_right = 308.0
-offset_bottom = 193.0
+layout_mode = 2
 text = "CheckButton"
 text = "CheckButton"
 
 
 [node name="LineEdit" type="LineEdit" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
 [node name="LineEdit" type="LineEdit" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
-offset_top = 197.0
-offset_right = 308.0
-offset_bottom = 228.0
+layout_mode = 2
 text = "LineEdit"
 text = "LineEdit"
 
 
 [node name="TextEdit" type="TextEdit" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
 [node name="TextEdit" type="TextEdit" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
-minimum_size = Vector2(0, 100)
-offset_top = 232.0
-offset_right = 308.0
-offset_bottom = 332.0
+custom_minimum_size = Vector2(0, 110)
+layout_mode = 2
 text = "TextEdit
 text = "TextEdit
 
 
 Unlike LineEdit, I accept multiple lines."
 Unlike LineEdit, I accept multiple lines."
-__meta__ = {
-"_edit_use_anchors_": false
-}
 
 
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
-offset_top = 336.0
-offset_right = 308.0
-offset_bottom = 362.0
+layout_mode = 2
 text = "Label"
 text = "Label"
 
 
 [node name="TabContainer" type="TabContainer" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
 [node name="TabContainer" type="TabContainer" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer"]
-minimum_size = Vector2(0, 180)
-offset_top = 366.0
-offset_right = 308.0
-offset_bottom = 546.0
-__meta__ = {
-"_edit_use_anchors_": false
-}
+custom_minimum_size = Vector2(0, 236)
+layout_mode = 2
 
 
 [node name="Tab 1" type="Control" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer"]
 [node name="Tab 1" type="Control" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer"]
-anchor_right = 1.0
-anchor_bottom = 1.0
-offset_top = 31.0
+layout_mode = 2
 
 
-[node name="RichTextLabel" type="RichTextLabel" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 1"]
+[node name="MarginContainer" type="MarginContainer" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 1"]
+layout_mode = 1
+anchors_preset = 15
 anchor_right = 1.0
 anchor_right = 1.0
 anchor_bottom = 1.0
 anchor_bottom = 1.0
-offset_top = 5.0
+grow_horizontal = 2
+grow_vertical = 2
+theme_override_constants/margin_left = 10
+theme_override_constants/margin_top = 30
+theme_override_constants/margin_right = 10
+theme_override_constants/margin_bottom = 30
+
+[node name="RichTextLabel" type="RichTextLabel" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 1/MarginContainer"]
+layout_mode = 2
+focus_mode = 2
 bbcode_enabled = true
 bbcode_enabled = true
 text = "[center]RichTextLabel: [color=#8ff]Tab 1[/color] is selected.[/center]"
 text = "[center]RichTextLabel: [color=#8ff]Tab 1[/color] is selected.[/center]"
+context_menu_enabled = true
+selection_enabled = true
 
 
 [node name="Tab 2" type="Control" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer"]
 [node name="Tab 2" type="Control" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer"]
 visible = false
 visible = false
+layout_mode = 2
+
+[node name="MarginContainer" type="MarginContainer" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 2"]
+layout_mode = 1
+anchors_preset = 15
 anchor_right = 1.0
 anchor_right = 1.0
 anchor_bottom = 1.0
 anchor_bottom = 1.0
-offset_left = 4.0
-offset_top = 41.0
-offset_right = -4.0
-offset_bottom = -4.0
+grow_horizontal = 2
+grow_vertical = 2
+theme_override_constants/margin_left = 10
+theme_override_constants/margin_top = 30
+theme_override_constants/margin_right = 10
+theme_override_constants/margin_bottom = 30
+
+[node name="RichTextLabel" type="RichTextLabel" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 2/MarginContainer"]
+layout_mode = 2
+focus_mode = 2
+bbcode_enabled = true
+text = "[center]RichTextLabel: [color=#ff8]Tab 2[/color] is selected.[/center]"
+context_menu_enabled = true
+selection_enabled = true
+
+[node name="Tab 3" type="Control" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer"]
+visible = false
+layout_mode = 2
 
 
-[node name="RichTextLabel" type="RichTextLabel" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 2"]
+[node name="MarginContainer" type="MarginContainer" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 3"]
+layout_mode = 1
+anchors_preset = 15
 anchor_right = 1.0
 anchor_right = 1.0
 anchor_bottom = 1.0
 anchor_bottom = 1.0
-offset_top = 5.0
+grow_horizontal = 2
+grow_vertical = 2
+theme_override_constants/margin_left = 10
+theme_override_constants/margin_top = 30
+theme_override_constants/margin_right = 10
+theme_override_constants/margin_bottom = 30
+
+[node name="RichTextLabel" type="RichTextLabel" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 3/MarginContainer"]
+layout_mode = 2
+focus_mode = 2
 bbcode_enabled = true
 bbcode_enabled = true
-text = "[center]RichTextLabel: [color=#ff8]Tab 2[/color] is selected.[/center]"
-__meta__ = {
-"_edit_use_anchors_": false
-}
+text = "[center]RichTextLabel: [color=#8f8]Tab 3[/color] is selected.[/center]"
+context_menu_enabled = true
+selection_enabled = true
+
+[node name="Tab 4" type="Control" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer"]
+visible = false
+layout_mode = 2
+
+[node name="MarginContainer" type="MarginContainer" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 4"]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+theme_override_constants/margin_left = 10
+theme_override_constants/margin_top = 30
+theme_override_constants/margin_right = 10
+theme_override_constants/margin_bottom = 30
+
+[node name="RichTextLabel" type="RichTextLabel" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 4/MarginContainer"]
+layout_mode = 2
+focus_mode = 2
+bbcode_enabled = true
+text = "[center]RichTextLabel: [color=#f88]Tab 4[/color] is selected.[/center]"
+context_menu_enabled = true
+selection_enabled = true
+
+[node name="Tab 5" type="Control" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer"]
+visible = false
+layout_mode = 2
+
+[node name="MarginContainer" type="MarginContainer" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 5"]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+theme_override_constants/margin_left = 10
+theme_override_constants/margin_top = 30
+theme_override_constants/margin_right = 10
+theme_override_constants/margin_bottom = 30
+
+[node name="RichTextLabel" type="RichTextLabel" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 5/MarginContainer"]
+layout_mode = 2
+focus_mode = 2
+bbcode_enabled = true
+text = "[center]RichTextLabel: [color=#f8f]Tab 5[/color] is selected.[/center]"
+context_menu_enabled = true
+selection_enabled = true
+
+[node name="Tab 6" type="Control" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer"]
+visible = false
+layout_mode = 2
+
+[node name="MarginContainer" type="MarginContainer" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 6"]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+theme_override_constants/margin_left = 10
+theme_override_constants/margin_top = 30
+theme_override_constants/margin_right = 10
+theme_override_constants/margin_bottom = 30
+
+[node name="RichTextLabel" type="RichTextLabel" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 6/MarginContainer"]
+layout_mode = 2
+focus_mode = 2
+bbcode_enabled = true
+text = "[center]RichTextLabel: [color=#b8f]Tab 6[/color] is selected.[/center]"
+context_menu_enabled = true
+selection_enabled = true
+
+[node name="Tab 7" type="Control" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer"]
+visible = false
+layout_mode = 2
+
+[node name="MarginContainer" type="MarginContainer" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 7"]
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+theme_override_constants/margin_left = 10
+theme_override_constants/margin_top = 30
+theme_override_constants/margin_right = 10
+theme_override_constants/margin_bottom = 30
+
+[node name="RichTextLabel" type="RichTextLabel" parent="MainPanel/HSplitContainer/BasicControls/VBoxContainer/TabContainer/Tab 7/MarginContainer"]
+layout_mode = 2
+focus_mode = 2
+bbcode_enabled = true
+text = "[center]RichTextLabel: [color=#fb6]Tab 7[/color] is selected.[/center]"
+context_menu_enabled = true
+selection_enabled = true
 
 
 [node name="VSplitContainer" type="VSplitContainer" parent="MainPanel/HSplitContainer"]
 [node name="VSplitContainer" type="VSplitContainer" parent="MainPanel/HSplitContainer"]
-offset_left = 340.0
-offset_right = 1004.0
-offset_bottom = 580.0
+layout_mode = 2
 size_flags_horizontal = 3
 size_flags_horizontal = 3
 size_flags_stretch_ratio = 2.0
 size_flags_stretch_ratio = 2.0
+theme_override_constants/separation = 0
+theme_override_constants/minimum_grab_thickness = 24
 
 
 [node name="Numbers" type="PanelContainer" parent="MainPanel/HSplitContainer/VSplitContainer"]
 [node name="Numbers" type="PanelContainer" parent="MainPanel/HSplitContainer/VSplitContainer"]
-offset_right = 664.0
-offset_bottom = 240.0
-theme_override_styles/panel = SubResource( "StyleBoxFlat_bl4wp" )
+layout_mode = 2
+theme_override_styles/panel = SubResource("StyleBoxFlat_bl4wp")
 
 
 [node name="VBoxContainer" type="VBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers"]
 [node name="VBoxContainer" type="VBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers"]
-offset_left = 10.0
-offset_top = 10.0
-offset_right = 654.0
-offset_bottom = 230.0
-__meta__ = {
-"_edit_use_anchors_": false
-}
+layout_mode = 2
 
 
 [node name="Title" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
 [node name="Title" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
-offset_right = 644.0
-offset_bottom = 26.0
+layout_mode = 2
+theme_override_font_sizes/font_size = 24
 text = "Numbers"
 text = "Numbers"
 horizontal_alignment = 1
 horizontal_alignment = 1
-__meta__ = {
-"_edit_use_anchors_": false
-}
 
 
 [node name="SpinBox" type="SpinBox" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
 [node name="SpinBox" type="SpinBox" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
-minimum_size = Vector2(190, 0)
-offset_top = 30.0
-offset_right = 190.0
-offset_bottom = 61.0
+custom_minimum_size = Vector2(255, 0)
+layout_mode = 2
 size_flags_horizontal = 0
 size_flags_horizontal = 0
 prefix = "SpinBox"
 prefix = "SpinBox"
 
 
 [node name="HSliderContainer" type="HBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
 [node name="HSliderContainer" type="HBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
-offset_top = 65.0
-offset_right = 644.0
-offset_bottom = 91.0
-__meta__ = {
-"_edit_use_anchors_": false
-}
+layout_mode = 2
+theme_override_constants/separation = 10
 
 
 [node name="HSlider" type="HSlider" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/HSliderContainer"]
 [node name="HSlider" type="HSlider" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/HSliderContainer"]
-minimum_size = Vector2(190, 0)
-offset_right = 190.0
-offset_bottom = 16.0
-__meta__ = {
-"_edit_use_anchors_": false
-}
+layout_mode = 2
+size_flags_horizontal = 3
+size_flags_stretch_ratio = 0.5
+value = 50.0
 
 
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/HSliderContainer"]
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/HSliderContainer"]
-offset_left = 194.0
-offset_right = 249.0
-offset_bottom = 26.0
+layout_mode = 2
+size_flags_horizontal = 3
 text = "HSlider"
 text = "HSlider"
-__meta__ = {
-"_edit_use_anchors_": false
-}
 
 
 [node name="ProgressBarContainer" type="HBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
 [node name="ProgressBarContainer" type="HBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
-offset_top = 95.0
-offset_right = 644.0
-offset_bottom = 122.0
-__meta__ = {
-"_edit_use_anchors_": false
-}
+layout_mode = 2
+theme_override_constants/separation = 10
 
 
 [node name="ProgressBar" type="ProgressBar" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/ProgressBarContainer"]
 [node name="ProgressBar" type="ProgressBar" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/ProgressBarContainer"]
-minimum_size = Vector2(190, 0)
-offset_right = 190.0
-offset_bottom = 27.0
+layout_mode = 2
+size_flags_horizontal = 3
+size_flags_stretch_ratio = 0.5
 value = 50.0
 value = 50.0
-__meta__ = {
-"_edit_use_anchors_": false
-}
 
 
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/ProgressBarContainer"]
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/ProgressBarContainer"]
-offset_left = 194.0
-offset_right = 287.0
-offset_bottom = 26.0
+layout_mode = 2
+size_flags_horizontal = 3
 text = "ProgressBar"
 text = "ProgressBar"
 
 
 [node name="HSeparatorContainer" type="HBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
 [node name="HSeparatorContainer" type="HBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
-offset_top = 126.0
-offset_right = 644.0
-offset_bottom = 152.0
-__meta__ = {
-"_edit_use_anchors_": false
-}
+layout_mode = 2
 
 
 [node name="HSeparatorLeft" type="HSeparator" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/HSeparatorContainer"]
 [node name="HSeparatorLeft" type="HSeparator" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/HSeparatorContainer"]
-offset_right = 274.0
-offset_bottom = 26.0
+layout_mode = 2
 size_flags_horizontal = 3
 size_flags_horizontal = 3
 
 
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/HSeparatorContainer"]
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/HSeparatorContainer"]
-offset_left = 278.0
-offset_right = 365.0
-offset_bottom = 26.0
+layout_mode = 2
 text = "HSeparator"
 text = "HSeparator"
-__meta__ = {
-"_edit_use_anchors_": false
-}
 
 
 [node name="HSeparatorRight" type="HSeparator" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/HSeparatorContainer"]
 [node name="HSeparatorRight" type="HSeparator" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/HSeparatorContainer"]
-offset_left = 369.0
-offset_right = 644.0
-offset_bottom = 26.0
+layout_mode = 2
 size_flags_horizontal = 3
 size_flags_horizontal = 3
 
 
 [node name="TextureProgressContainer" type="HBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
 [node name="TextureProgressContainer" type="HBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer"]
-offset_top = 156.0
-offset_right = 644.0
-offset_bottom = 220.0
+layout_mode = 2
 
 
 [node name="Control" type="Control" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/TextureProgressContainer"]
 [node name="Control" type="Control" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/TextureProgressContainer"]
-minimum_size = Vector2(64, 64)
-offset_right = 64.0
-offset_bottom = 64.0
+custom_minimum_size = Vector2(64, 64)
+layout_mode = 2
 
 
 [node name="TextureProgressBar" type="TextureProgressBar" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/TextureProgressContainer/Control"]
 [node name="TextureProgressBar" type="TextureProgressBar" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/TextureProgressContainer/Control"]
+layout_mode = 0
 offset_right = 128.0
 offset_right = 128.0
 offset_bottom = 128.0
 offset_bottom = 128.0
 scale = Vector2(0.5, 0.5)
 scale = Vector2(0.5, 0.5)
 value = 67.0
 value = 67.0
 fill_mode = 4
 fill_mode = 4
-texture_progress = ExtResource( "1" )
-__meta__ = {
-"_edit_layout_mode": 0,
-"_edit_use_custom_anchors": false
-}
+texture_progress = ExtResource("1_8tycj")
 
 
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/TextureProgressContainer"]
 [node name="Label" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Numbers/VBoxContainer/TextureProgressContainer"]
-offset_left = 68.0
-offset_top = 19.0
-offset_right = 218.0
-offset_bottom = 45.0
+layout_mode = 2
 text = "TextureProgressBar"
 text = "TextureProgressBar"
 
 
 [node name="Lists" type="PanelContainer" parent="MainPanel/HSplitContainer/VSplitContainer"]
 [node name="Lists" type="PanelContainer" parent="MainPanel/HSplitContainer/VSplitContainer"]
-offset_top = 252.0
-offset_right = 664.0
-offset_bottom = 580.0
+layout_mode = 2
 size_flags_horizontal = 3
 size_flags_horizontal = 3
 size_flags_vertical = 3
 size_flags_vertical = 3
 size_flags_stretch_ratio = 2.5
 size_flags_stretch_ratio = 2.5
-theme_override_styles/panel = SubResource( "StyleBoxFlat_bl4wp" )
+theme_override_styles/panel = SubResource("StyleBoxFlat_bl4wp")
 
 
 [node name="VBoxContainer" type="VBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Lists"]
 [node name="VBoxContainer" type="VBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Lists"]
-offset_left = 10.0
-offset_top = 10.0
-offset_right = 654.0
-offset_bottom = 318.0
+layout_mode = 2
 
 
 [node name="Title" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer"]
 [node name="Title" type="Label" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer"]
-offset_right = 644.0
-offset_bottom = 26.0
+layout_mode = 2
+theme_override_font_sizes/font_size = 24
 text = "Lists"
 text = "Lists"
 horizontal_alignment = 1
 horizontal_alignment = 1
-__meta__ = {
-"_edit_use_anchors_": false
-}
-
-[node name="OptionButton" type="OptionButton" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer"]
-minimum_size = Vector2(190, 0)
-offset_top = 30.0
-offset_right = 190.0
-offset_bottom = 61.0
+
+[node name="HBoxContainer" type="HBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer"]
+layout_mode = 2
+size_flags_vertical = 3
+theme_override_constants/separation = 10
+
+[node name="VBoxContainer" type="VBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/HBoxContainer"]
+layout_mode = 2
+size_flags_horizontal = 3
+
+[node name="OptionButton" type="OptionButton" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/HBoxContainer/VBoxContainer"]
+layout_mode = 2
 size_flags_horizontal = 0
 size_flags_horizontal = 0
 item_count = 5
 item_count = 5
 selected = 0
 selected = 0
@@ -365,11 +416,9 @@ popup/item_4/text = "Disabled Item"
 popup/item_4/id = 2
 popup/item_4/id = 2
 popup/item_4/disabled = true
 popup/item_4/disabled = true
 
 
-[node name="MenuButton" type="MenuButton" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer"]
-minimum_size = Vector2(190, 0)
-offset_top = 65.0
-offset_right = 190.0
-offset_bottom = 96.0
+[node name="MenuButton" type="MenuButton" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/HBoxContainer/VBoxContainer"]
+custom_minimum_size = Vector2(150, 0)
+layout_mode = 2
 size_flags_horizontal = 0
 size_flags_horizontal = 0
 text = "MenuButton"
 text = "MenuButton"
 flat = false
 flat = false
@@ -400,47 +449,46 @@ popup/item_7/text = "Radio Item 2"
 popup/item_7/checkable = 2
 popup/item_7/checkable = 2
 popup/item_7/id = 7
 popup/item_7/id = 7
 
 
-[node name="RadioButtons" type="VBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer"]
-offset_top = 100.0
-offset_right = 326.0
-offset_bottom = 201.0
+[node name="RadioButtons" type="VBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/HBoxContainer/VBoxContainer"]
+layout_mode = 2
 size_flags_horizontal = 0
 size_flags_horizontal = 0
 
 
-[node name="CheckBox" type="CheckBox" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/RadioButtons"]
-offset_right = 326.0
-offset_bottom = 31.0
+[node name="CheckBox" type="CheckBox" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/HBoxContainer/VBoxContainer/RadioButtons"]
+layout_mode = 2
 button_pressed = true
 button_pressed = true
-button_group = SubResource( "ButtonGroup_t0nh8" )
+button_group = SubResource("ButtonGroup_t0nh8")
 text = "CheckBox with ButtonGroup assigned 1"
 text = "CheckBox with ButtonGroup assigned 1"
 
 
-[node name="CheckBox2" type="CheckBox" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/RadioButtons"]
-offset_top = 35.0
-offset_right = 326.0
-offset_bottom = 66.0
-button_group = SubResource( "ButtonGroup_t0nh8" )
+[node name="CheckBox2" type="CheckBox" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/HBoxContainer/VBoxContainer/RadioButtons"]
+layout_mode = 2
+button_group = SubResource("ButtonGroup_t0nh8")
 text = "CheckBox with ButtonGroup assigned 2"
 text = "CheckBox with ButtonGroup assigned 2"
 
 
-[node name="CheckBox3" type="CheckBox" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/RadioButtons"]
-offset_top = 70.0
-offset_right = 326.0
-offset_bottom = 101.0
-button_group = SubResource( "ButtonGroup_t0nh8" )
+[node name="CheckBox3" type="CheckBox" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/HBoxContainer/VBoxContainer/RadioButtons"]
+layout_mode = 2
+button_group = SubResource("ButtonGroup_t0nh8")
 text = "CheckBox with ButtonGroup assigned 3"
 text = "CheckBox with ButtonGroup assigned 3"
 
 
-[node name="ItemList" type="ItemList" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer"]
-offset_top = 205.0
-offset_right = 644.0
-offset_bottom = 308.0
+[node name="ItemList" type="ItemList" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/HBoxContainer/VBoxContainer"]
+layout_mode = 2
 size_flags_vertical = 3
 size_flags_vertical = 3
-hint_tooltip = "This ItemList allows multiple selection.
-Hold Ctrl or Shift to select multiple items."
 select_mode = 1
 select_mode = 1
 item_count = 4
 item_count = 4
-fixed_icon_size = Vector2(16, 16)
+fixed_icon_size = Vector2i(16, 16)
 item_0/text = "ItemList - Item 1"
 item_0/text = "ItemList - Item 1"
 item_1/text = "ItemList - Item 2"
 item_1/text = "ItemList - Item 2"
 item_2/text = "ItemList - Disabled item with icon assigned"
 item_2/text = "ItemList - Disabled item with icon assigned"
-item_2/icon = ExtResource( "1" )
+item_2/icon = ExtResource("1_8tycj")
 item_2/disabled = true
 item_2/disabled = true
 item_3/text = "ItemList - Item 3 with icon assigned"
 item_3/text = "ItemList - Item 3 with icon assigned"
-item_3/icon = ExtResource( "1" )
+item_3/icon = ExtResource("1_8tycj")
+
+[node name="VBoxContainer2" type="VBoxContainer" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/HBoxContainer"]
+layout_mode = 2
+size_flags_horizontal = 3
+
+[node name="Tree" type="Tree" parent="MainPanel/HSplitContainer/VSplitContainer/Lists/VBoxContainer/HBoxContainer/VBoxContainer2"]
+layout_mode = 2
+size_flags_vertical = 3
+select_mode = 2
+script = ExtResource("2_68sc3")

+ 1 - 0
gui/control_gallery/icon.png.import

@@ -29,5 +29,6 @@ process/fix_alpha_border=true
 process/premult_alpha=false
 process/premult_alpha=false
 process/normal_map_invert_y=false
 process/normal_map_invert_y=false
 process/hdr_as_srgb=false
 process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
 process/size_limit=0
 process/size_limit=0
 detect_3d/compress_to=1
 detect_3d/compress_to=1

BIN
gui/control_gallery/noto_sans_ui_regular.ttf


+ 0 - 33
gui/control_gallery/noto_sans_ui_regular.ttf.import

@@ -1,33 +0,0 @@
-[remap]
-
-importer="font_data_dynamic"
-type="FontData"
-uid="uid://b2qlx6s5n2787"
-path="res://.godot/imported/noto_sans_ui_regular.ttf-37da988dfa3a55ebf3ea2c9fc7b383a8.fontdata"
-
-[deps]
-
-source_file="res://noto_sans_ui_regular.ttf"
-dest_files=["res://.godot/imported/noto_sans_ui_regular.ttf-37da988dfa3a55ebf3ea2c9fc7b383a8.fontdata"]
-
-[params]
-
-antialiased=true
-multichannel_signed_distance_field=false
-msdf_pixel_range=8
-msdf_size=48
-force_autohinter=false
-hinting=1
-subpixel_positioning=1
-embolden=0.0
-transform=Transform2D(1, 0, 0, 1, 0, 0)
-oversampling=0.0
-compress=true
-opentype_feature_overrides={}
-preload/char_ranges=PackedStringArray()
-preload/glyph_ranges=PackedStringArray()
-preload/configurations=PackedStringArray()
-support_overrides/language_enabled=PackedStringArray()
-support_overrides/language_disabled=PackedStringArray()
-support_overrides/script_enabled=PackedStringArray()
-support_overrides/script_disabled=PackedStringArray()

+ 4 - 1
gui/control_gallery/project.godot

@@ -13,15 +13,18 @@ config_version=5
 config/name="Control Gallery"
 config/name="Control Gallery"
 config/description="Showcases various Control nodes with their names affixed for easy recognition."
 config/description="Showcases various Control nodes with their names affixed for easy recognition."
 run/main_scene="res://control_gallery.tscn"
 run/main_scene="res://control_gallery.tscn"
+config/features=PackedStringArray("4.0")
 run/low_processor_mode=true
 run/low_processor_mode=true
 config/icon="res://icon.png"
 config/icon="res://icon.png"
-config/features=PackedStringArray("4.0")
 
 
 [display]
 [display]
 
 
+window/vsync/vsync_mode=0
 window/stretch/mode="canvas_items"
 window/stretch/mode="canvas_items"
 window/stretch/aspect="expand"
 window/stretch/aspect="expand"
 
 
 [rendering]
 [rendering]
 
 
+renderer/rendering_method="gl_compatibility"
+renderer/rendering_method.mobile="gl_compatibility"
 vulkan/rendering/back_end=1
 vulkan/rendering/back_end=1

BIN
gui/control_gallery/screenshots/control_gallery.png


BIN
gui/control_gallery/screenshots/control_gallery.webp


+ 13 - 0
gui/control_gallery/tree.gd

@@ -0,0 +1,13 @@
+@tool
+extends Tree
+
+
+func _ready() -> void:
+	var root: TreeItem = create_item()
+	root.set_text(0, "Tree - Root")
+	var child1: TreeItem = create_item(root)
+	child1.set_text(0, "Tree - Child 1")
+	var child2: TreeItem = create_item(root)
+	child2.set_text(0, "Tree - Child 2")
+	var subchild1: TreeItem = create_item(child1)
+	subchild1.set_text(0, "Tree - Subchild 1")