Redesign the bank explorer

utopia-rise · Mar 13, 2024 · 4d8df0b · 4d8df0b
1 parent 5e96ef8
commit 4d8df0b
Show file tree

Hide file tree

Showing 5 changed files with 187 additions and 66 deletions.
diff --git a/demo/addons/fmod/tool/property_editors/FmodBankPathsPropertyEditorUi.tscn b/demo/addons/fmod/tool/property_editors/FmodBankPathsPropertyEditorUi.tscn
@@ -1,6 +1,6 @@
 [gd_scene load_steps=2 format=3 uid="uid://dtlwk8wdeal3h"]
 
-[ext_resource type="Texture2D" uid="uid://bkqdeaojmbbaj" path="res://addons/fmod/icons/bank_icon.svg" id="1_11c48"]
+[ext_resource type="Texture2D" uid="uid://o2chsr07oeqs" path="res://addons/fmod/icons/bank_icon.svg" id="1_11c48"]
 
 [node name="FmodBankPathsPropertyEditorUi" type="VBoxContainer"]
 offset_right = 92.0

diff --git a/demo/addons/fmod/tool/ui/FmodBankExplorer.gd b/demo/addons/fmod/tool/ui/FmodBankExplorer.gd
@@ -33,6 +33,8 @@ func _ready():
 	copy_guid_button.text = "Copy"
 	copy_path_button.visible = false
 	copy_guid_button.visible = false
+	copy_path_button.size_flags_horizontal = Control.SIZE_SHRINK_CENTER + Control.SIZE_EXPAND
+	copy_guid_button.size_flags_horizontal = Control.SIZE_SHRINK_CENTER + Control.SIZE_EXPAND
 	copy_path_button.pressed.connect(_on_copy_path_button)
 	copy_guid_button.pressed.connect(_on_copy_guid_button)
 
@@ -49,16 +51,18 @@ func _ready():
 	%SelectButton.pressed.connect(emit_path_and_guid_callable)
 	%SelectButton.pressed.connect(close_window)
 	%CloseButton.pressed.connect(close_window)
+	self.close_requested.connect(close_window)
 
-	%ButtonsContainer.add_child(copy_path_button)
-	%ButtonsContainer.add_child(copy_guid_button)
+	%CopyButtonContainer.add_child(copy_path_button)
+	%CopyButtonContainer.add_child(copy_guid_button)
 
 	tree = %Tree
 	tree.item_selected.connect(_on_item_selected)
 
 	tree.columns = 1
 	regenerate_tree(ToDisplayFlags.BANKS | ToDisplayFlags.BUSES | ToDisplayFlags.VCA | ToDisplayFlags.EVENTS)
 
+
 func regenerate_tree(to_display: int, callable: Callable = Callable()):
 	%SelectButton.visible = should_display_select_button
 	if _current_select_callable != Callable() && _current_select_callable.get_object() != null:
@@ -164,7 +168,7 @@ func _on_item_selected():
 		%SelectButton.visible = false
 		%ParameterSectionSeparator.visible = false
 		%ParametersLabel.visible = false
-		%EventParametersDisplay.visible = false
+		%ParametersContainer.visible = false
 		return
 	%GuidLabel.set_text(metadata.get_guid())
 	%PathLabel.set_text(metadata.get_path())
@@ -178,11 +182,11 @@ func _on_item_selected():
 		%EventParametersDisplay.set_fmod_event(metadata)
 		%ParameterSectionSeparator.visible = true
 		%ParametersLabel.visible = true
-		%EventParametersDisplay.visible = true
+		%ParametersContainer.visible = true
 		return
 	%ParameterSectionSeparator.visible = false
 	%ParametersLabel.visible = false
-	%EventParametersDisplay.visible = false
+	%ParametersContainer.visible = false
 
 func _on_copy_path_button():
 	DisplayServer.clipboard_set(%PathLabel.text)

diff --git a/demo/addons/fmod/tool/ui/FmodBankExplorer.tscn b/demo/addons/fmod/tool/ui/FmodBankExplorer.tscn
@@ -1,15 +1,29 @@
-[gd_scene load_steps=4 format=3 uid="uid://nr38urn226al"]
+[gd_scene load_steps=9 format=3 uid="uid://nr38urn226al"]
 
 [ext_resource type="Script" path="res://addons/fmod/tool/ui/FmodBankExplorer.gd" id="1_ekqus"]
 [ext_resource type="PackedScene" uid="uid://cppeyr1ke5wre" path="res://addons/fmod/tool/ui/EventParametersDisplay.tscn" id="2_uoyg8"]
 
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_55kwc"]
+bg_color = Color(0.117647, 0.133333, 0.160784, 1)
+
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_pth20"]
+bg_color = Color(0.211765, 0.239216, 0.290196, 1)
+
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_j56vo"]
+bg_color = Color(0.117647, 0.133333, 0.160784, 1)
+
 [sub_resource type="LabelSettings" id="LabelSettings_3jkpq"]
 font_size = 25
 
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_x84py"]
+bg_color = Color(0.117647, 0.133333, 0.160784, 1)
+
+[sub_resource type="LabelSettings" id="LabelSettings_d4isr"]
+
 [node name="FmodBankExplorer" type="Window"]
 title = "Fmod banks explorer"
 initial_position = 2
-size = Vector2i(1440, 794)
+size = Vector2i(960, 508)
 script = ExtResource("1_ekqus")
 
 [node name="Panel" type="Panel" parent="."]
@@ -18,101 +32,174 @@ anchor_right = 1.0
 anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
+theme_override_styles/panel = SubResource("StyleBoxFlat_55kwc")
 
-[node name="VBoxContainer" type="VBoxContainer" parent="."]
+[node name="WindowMargin" type="MarginContainer" parent="."]
 anchors_preset = 15
 anchor_right = 1.0
 anchor_bottom = 1.0
 grow_horizontal = 2
 grow_vertical = 2
+theme_override_constants/margin_left = 16
+theme_override_constants/margin_top = 16
+theme_override_constants/margin_right = 16
+theme_override_constants/margin_bottom = 16
+
+[node name="VBoxContainer" type="VBoxContainer" parent="WindowMargin"]
+layout_mode = 2
 size_flags_horizontal = 3
 size_flags_vertical = 3
 
-[node name="HSplitContainer" type="HSplitContainer" parent="VBoxContainer"]
+[node name="Panel" type="PanelContainer" parent="WindowMargin/VBoxContainer"]
 layout_mode = 2
 size_flags_vertical = 3
+theme_override_styles/panel = SubResource("StyleBoxFlat_pth20")
 
-[node name="ScrollContainer" type="ScrollContainer" parent="VBoxContainer/HSplitContainer"]
+[node name="MarginContainer" type="MarginContainer" parent="WindowMargin/VBoxContainer/Panel"]
 layout_mode = 2
-size_flags_horizontal = 3
 size_flags_vertical = 3
+theme_override_constants/margin_left = 8
+theme_override_constants/margin_top = 8
+theme_override_constants/margin_right = 8
+theme_override_constants/margin_bottom = 8
+
+[node name="HSplitContainer" type="HSplitContainer" parent="WindowMargin/VBoxContainer/Panel/MarginContainer"]
+layout_mode = 2
 
-[node name="Tree" type="Tree" parent="VBoxContainer/HSplitContainer/ScrollContainer"]
+[node name="Tree" type="Tree" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_horizontal = 3
 size_flags_vertical = 3
+theme_override_styles/panel = SubResource("StyleBoxFlat_j56vo")
+hide_root = true
 
-[node name="RightPanel" type="ScrollContainer" parent="VBoxContainer/HSplitContainer"]
+[node name="MarginContainer" type="MarginContainer" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer"]
 layout_mode = 2
 size_flags_horizontal = 3
-size_flags_vertical = 3
+theme_override_constants/margin_left = 8
+theme_override_constants/margin_top = 8
+theme_override_constants/margin_right = 8
+theme_override_constants/margin_bottom = 8
 
-[node name="VBoxContainer" type="VBoxContainer" parent="VBoxContainer/HSplitContainer/RightPanel"]
+[node name="RightPanelContent" type="VBoxContainer" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer"]
 layout_mode = 2
 size_flags_horizontal = 3
 size_flags_vertical = 3
 
-[node name="HBoxContainer" type="HBoxContainer" parent="VBoxContainer/HSplitContainer/RightPanel/VBoxContainer"]
+[node name="PathsLabel" type="Label" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent"]
+layout_mode = 2
+size_flags_vertical = 1
+text = "ID:"
+label_settings = SubResource("LabelSettings_3jkpq")
+justification_flags = 35
+
+[node name="PathsBG" type="PanelContainer" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent"]
+layout_mode = 2
+size_flags_horizontal = 3
+theme_override_styles/panel = SubResource("StyleBoxFlat_x84py")
+
+[node name="MarginContainer" type="MarginContainer" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent/PathsBG"]
+layout_mode = 2
+theme_override_constants/margin_left = 8
+theme_override_constants/margin_top = 8
+theme_override_constants/margin_right = 8
+theme_override_constants/margin_bottom = 8
+
+[node name="PathContainer" type="HBoxContainer" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent/PathsBG/MarginContainer"]
 layout_mode = 2
-size_flags_horizontal = 6
-size_flags_vertical = 6
 
-[node name="TitleContainer" type="VBoxContainer" parent="VBoxContainer/HSplitContainer/RightPanel/VBoxContainer/HBoxContainer"]
+[node name="TitleLabelContainer" type="VBoxContainer" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent/PathsBG/MarginContainer/PathContainer"]
 layout_mode = 2
 
-[node name="PathTitleLabel" type="Label" parent="VBoxContainer/HSplitContainer/RightPanel/VBoxContainer/HBoxContainer/TitleContainer"]
+[node name="PathTitleLabel" type="Label" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent/PathsBG/MarginContainer/PathContainer/TitleLabelContainer"]
 layout_mode = 2
-text = "Path: "
+size_flags_vertical = 6
+text = "Path:"
+label_settings = SubResource("LabelSettings_d4isr")
 
-[node name="GuidTitleLabel" type="Label" parent="VBoxContainer/HSplitContainer/RightPanel/VBoxContainer/HBoxContainer/TitleContainer"]
+[node name="GuidTitleLabel" type="Label" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent/PathsBG/MarginContainer/PathContainer/TitleLabelContainer"]
 layout_mode = 2
+size_flags_vertical = 6
 text = "GUID: "
+label_settings = SubResource("LabelSettings_d4isr")
 
-[node name="ValueContainer" type="VBoxContainer" parent="VBoxContainer/HSplitContainer/RightPanel/VBoxContainer/HBoxContainer"]
+[node name="ValueContainer" type="VBoxContainer" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent/PathsBG/MarginContainer/PathContainer"]
 layout_mode = 2
 
-[node name="PathLabel" type="Label" parent="VBoxContainer/HSplitContainer/RightPanel/VBoxContainer/HBoxContainer/ValueContainer"]
+[node name="PathLabel" type="Label" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent/PathsBG/MarginContainer/PathContainer/ValueContainer"]
 unique_name_in_owner = true
 layout_mode = 2
+size_flags_vertical = 6
 
-[node name="GuidLabel" type="Label" parent="VBoxContainer/HSplitContainer/RightPanel/VBoxContainer/HBoxContainer/ValueContainer"]
+[node name="GuidLabel" type="Label" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent/PathsBG/MarginContainer/PathContainer/ValueContainer"]
 unique_name_in_owner = true
 layout_mode = 2
+size_flags_vertical = 6
+vertical_alignment = 1
 
-[node name="ButtonsContainer" type="VBoxContainer" parent="VBoxContainer/HSplitContainer/RightPanel/VBoxContainer/HBoxContainer"]
+[node name="CopyButtonContainer" type="VBoxContainer" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent/PathsBG/MarginContainer/PathContainer"]
 unique_name_in_owner = true
 layout_mode = 2
+size_flags_horizontal = 10
 
-[node name="ParameterSectionSeparator" type="HSeparator" parent="VBoxContainer/HSplitContainer/RightPanel/VBoxContainer"]
+[node name="ParameterSectionSeparator" type="HSeparator" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent"]
 unique_name_in_owner = true
 visible = false
 layout_mode = 2
 
-[node name="ParametersLabel" type="Label" parent="VBoxContainer/HSplitContainer/RightPanel/VBoxContainer"]
+[node name="ParametersLabel" type="Label" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent"]
 unique_name_in_owner = true
 visible = false
 layout_mode = 2
 text = "Parameters:"
 label_settings = SubResource("LabelSettings_3jkpq")
 
-[node name="EventParametersDisplay" parent="VBoxContainer/HSplitContainer/RightPanel/VBoxContainer" instance=ExtResource("2_uoyg8")]
+[node name="ParametersContainer" type="PanelContainer" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent"]
 unique_name_in_owner = true
 visible = false
 layout_mode = 2
+size_flags_vertical = 3
+theme_override_styles/panel = SubResource("StyleBoxFlat_x84py")
 
-[node name="HBoxContainer" type="HBoxContainer" parent="VBoxContainer"]
+[node name="MarginContainer" type="MarginContainer" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent/ParametersContainer"]
 layout_mode = 2
+theme_override_constants/margin_left = 8
+theme_override_constants/margin_top = 8
+theme_override_constants/margin_right = 8
+theme_override_constants/margin_bottom = 8
 
-[node name="SelectButton" type="Button" parent="VBoxContainer/HBoxContainer"]
+[node name="EventParametersDisplay" parent="WindowMargin/VBoxContainer/Panel/MarginContainer/HSplitContainer/MarginContainer/RightPanelContent/ParametersContainer/MarginContainer" instance=ExtResource("2_uoyg8")]
+unique_name_in_owner = true
+layout_mode = 2
+
+[node name="MarginContainer" type="MarginContainer" parent="WindowMargin/VBoxContainer"]
+layout_mode = 2
+theme_override_constants/margin_top = 8
+
+[node name="HBoxContainer" type="HBoxContainer" parent="WindowMargin/VBoxContainer/MarginContainer"]
+layout_mode = 2
+alignment = 1
+
+[node name="MarginContainer2" type="MarginContainer" parent="WindowMargin/VBoxContainer/MarginContainer/HBoxContainer"]
+layout_mode = 2
+theme_override_constants/margin_left = 8
+theme_override_constants/margin_right = 8
+
+[node name="SelectButton" type="Button" parent="WindowMargin/VBoxContainer/MarginContainer/HBoxContainer/MarginContainer2"]
 unique_name_in_owner = true
 visible = false
 layout_mode = 2
-size_flags_horizontal = 3
+size_flags_horizontal = 4
 text = "Select"
 
-[node name="CloseButton" type="Button" parent="VBoxContainer/HBoxContainer"]
+[node name="MarginContainer" type="MarginContainer" parent="WindowMargin/VBoxContainer/MarginContainer/HBoxContainer"]
+layout_mode = 2
+theme_override_constants/margin_left = 8
+theme_override_constants/margin_right = 8
+
+[node name="CloseButton" type="Button" parent="WindowMargin/VBoxContainer/MarginContainer/HBoxContainer/MarginContainer"]
 unique_name_in_owner = true
 layout_mode = 2
-size_flags_horizontal = 3
+size_flags_horizontal = 4
 text = "Close"
diff --git a/demo/addons/fmod/tool/ui/ParameterDisplay.gd b/demo/addons/fmod/tool/ui/ParameterDisplay.gd
@@ -1,4 +1,4 @@
-@tool class_name ParameterDisplay extends VBoxContainer
+@tool class_name ParameterDisplay extends MarginContainer
 
 var parameter: FmodParameterDescription