From 0e297f0402d0ae464157bd5ac686bfbe930b079e Mon Sep 17 00:00:00 2001 From: Anish Mishra Date: Tue, 4 Feb 2025 16:50:55 +0530 Subject: [PATCH] Improve SettingsMenu for mobile - Adjusted settings menu layout to better support mobile screens. - Fixed horizontal overflow issues. - Removed the **Shortcuts** tab as it is not essential for mobile users. - It could be useful for those using a keyboard, so I'll reconsider its inclusion. - Removed UI scaling options (temporarily) --- src/autoload/HandlerGUI.gd | 2 +- src/ui_parts/settings_menu.gd | 105 ++++++++++++++------------- src/ui_parts/settings_menu.tscn | 29 +++----- src/ui_widgets/setting_shortcut.tscn | 2 +- 4 files changed, 67 insertions(+), 71 deletions(-) diff --git a/src/autoload/HandlerGUI.gd b/src/autoload/HandlerGUI.gd index 0aa8131..64f4309 100644 --- a/src/autoload/HandlerGUI.gd +++ b/src/autoload/HandlerGUI.gd @@ -68,7 +68,7 @@ func _add_control(new_control: Control) -> void: menu_stack.append(overlay_ref) get_tree().root.add_child(overlay_ref) overlay_ref.add_child(new_control) - new_control.set_anchors_and_offsets_preset(Control.PRESET_CENTER) + new_control.set_anchors_and_offsets_preset(Control.PRESET_FULL_RECT) new_control.tree_exiting.connect(_remove_control.bind(overlay_ref)) func _remove_control(overlay_ref: ColorRect = null) -> void: diff --git a/src/ui_parts/settings_menu.gd b/src/ui_parts/settings_menu.gd index 4e846ec..7134f5c 100644 --- a/src/ui_parts/settings_menu.gd +++ b/src/ui_parts/settings_menu.gd @@ -2,7 +2,7 @@ extends PanelContainer const PaletteConfigWidget = preload("res://src/ui_widgets/palette_config.tscn") const ShortcutConfigWidget = preload("res://src/ui_widgets/setting_shortcut.tscn") -const ShortcutShowcaseWidget = preload("res://src/ui_widgets/presented_shortcut.tscn") +#const ShortcutShowcaseWidget = preload("res://src/ui_widgets/presented_shortcut.tscn") const SettingFrame = preload("res://src/ui_widgets/setting_frame.tscn") const ProfileFrame = preload("res://src/ui_widgets/profile_frame.tscn") @@ -46,7 +46,8 @@ func setup_tabs() -> void: var button_group := ButtonGroup.new() add_tab("formatting", Translator.translate("Formatting"), button_group) add_tab("palettes", Translator.translate("Palettes"), button_group) - add_tab("shortcuts", Translator.translate("Shortcuts"), button_group) + # Removing shortcuts tab as this is not really needed for mobile port. + #add_tab("shortcuts", Translator.translate("Shortcuts"), button_group) add_tab("theming", Translator.translate("Theming"), button_group) add_tab("other", Translator.translate("Other"), button_group) @@ -113,32 +114,32 @@ func setup_content() -> void: vbox.size_flags_horizontal = Control.SIZE_EXPAND_FILL content_container.add_child(vbox) rebuild_palettes() - "shortcuts": - advice_panel.hide() - var vbox := VBoxContainer.new() - vbox.size_flags_horizontal = Control.SIZE_EXPAND_FILL - vbox.add_theme_constant_override("separation", 6) - content_container.add_child(vbox) - var categories := HFlowContainer.new() - var button_group := ButtonGroup.new() - for tab_idx in shortcut_tab_names: - var btn := Button.new() - btn.toggle_mode = true - btn.button_group = button_group - btn.pressed.connect(show_shortcuts.bind(tab_idx)) - btn.text = get_translated_shortcut_tab(tab_idx) - btn.mouse_default_cursor_shape = Control.CURSOR_POINTING_HAND - btn.focus_mode = Control.FOCUS_NONE - btn.action_mode = BaseButton.ACTION_MODE_BUTTON_PRESS - categories.add_child(btn) - vbox.add_child(categories) - var shortcuts := VBoxContainer.new() - shortcuts.add_theme_constant_override("separation", 3) - shortcuts.size_flags_horizontal = Control.SIZE_EXPAND_FILL - shortcuts.size_flags_vertical = Control.SIZE_EXPAND_FILL - vbox.add_child(shortcuts) - categories.get_child(0).button_pressed = true - categories.get_child(0).pressed.emit() + #"shortcuts": + #advice_panel.hide() + #var vbox := VBoxContainer.new() + #vbox.size_flags_horizontal = Control.SIZE_EXPAND_FILL + #vbox.add_theme_constant_override("separation", 6) + #content_container.add_child(vbox) + #var categories := HFlowContainer.new() + #var button_group := ButtonGroup.new() + #for tab_idx in shortcut_tab_names: + #var btn := Button.new() + #btn.toggle_mode = true + #btn.button_group = button_group + #btn.pressed.connect(show_shortcuts.bind(tab_idx)) + #btn.text = get_translated_shortcut_tab(tab_idx) + #btn.mouse_default_cursor_shape = Control.CURSOR_POINTING_HAND + #btn.focus_mode = Control.FOCUS_NONE + #btn.action_mode = BaseButton.ACTION_MODE_BUTTON_PRESS + #categories.add_child(btn) + #vbox.add_child(categories) + #var shortcuts := VBoxContainer.new() + #shortcuts.add_theme_constant_override("separation", 3) + #shortcuts.size_flags_horizontal = Control.SIZE_EXPAND_FILL + #shortcuts.size_flags_vertical = Control.SIZE_EXPAND_FILL + #vbox.add_child(shortcuts) + #categories.get_child(0).button_pressed = true + #categories.get_child(0).pressed.emit() "theming": advice_panel.hide() create_setting_container() @@ -220,16 +221,18 @@ func setup_content() -> void: SaveData.HANDLE_SIZE_MIN, SaveData.HANDLE_SIZE_MAX) add_advice(Translator.translate( "Changes the visual size and grabbing area of handles.")) - current_setup_setting = "ui_scale" - add_number_dropdown(Translator.translate("UI scale"), - [0.75, 1.0, 1.25, 1.5, 1.75, 2.0, 2.5, 3.0, 4.0], false, false, - SaveData.UI_SCALE_MIN, SaveData.UI_SCALE_MAX) - add_advice(Translator.translate( - "Changes the scale of the visual user interface.")) - current_setup_setting = "auto_ui_scale" - add_checkbox(Translator.translate("Auto UI scale")) - add_advice(Translator.translate( - "Scales the user interface based on the screen size.")) + + # Temporarily hiding settings to change scale. + #current_setup_setting = "ui_scale" + #add_number_dropdown(Translator.translate("UI scale"), + #[0.75, 1.0, 1.25, 1.5, 1.75, 2.0, 2.5, 3.0, 4.0], false, false, + #SaveData.UI_SCALE_MIN, SaveData.UI_SCALE_MAX) + #add_advice(Translator.translate( + #"Changes the scale of the visual user interface.")) + #current_setup_setting = "auto_ui_scale" + #add_checkbox(Translator.translate("Auto UI scale")) + #add_advice(Translator.translate( + #"Scales the user interface based on the screen size.")) # Disable mouse wrap if not available. if not DisplayServer.has_feature(DisplayServer.FEATURE_MOUSE_WARP): @@ -573,19 +576,19 @@ func show_formatter(category: String) -> void: add_checkbox(Translator.translate("Remove unnecessary parameters")) -func show_shortcuts(category: String) -> void: - var shortcuts_container := content_container.get_child(-1).get_child(-1) - for child in shortcuts_container.get_children(): - child.queue_free() - - for action in ShortcutUtils.get_shortcuts(category): - var shortcut_config := ShortcutConfigWidget.instantiate() if\ - ShortcutUtils.is_shortcut_modifiable(action) else\ - ShortcutShowcaseWidget.instantiate() - - shortcuts_container.add_child(shortcut_config) - shortcut_config.label.text = TranslationUtils.get_shortcut_description(action) - shortcut_config.setup(action) +#func show_shortcuts(category: String) -> void: + #var shortcuts_container := content_container.get_child(-1).get_child(-1) + #for child in shortcuts_container.get_children(): + #child.queue_free() + # + #for action in ShortcutUtils.get_shortcuts(category): + #var shortcut_config := ShortcutConfigWidget.instantiate() if\ + #ShortcutUtils.is_shortcut_modifiable(action) else\ + #ShortcutShowcaseWidget.instantiate() + # + #shortcuts_container.add_child(shortcut_config) + #shortcut_config.label.text = TranslationUtils.get_shortcut_description(action) + #shortcut_config.setup(action) func create_setting_container() -> void: setting_container = VBoxContainer.new() diff --git a/src/ui_parts/settings_menu.tscn b/src/ui_parts/settings_menu.tscn index 387c35c..94d5ec7 100644 --- a/src/ui_parts/settings_menu.tscn +++ b/src/ui_parts/settings_menu.tscn @@ -1,19 +1,12 @@ [gd_scene load_steps=3 format=3 uid="uid://1rylg17uwltw"] -[ext_resource type="Script" path="res://src/ui_parts/settings_menu.gd" id="1_1gf4m"] +[ext_resource type="Script" uid="uid://1rjr3yrqwueu" path="res://src/ui_parts/settings_menu.gd" id="1_1gf4m"] [ext_resource type="Texture2D" uid="uid://c528knojuxbw6" path="res://assets/icons/Languages.svg" id="2_ndyp7"] [node name="SettingsMenu" type="PanelContainer"] -custom_minimum_size = Vector2(640, 400) -anchors_preset = 8 -anchor_left = 0.5 -anchor_top = 0.5 -anchor_right = 0.5 -anchor_bottom = 0.5 -offset_left = -180.0 -offset_top = -128.0 -offset_right = 180.0 -offset_bottom = 128.0 +anchors_preset = 15 +anchor_right = 1.0 +anchor_bottom = 1.0 grow_horizontal = 2 grow_vertical = 2 theme_type_variation = &"OverlayPanel" @@ -30,29 +23,29 @@ focus_mode = 0 mouse_default_cursor_shape = 2 icon = ExtResource("2_ndyp7") -[node name="HBoxContainer" type="HBoxContainer" parent="VBoxContainer"] +[node name="VBoxContainer" type="VBoxContainer" parent="VBoxContainer"] layout_mode = 2 size_flags_vertical = 3 theme_override_constants/separation = 0 -[node name="ContentPicker" type="PanelContainer" parent="VBoxContainer/HBoxContainer"] -custom_minimum_size = Vector2(160, 0) +[node name="ContentPicker" type="PanelContainer" parent="VBoxContainer/VBoxContainer"] +custom_minimum_size = Vector2(0, 100) layout_mode = 2 theme_type_variation = &"SideTabBar" -[node name="Tabs" type="VBoxContainer" parent="VBoxContainer/HBoxContainer/ContentPicker"] +[node name="Tabs" type="VBoxContainer" parent="VBoxContainer/VBoxContainer/ContentPicker"] unique_name_in_owner = true layout_mode = 2 size_flags_horizontal = 3 theme_override_constants/separation = 0 -[node name="PanelContainer" type="PanelContainer" parent="VBoxContainer/HBoxContainer"] +[node name="PanelContainer" type="PanelContainer" parent="VBoxContainer/VBoxContainer"] layout_mode = 2 -size_flags_horizontal = 3 +size_flags_vertical = 3 mouse_filter = 1 theme_type_variation = &"SideBarContent" -[node name="ContentContainer" type="ScrollContainer" parent="VBoxContainer/HBoxContainer/PanelContainer"] +[node name="ContentContainer" type="ScrollContainer" parent="VBoxContainer/VBoxContainer/PanelContainer"] unique_name_in_owner = true custom_minimum_size = Vector2(0, 120) layout_mode = 2 diff --git a/src/ui_widgets/setting_shortcut.tscn b/src/ui_widgets/setting_shortcut.tscn index 5fbc119..9b06e24 100644 --- a/src/ui_widgets/setting_shortcut.tscn +++ b/src/ui_widgets/setting_shortcut.tscn @@ -1,6 +1,6 @@ [gd_scene load_steps=3 format=3 uid="uid://b7fw7bodu5fbb"] -[ext_resource type="Script" path="res://src/ui_widgets/setting_shortcut.gd" id="1_4c8oc"] +[ext_resource type="Script" uid="uid://ds386q8jgqkr2" path="res://src/ui_widgets/setting_shortcut.gd" id="1_4c8oc"] [ext_resource type="Texture2D" uid="uid://cvh3kwbucf2n1" path="res://assets/icons/Reload.svg" id="2_n8e0s"] [node name="SettingShortcut" type="PanelContainer"]