Skip to content

Commit

Permalink
Update FoldableContainer
Browse files Browse the repository at this point in the history
  • Loading branch information
@WhalesState
WhalesState committed Jan 6, 2025
1 parent 7eacb15 commit b4f1368
Show file tree
Hide file tree
Showing 8 changed files with 823 additions and 95 deletions.
241 changes: 240 additions & 1 deletion doc/classes/FoldableContainer.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,193 @@
A container that can be expanded/collapsed.
</brief_description>
<description>
A container that can be expanded/collapsed.
A container that can be expanded/collapsed, with a title that can contain buttons.
The title can be positioned at the top or bottom of the container.
The container can be expanded or collapsed by clicking the title.
Buttons can be added with [method add_button].
Buttons can be toggled by setting the [code]toggle_mode[/code] property to [code]true[/code].
Buttons can be hidden or disabled with [method set_button_hidden] and [method set_button_disabled].
Buttons can have metadata associated with them, which can be retrieved with [method get_button_metadata] and set with [method set_button_metadata].
Buttons can have tooltips associated with them, which can be retrieved with [method get_button_tooltip] and set with [method set_button_tooltip].
Buttons can have an ID associated with them, which can be retrieved with [method get_button_id] and set with [method set_button_id].
Buttons only support icons not text, and it can be retrieved with [method get_button_icon] and changed with [method set_button_icon].
Buttons can be retrieved by their position with [method get_button_at_position] and by their ID with [method get_button_position].
</description>
<tutorials>
</tutorials>
<methods>
<method name="add_button">
<return type="void" />
<param index="0" name="icon" type="Texture2D" />
<param index="1" name="position" type="int" default="-1" />
<param index="2" name="id" type="int" default="-1" />
<description>
Adds a button to the title.
</description>
</method>
<method name="get_button_at_position" qualifiers="const">
<return type="int" />
<param index="0" name="position" type="Vector2" />
<description>
Returns the button's ID at the given position.
</description>
</method>
<method name="get_button_count" qualifiers="const">
<return type="int" />
<description>
Returns the total number of buttons.
</description>
</method>
<method name="get_button_icon" qualifiers="const">
<return type="Texture2D" />
<param index="0" name="index" type="int" />
<description>
Returns the icon of the button at the given index.
</description>
</method>
<method name="get_button_id" qualifiers="const">
<return type="int" />
<param index="0" name="index" type="int" />
<description>
Returns the ID of the button at the given index.
</description>
</method>
<method name="get_button_metadata" qualifiers="const">
<return type="Variant" />
<param index="0" name="index" type="int" />
<description>
Returns the metadata for the button at the given index.
</description>
</method>
<method name="get_button_position" qualifiers="const">
<return type="int" />
<param index="0" name="id" type="int" />
<description>
Returns the position of the button with the given ID.
</description>
</method>
<method name="get_button_rect" qualifiers="const">
<return type="Rect2" />
<param index="0" name="index" type="int" />
<description>
Returns the Rect2 which represents the position and size of the button.
</description>
</method>
<method name="get_button_toggle_mode" qualifiers="const">
<return type="int" />
<param index="0" name="index" type="int" />
<description>
Returns whether the button at the given index is a toggle button.
</description>
</method>
<method name="get_button_tooltip" qualifiers="const">
<return type="String" />
<param index="0" name="index" type="int" />
<description>
Returns the tooltip for the button at the given index.
</description>
</method>
<method name="is_button_disabled" qualifiers="const">
<return type="bool" />
<param index="0" name="index" type="int" />
<description>
Returns whether the button at the given index is disabled.
</description>
</method>
<method name="is_button_hidden" qualifiers="const">
<return type="bool" />
<param index="0" name="index" type="int" />
<description>
Returns whether the button at the given index is hidden.
</description>
</method>
<method name="is_button_toggled" qualifiers="const">
<return type="bool" />
<param index="0" name="index" type="int" />
<description>
Returns whether the button at the given index is toggled on/off.
</description>
</method>
<method name="remove_button">
<return type="void" />
<param index="0" name="index" type="int" />
<description>
Removes the button at the given index.
</description>
</method>
<method name="set_button_disabled">
<return type="void" />
<param index="0" name="index" type="int" />
<param index="1" name="disabled" type="bool" />
<description>
Disables the button at the given index.
</description>
</method>
<method name="set_button_hidden">
<return type="void" />
<param index="0" name="index" type="int" />
<param index="1" name="hidden" type="bool" />
<description>
Toggles the visibility of the button at the given index.
</description>
</method>
<method name="set_button_icon">
<return type="void" />
<param index="0" name="index" type="int" />
<param index="1" name="icon" type="Texture2D" />
<description>
Changes the icon of the button at the given index.
</description>
</method>
<method name="set_button_id">
<return type="void" />
<param index="0" name="index" type="int" />
<param index="1" name="id" type="int" />
<description>
Changes the ID of the button at the given index.
</description>
</method>
<method name="set_button_metadata">
<return type="void" />
<param index="0" name="index" type="int" />
<param index="1" name="metadata" type="Variant" />
<description>
Set the metadata for the button at the given index.
</description>
</method>
<method name="set_button_position">
<return type="int" />
<param index="0" name="index" type="int" />
<param index="1" name="position" type="int" />
<description>
Changes the button's position ie. index.
</description>
</method>
<method name="set_button_toggle_mode">
<return type="void" />
<param index="0" name="index" type="int" />
<param index="1" name="enabled" type="bool" />
<description>
Set the button at the given index to be a toggle button.
</description>
</method>
<method name="set_button_toggled">
<return type="void" />
<param index="0" name="index" type="int" />
<param index="1" name="toggled_on" type="bool" />
<description>
Set the button at the given index as toggled on/off.
</description>
</method>
<method name="set_button_tooltip">
<return type="void" />
<param index="0" name="index" type="int" />
<param index="1" name="tooltip" type="String" />
<description>
Sets the tooltip for the button at the given index.
</description>
</method>
</methods>
<members>
<member name="expanded" type="bool" setter="set_expanded" getter="is_expanded" default="true">
If [code]false[/code], the container will becomes folded and will hide all it's children.
Expand All @@ -20,22 +203,63 @@
<member name="text_direction" type="int" setter="set_text_direction" getter="get_text_direction" enum="Control.TextDirection" default="3">
Base text writing direction.
</member>
<member name="text_overrun_behavior" type="int" setter="set_text_overrun_behavior" getter="get_text_overrun_behavior" enum="TextServer.OverrunBehavior" default="3">
Defines the behavior of the [FoldableContainer] when the text is longer than the available space.
</member>
<member name="title" type="String" setter="set_title" getter="get_title" default="&quot;&quot;">
The Container's title text.
</member>
<member name="title_alignment" type="int" setter="set_title_alignment" getter="get_title_alignment" enum="HorizontalAlignment" default="0">
Title's text horizontal alignment as defined in the [enum HorizontalAlignment] enum.
</member>
<member name="title_position" type="int" setter="set_title_position" getter="get_title_position" enum="FoldableContainer.TitlePosition" default="0">
Title's position as defined in the [enum TitlePosition] enum.
</member>
</members>
<signals>
<signal name="button_pressed">
<param index="0" name="id" type="int" />
<param index="1" name="index" type="int" />
<description>
Emitted when a button is pressed.
</description>
</signal>
<signal name="button_toggled">
<param index="0" name="toggled_on" type="bool" />
<param index="1" name="id" type="int" />
<param index="2" name="index" type="int" />
<description>
Emitted when a button is toggled.
</description>
</signal>
<signal name="folding_changed">
<param index="0" name="is_folded" type="bool" />
<description>
Emitted when the container is expanded/collapsed.
</description>
</signal>
</signals>
<constants>
<constant name="POSITION_TOP" value="0" enum="TitlePosition">
Make the title appear at the top of the container.
</constant>
<constant name="POSITION_BOTTOM" value="1" enum="TitlePosition">
Make the title appear at the bottom of the container.
</constant>
</constants>
<theme_items>
<theme_item name="button_icon_disabled" data_type="color" type="Color" default="Color(0.875, 0.875, 0.875, 0.5)">
The title's icon color when disabled.
</theme_item>
<theme_item name="button_icon_hovered" data_type="color" type="Color" default="Color(0.95, 0.95, 0.95, 1)">
The title's icon color when hovered.
</theme_item>
<theme_item name="button_icon_normal" data_type="color" type="Color" default="Color(0.875, 0.875, 0.875, 1)">
The title's icon color when normal.
</theme_item>
<theme_item name="button_icon_pressed" data_type="color" type="Color" default="Color(1, 1, 1, 1)">
The title's icon color when pressed.
</theme_item>
<theme_item name="collapsed_font_color" data_type="color" type="Color" default="Color(1, 1, 1, 1)">
The title's font color when collapsed.
</theme_item>
Expand Down Expand Up @@ -69,6 +293,21 @@
<theme_item name="arrow_collapsed_mirrored" data_type="icon" type="Texture2D">
The title's icon used when collapsed (for right-to-left layouts).
</theme_item>
<theme_item name="arrow_mirrored" data_type="icon" type="Texture2D">
The title's icon used when expanded (for bottom title).
</theme_item>
<theme_item name="button_disabled_style" data_type="style" type="StyleBox">
The title's button disabled style.
</theme_item>
<theme_item name="button_hovered_style" data_type="style" type="StyleBox">
The title's button hover style.
</theme_item>
<theme_item name="button_normal_style" data_type="style" type="StyleBox">
The title's button normal style.
</theme_item>
<theme_item name="button_pressed_style" data_type="style" type="StyleBox">
The title's button pressed style.
</theme_item>
<theme_item name="focus" data_type="style" type="StyleBox">
Background used when [FoldableContainer] has GUI focus. The [theme_item focus] [StyleBox] is displayed [i]over[/i] the base [StyleBox], so a partially transparent [StyleBox] should be used to ensure the base [StyleBox] remains visible. A [StyleBox] that represents an outline or an underline works well for this purpose. To disable the focus visual effect, assign a [StyleBoxEmpty] resource. Note that disabling the focus visual effect will harm keyboard/controller navigation usability, so this is not recommended for accessibility reasons.
</theme_item>
Expand Down
2 changes: 1 addition & 1 deletion editor/icons/ArrowUp.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions editor/icons/GuiArrowUp.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
19 changes: 14 additions & 5 deletions editor/themes/editor_theme_manager.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1259,21 +1259,25 @@ void EditorThemeManager::_populate_standard_styles(const Ref<EditorTheme> &p_the

// FoldableContainer

Ref<StyleBoxFlat> foldable_container_title = make_flat_stylebox(p_config.dark_color_1.darkened(0.125), 4, 4, 4, 4);
Ref<StyleBoxFlat> foldable_container_title = make_flat_stylebox(p_config.dark_color_1.darkened(0.125), p_config.base_margin, p_config.base_margin, p_config.base_margin, p_config.base_margin);
foldable_container_title->set_corner_radius(CORNER_BOTTOM_LEFT, 0);
foldable_container_title->set_corner_radius(CORNER_BOTTOM_RIGHT, 0);
p_theme->set_stylebox("title_panel", "FoldableContainer", foldable_container_title);
Ref<StyleBoxFlat> foldable_container_hover = make_flat_stylebox(p_config.dark_color_1.lerp(p_config.base_color, 0.4), 4, 4, 4, 4);
Ref<StyleBoxFlat> foldable_container_hover = make_flat_stylebox(p_config.dark_color_1.lerp(p_config.base_color, 0.4), p_config.base_margin, p_config.base_margin, p_config.base_margin, p_config.base_margin);
foldable_container_hover->set_corner_radius(CORNER_BOTTOM_LEFT, 0);
foldable_container_hover->set_corner_radius(CORNER_BOTTOM_RIGHT, 0);
p_theme->set_stylebox("title_hover_panel", "FoldableContainer", foldable_container_hover);
p_theme->set_stylebox("title_collapsed_panel", "FoldableContainer", make_flat_stylebox(p_config.dark_color_1.darkened(0.125), 4, 4, 4, 4));
p_theme->set_stylebox("title_collapsed_hover_panel", "FoldableContainer", make_flat_stylebox(p_config.dark_color_1.lerp(p_config.base_color, 0.4), 4, 4, 4, 4));
Ref<StyleBoxFlat> foldable_container_panel = make_flat_stylebox(p_config.dark_color_1, 18, 4, 4, 4);
p_theme->set_stylebox("title_collapsed_panel", "FoldableContainer", make_flat_stylebox(p_config.dark_color_1.darkened(0.125), p_config.base_margin, p_config.base_margin, p_config.base_margin, p_config.base_margin));
p_theme->set_stylebox("title_collapsed_hover_panel", "FoldableContainer", make_flat_stylebox(p_config.dark_color_1.lerp(p_config.base_color, 0.4), p_config.base_margin, p_config.base_margin, p_config.base_margin, p_config.base_margin));
Ref<StyleBoxFlat> foldable_container_panel = make_flat_stylebox(p_config.dark_color_1, p_config.forced_even_separation, p_config.base_margin, p_config.base_margin, p_config.base_margin);
foldable_container_panel->set_corner_radius(CORNER_TOP_LEFT, 0);
foldable_container_panel->set_corner_radius(CORNER_TOP_RIGHT, 0);
p_theme->set_stylebox(SceneStringName(panel), "FoldableContainer", foldable_container_panel);
p_theme->set_stylebox("focus", "FoldableContainer", p_config.button_style_focus);
p_theme->set_stylebox("button_normal_style", "FoldableContainer", make_flat_stylebox(p_config.dark_color_1.lerp(p_config.base_color, 0.4), p_config.base_margin, p_config.base_margin, p_config.base_margin, p_config.base_margin));
p_theme->set_stylebox("button_hovered_style", "FoldableContainer", make_flat_stylebox(p_config.dark_color_1.darkened(0.125), p_config.base_margin, p_config.base_margin, p_config.base_margin, p_config.base_margin));
p_theme->set_stylebox("button_pressed_style", "FoldableContainer", make_flat_stylebox(p_config.dark_color_1.darkened(0.125), p_config.base_margin, p_config.base_margin, p_config.base_margin, p_config.base_margin));
p_theme->set_stylebox("button_disabled_style", "FoldableContainer", make_empty_stylebox(p_config.base_margin, p_config.base_margin, p_config.base_margin, p_config.base_margin));

p_theme->set_font(SceneStringName(font), "FoldableContainer", p_theme->get_font(SceneStringName(font), SNAME("HeaderSmall")));
p_theme->set_font_size(SceneStringName(font_size), "FoldableContainer", p_theme->get_font_size(SceneStringName(font_size), SNAME("HeaderSmall")));
Expand All @@ -1282,8 +1286,13 @@ void EditorThemeManager::_populate_standard_styles(const Ref<EditorTheme> &p_the
p_theme->set_color("hover_font_color", "FoldableContainer", p_config.font_hover_color);
p_theme->set_color("collapsed_font_color", "FoldableContainer", p_config.font_pressed_color);
p_theme->set_color("font_outline_color", "FoldableContainer", Color(1, 1, 1));
p_theme->set_color("button_icon_normal", "FoldableContainer", p_config.font_color);
p_theme->set_color("button_icon_hovered", "FoldableContainer", p_config.font_hover_color);
p_theme->set_color("button_icon_pressed", "FoldableContainer", p_config.font_pressed_color);
p_theme->set_color("button_icon_disabled", "FoldableContainer", p_config.font_disabled_color);

p_theme->set_icon("arrow", "FoldableContainer", p_theme->get_icon(SNAME("GuiTreeArrowDown"), EditorStringName(EditorIcons)));
p_theme->set_icon("arrow_mirrored", "FoldableContainer", p_theme->get_icon(SNAME("GuiArrowUp"), EditorStringName(EditorIcons)));
p_theme->set_icon("arrow_collapsed", "FoldableContainer", p_theme->get_icon(SNAME("GuiTreeArrowRight"), EditorStringName(EditorIcons)));
p_theme->set_icon("arrow_collapsed_mirrored", "FoldableContainer", p_theme->get_icon(SNAME("GuiTreeArrowLeft"), EditorStringName(EditorIcons)));

Expand Down
Loading

0 comments on commit b4f1368

Please sign in to comment.