asgardius/virtualx-engine
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Implement disabled state for Checkbox in Tree

Browse source
This commit is contained in:
Stanislav Labzyuk 2023-11-13 14:38:56 +01:00
parent 59457685c1
commit ff8797e980
8 changed files with 55 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
doc/classes/Tree.xml
View file

@ -506,6 +506,9 @@
<theme_item name="font_color" data_type="color" type="Color" default="Color(0.7, 0.7, 0.7, 1)">
Default text [Color] of the item.
</theme_item>
<theme_item name="font_disabled_color" data_type="color" type="Color" default="Color(0.875, 0.875, 0.875, 0.5)">
Text [Color] for a [constant TreeItem.CELL_MODE_CHECK] mode cell when it's non-editable (see [method TreeItem.set_editable]).
</theme_item>
<theme_item name="font_outline_color" data_type="color" type="Color" default="Color(1, 1, 1, 1)">
The tint of text outline of the item.
</theme_item>
@ -619,16 +622,25 @@
The arrow icon used when a foldable item is collapsed (for right-to-left layouts).
</theme_item>
<theme_item name="checked" data_type="icon" type="Texture2D">
The check icon to display when the [constant TreeItem.CELL_MODE_CHECK] mode cell is checked.
The check icon to display when the [constant TreeItem.CELL_MODE_CHECK] mode cell is checked and editable (see [method TreeItem.set_editable]).
</theme_item>
<theme_item name="checked_disabled" data_type="icon" type="Texture2D">
The check icon to display when the [constant TreeItem.CELL_MODE_CHECK] mode cell is checked and non-editable (see [method TreeItem.set_editable]).
</theme_item>
<theme_item name="indeterminate" data_type="icon" type="Texture2D">
The check icon to display when the [constant TreeItem.CELL_MODE_CHECK] mode cell is indeterminate.
The check icon to display when the [constant TreeItem.CELL_MODE_CHECK] mode cell is indeterminate and editable (see [method TreeItem.set_editable]).
</theme_item>
<theme_item name="indeterminate_disabled" data_type="icon" type="Texture2D">
The check icon to display when the [constant TreeItem.CELL_MODE_CHECK] mode cell is indeterminate and non-editable (see [method TreeItem.set_editable]).
</theme_item>
<theme_item name="select_arrow" data_type="icon" type="Texture2D">
The arrow icon to display for the [constant TreeItem.CELL_MODE_RANGE] mode cell.
</theme_item>
<theme_item name="unchecked" data_type="icon" type="Texture2D">
The check icon to display when the [constant TreeItem.CELL_MODE_CHECK] mode cell is unchecked.
The check icon to display when the [constant TreeItem.CELL_MODE_CHECK] mode cell is unchecked and editable (see [method TreeItem.set_editable]).
</theme_item>
<theme_item name="unchecked_disabled" data_type="icon" type="Texture2D">
The check icon to display when the [constant TreeItem.CELL_MODE_CHECK] mode cell is unchecked and non-editable (see [method TreeItem.set_editable]).
</theme_item>
<theme_item name="updown" data_type="icon" type="Texture2D">
The updown arrow icon to display for the [constant TreeItem.CELL_MODE_RANGE] mode cell.

4
editor/editor_themes.cpp
View file

@ -1421,8 +1421,11 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
// Tree
theme->set_icon("checked", "Tree", theme->get_icon(SNAME("GuiChecked"), EditorStringName(EditorIcons)));
theme->set_icon("checked_disabled", "Tree", theme->get_icon(SNAME("GuiCheckedDisabled"), EditorStringName(EditorIcons)));
theme->set_icon("indeterminate", "Tree", theme->get_icon(SNAME("GuiIndeterminate"), EditorStringName(EditorIcons)));
theme->set_icon("indeterminate_disabled", "Tree", theme->get_icon(SNAME("GuiIndeterminateDisabled"), EditorStringName(EditorIcons)));
theme->set_icon("unchecked", "Tree", theme->get_icon(SNAME("GuiUnchecked"), EditorStringName(EditorIcons)));
theme->set_icon("unchecked_disabled", "Tree", theme->get_icon(SNAME("GuiUncheckedDisabled"), EditorStringName(EditorIcons)));
theme->set_icon("arrow", "Tree", theme->get_icon(SNAME("GuiTreeArrowDown"), EditorStringName(EditorIcons)));
theme->set_icon("arrow_collapsed", "Tree", theme->get_icon(SNAME("GuiTreeArrowRight"), EditorStringName(EditorIcons)));
theme->set_icon("arrow_collapsed_mirrored", "Tree", theme->get_icon(SNAME("GuiTreeArrowLeft"), EditorStringName(EditorIcons)));
@ -1435,6 +1438,7 @@ Ref<Theme> create_editor_theme(const Ref<Theme> p_theme) {
theme->set_color("custom_button_font_highlight", "Tree", font_hover_color);
theme->set_color("font_color", "Tree", font_color);
theme->set_color("font_selected_color", "Tree", mono_color);
theme->set_color("font_disabled_color", "Tree", font_disabled_color);
theme->set_color("font_outline_color", "Tree", font_outline_color);
theme->set_color("title_button_color", "Tree", font_color);
theme->set_color("drop_position_color", "Tree", accent_color);

1
editor/icons/GuiIndeterminateDisabled.svg Normal file
View file

@ -0,0 +1 @@
<svg height="16" width="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><rect x="1" y="1" rx="2.33" height="14" width="14" fill="#808080"/><path d="M3 7h10v2H3z" fill="#b3b3b3"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 196 B

35
scene/gui/tree.cpp
View file

@ -2187,27 +2187,38 @@ int Tree::draw_item(const Point2i &p_pos, const Point2 &p_draw_ofs, const Size2
draw_item_rect(p_item->cells.write[i], item_rect, cell_color, icon_col, outline_size, font_outline_color);
} break;
case TreeItem::CELL_MODE_CHECK: {
Ref<Texture2D> checked = theme_cache.checked;
Ref<Texture2D> unchecked = theme_cache.unchecked;
Ref<Texture2D> indeterminate = theme_cache.indeterminate;
Point2i check_ofs = item_rect.position;
check_ofs.y += Math::floor((real_t)(item_rect.size.y - checked->get_height()) / 2);
check_ofs.y += Math::floor((real_t)(item_rect.size.y - theme_cache.checked->get_height()) / 2);
if (p_item->cells[i].indeterminate) {
indeterminate->draw(ci, check_ofs);
} else if (p_item->cells[i].checked) {
checked->draw(ci, check_ofs);
if (p_item->cells[i].editable) {
if (p_item->cells[i].indeterminate) {
theme_cache.indeterminate->draw(ci, check_ofs);
} else if (p_item->cells[i].checked) {
theme_cache.checked->draw(ci, check_ofs);
} else {
theme_cache.unchecked->draw(ci, check_ofs);
}
} else {
unchecked->draw(ci, check_ofs);
if (p_item->cells[i].indeterminate) {
theme_cache.indeterminate_disabled->draw(ci, check_ofs);
} else if (p_item->cells[i].checked) {
theme_cache.checked_disabled->draw(ci, check_ofs);
} else {
theme_cache.unchecked_disabled->draw(ci, check_ofs);
}
}
int check_w = checked->get_width() + theme_cache.h_separation;
int check_w = theme_cache.checked->get_width() + theme_cache.h_separation;
text_pos.x += check_w;
item_rect.size.x -= check_w;
item_rect.position.x += check_w;
if (!p_item->cells[i].editable) {
cell_color = theme_cache.font_disabled_color;
}
draw_item_rect(p_item->cells.write[i], item_rect, cell_color, icon_col, outline_size, font_outline_color);
} break;
@ -5525,7 +5536,10 @@ void Tree::_bind_methods() {
BIND_THEME_ITEM(Theme::DATA_TYPE_ICON, Tree, checked);
BIND_THEME_ITEM(Theme::DATA_TYPE_ICON, Tree, unchecked);
BIND_THEME_ITEM(Theme::DATA_TYPE_ICON, Tree, checked_disabled);
BIND_THEME_ITEM(Theme::DATA_TYPE_ICON, Tree, unchecked_disabled);
BIND_THEME_ITEM(Theme::DATA_TYPE_ICON, Tree, indeterminate);
BIND_THEME_ITEM(Theme::DATA_TYPE_ICON, Tree, indeterminate_disabled);
BIND_THEME_ITEM(Theme::DATA_TYPE_ICON, Tree, arrow);
BIND_THEME_ITEM(Theme::DATA_TYPE_ICON, Tree, arrow_collapsed);
BIND_THEME_ITEM(Theme::DATA_TYPE_ICON, Tree, arrow_collapsed_mirrored);
@ -5539,6 +5553,7 @@ void Tree::_bind_methods() {
BIND_THEME_ITEM(Theme::DATA_TYPE_COLOR, Tree, font_color);
BIND_THEME_ITEM(Theme::DATA_TYPE_COLOR, Tree, font_selected_color);
BIND_THEME_ITEM(Theme::DATA_TYPE_COLOR, Tree, font_disabled_color);
BIND_THEME_ITEM(Theme::DATA_TYPE_COLOR, Tree, drop_position_color);
BIND_THEME_ITEM(Theme::DATA_TYPE_CONSTANT, Tree, h_separation);
BIND_THEME_ITEM(Theme::DATA_TYPE_CONSTANT, Tree, v_separation);

4
scene/gui/tree.h
View file

@ -536,7 +536,10 @@ private:
Ref<Texture2D> checked;
Ref<Texture2D> unchecked;
Ref<Texture2D> checked_disabled;
Ref<Texture2D> unchecked_disabled;
Ref<Texture2D> indeterminate;
Ref<Texture2D> indeterminate_disabled;
Ref<Texture2D> arrow;
Ref<Texture2D> arrow_collapsed;
Ref<Texture2D> arrow_collapsed_mirrored;
@ -545,6 +548,7 @@ private:
Color font_color;
Color font_selected_color;
Color font_disabled_color;
Color guide_color;
Color drop_position_color;
Color relationship_line_color;

4
scene/theme/default_theme.cpp
View file

@ -773,8 +773,11 @@ void fill_default_theme(Ref<Theme> &theme, const Ref<Font> &default_font, const
theme->set_stylebox("custom_button_hover", "Tree", button_hover);
theme->set_icon("checked", "Tree", icons["checked"]);
theme->set_icon("checked_disabled", "Tree", icons["checked_disabled"]);
theme->set_icon("unchecked", "Tree", icons["unchecked"]);
theme->set_icon("unchecked_disabled", "Tree", icons["unchecked_disabled"]);
theme->set_icon("indeterminate", "Tree", icons["indeterminate"]);
theme->set_icon("indeterminate_disabled", "Tree", icons["indeterminate_disabled"]);
theme->set_icon("updown", "Tree", icons["updown"]);
theme->set_icon("select_arrow", "Tree", icons["option_button_arrow"]);
theme->set_icon("arrow", "Tree", icons["arrow_down"]);
@ -789,6 +792,7 @@ void fill_default_theme(Ref<Theme> &theme, const Ref<Font> &default_font, const
theme->set_color("title_button_color", "Tree", control_font_color);
theme->set_color("font_color", "Tree", control_font_low_color);
theme->set_color("font_selected_color", "Tree", control_font_pressed_color);
theme->set_color("font_disabled_color", "Tree", control_font_disabled_color);
theme->set_color("font_outline_color", "Tree", Color(1, 1, 1));
theme->set_color("guide_color", "Tree", Color(0.7, 0.7, 0.7, 0.25));
theme->set_color("drop_position_color", "Tree", Color(1, 1, 1));

2
scene/theme/icons/indeterminate.svg
View file

@ -1 +1 @@
<svg height="16" viewBox="0 0 16 15.999999" width="16" xmlns="http://www.w3.org/2000/svg"><path d="m3.3333333 1c-1.2887 0-2.3333333 1.0446683-2.3333333 2.3333333v9.3333337c0 1.2887 1.0446683 2.333333 2.3333333 2.333333h9.3333337c1.2887 0 2.333333-1.044668 2.333333-2.333333v-9.3333337c0-1.2887-1.044668-2.3333333-2.333333-2.3333333z" fill="#fff" fill-opacity=".75" stroke-width="1.16667"/><path d="m3 7h10v2h-10z" fill="#1a1a1a" stroke-linecap="square" stroke-opacity=".75" stroke-width="2"/></svg>
<svg height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg"><rect x="1" y="1" width="14" height="14" rx="2.333" fill="#fff" fill-opacity=".75"/><path d="m3 7h10v2h-10z" fill="#1a1a1a"/></svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 499 B

After

Width:  |  Height:  |  Size: 215 B

1
scene/theme/icons/indeterminate_disabled.svg Normal file
View file

@ -0,0 +1 @@
<svg height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg"><rect x="1" y="1" width="14" height="14" rx="2.333" fill="#fff" fill-opacity=".37"/><path d="m3 7h10v2h-10z" fill="#1a1a1a" fill-opacity=".5"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 233 B