Skip to content

Commit

Permalink
ItemList - highlight selected items && draw cursor last
Browse files Browse the repository at this point in the history
  • Loading branch information
@havi05
havi05 committed Dec 14, 2024
1 parent dc5f1b7 commit 352f907
Show file tree
Hide file tree
Showing 5 changed files with 49 additions and 11 deletions.
11 changes: 10 additions & 1 deletion doc/classes/ItemList.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -481,11 +481,14 @@
<theme_item name="font_hovered_color" data_type="color" type="Color" default="Color(0.95, 0.95, 0.95, 1)">
Text [Color] used when the item is hovered and not selected yet.
</theme_item>
<theme_item name="font_hovered_selected_color" data_type="color" type="Color" default="Color(1, 1, 1, 1)">
Text [Color] used when the item is hovered and selected.
</theme_item>
<theme_item name="font_outline_color" data_type="color" type="Color" default="Color(0, 0, 0, 1)">
The tint of text outline of the item.
</theme_item>
<theme_item name="font_selected_color" data_type="color" type="Color" default="Color(1, 1, 1, 1)">
Text [Color] used when the item is selected.
Text [Color] used when the item is selected, but not hovered.
</theme_item>
<theme_item name="guide_color" data_type="color" type="Color" default="Color(0.7, 0.7, 0.7, 0.25)">
[Color] of the guideline. The guideline is a line drawn between each row of items.
Expand Down Expand Up @@ -524,6 +527,12 @@
<theme_item name="hovered" data_type="style" type="StyleBox">
[StyleBox] for the hovered, but not selected items.
</theme_item>
<theme_item name="hovered_selected" data_type="style" type="StyleBox">
[StyleBox] for the hovered and selected items, used when the [ItemList] is not being focused.
</theme_item>
<theme_item name="hovered_selected_focus" data_type="style" type="StyleBox">
[StyleBox] for the hovered and selected items, used when the [ItemList] is being focused.
</theme_item>
<theme_item name="panel" data_type="style" type="StyleBox">
The background style for the [ItemList].
</theme_item>
Expand Down
6 changes: 6 additions & 0 deletions editor/themes/editor_theme_manager.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1058,13 +1058,19 @@ void EditorThemeManager::_populate_standard_styles(const Ref<EditorTheme> &p_the
style_itemlist_hover->set_bg_color(p_config.highlight_color * Color(1, 1, 1, 0.3));
style_itemlist_hover->set_border_width_all(0);

Ref<StyleBoxFlat> style_itemlist_hover_selected = style_tree_selected->duplicate();
style_itemlist_hover_selected->set_bg_color(p_config.highlight_color * Color(1, 1, 1, 1.2));
style_itemlist_hover_selected->set_border_width_all(0);

p_theme->set_stylebox(SceneStringName(panel), "ItemList", style_itemlist_bg);
p_theme->set_stylebox("focus", "ItemList", p_config.button_style_focus);
p_theme->set_stylebox("cursor", "ItemList", style_itemlist_cursor);
p_theme->set_stylebox("cursor_unfocused", "ItemList", style_itemlist_cursor);
p_theme->set_stylebox("selected_focus", "ItemList", style_tree_focus);
p_theme->set_stylebox("selected", "ItemList", style_tree_selected);
p_theme->set_stylebox("hovered", "ItemList", style_itemlist_hover);
p_theme->set_stylebox("hovered_selected", "ItemList", style_itemlist_hover_selected);
p_theme->set_stylebox("hovered_selected_focus", "ItemList", style_itemlist_hover_selected);
p_theme->set_color(SceneStringName(font_color), "ItemList", p_config.font_color);
p_theme->set_color("font_hovered_color", "ItemList", p_config.mono_color);
p_theme->set_color("font_selected_color", "ItemList", p_config.mono_color);
Expand Down
37 changes: 27 additions & 10 deletions scene/gui/item_list.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1154,6 +1154,8 @@ void ItemList::_notification(int p_what) {
first_item_visible = lo;
}

Rect2 cursor_rcache; // Place to save the position of the cursor and draw it after everything else.

// Draw visible items.
for (int i = first_item_visible; i < items.size(); i++) {
Rect2 rcache = items[i].rect_cache;
Expand All @@ -1170,11 +1172,12 @@ void ItemList::_notification(int p_what) {
rcache.size.width = width - rcache.position.x;
}

bool should_draw_selected_bg = items[i].selected;
bool should_draw_selected_bg = items[i].selected && hovered != i;
bool should_draw_hovered_selected_bg = items[i].selected && hovered == i;
bool should_draw_hovered_bg = hovered == i && !items[i].selected;
bool should_draw_custom_bg = items[i].custom_bg.a > 0.001;

if (should_draw_selected_bg || should_draw_hovered_bg || should_draw_custom_bg) {
if (should_draw_selected_bg || should_draw_hovered_selected_bg || should_draw_hovered_bg || should_draw_custom_bg) {
Rect2 r = rcache;
r.position += base_ofs;

Expand All @@ -1185,6 +1188,13 @@ void ItemList::_notification(int p_what) {
if (should_draw_selected_bg) {
draw_style_box(sbsel, r);
}
if (should_draw_hovered_selected_bg) {
if (has_focus()) {
draw_style_box(theme_cache.hovered_selected_focus_style, r);
} else {
draw_style_box(theme_cache.hovered_selected_style, r);
}
}
if (should_draw_hovered_bg) {
draw_style_box(theme_cache.hovered_style, r);
}
Expand Down Expand Up @@ -1282,7 +1292,9 @@ void ItemList::_notification(int p_what) {
}

Color txt_modulate;
if (items[i].selected) {
if (items[i].selected && hovered == i) {
txt_modulate = theme_cache.font_hovered_selected_color;
} else if (items[i].selected) {
txt_modulate = theme_cache.font_selected_color;
} else if (hovered == i) {
txt_modulate = theme_cache.font_hovered_color;
Expand Down Expand Up @@ -1354,15 +1366,17 @@ void ItemList::_notification(int p_what) {
}

if (select_mode == SELECT_MULTI && i == current) {
Rect2 r = rcache;
r.position += base_ofs;

if (rtl) {
r.position.x = size.width - r.position.x - r.size.x;
}
cursor_rcache = rcache;
}
}
if (cursor_rcache.size != Size2()) { // Draw cursor last, so border isn't cut off.
cursor_rcache.position += base_ofs;

draw_style_box(cursor, r);
if (rtl) {
cursor_rcache.position.x = size.width - cursor_rcache.position.x - cursor_rcache.size.x;
}

draw_style_box(cursor, cursor_rcache);
}
} break;
}
Expand Down Expand Up @@ -1953,13 +1967,16 @@ void ItemList::_bind_methods() {
BIND_THEME_ITEM(Theme::DATA_TYPE_FONT_SIZE, ItemList, font_size);
BIND_THEME_ITEM(Theme::DATA_TYPE_COLOR, ItemList, font_color);
BIND_THEME_ITEM(Theme::DATA_TYPE_COLOR, ItemList, font_hovered_color);
BIND_THEME_ITEM(Theme::DATA_TYPE_COLOR, ItemList, font_hovered_selected_color);
BIND_THEME_ITEM(Theme::DATA_TYPE_COLOR, ItemList, font_selected_color);
BIND_THEME_ITEM_CUSTOM(Theme::DATA_TYPE_CONSTANT, ItemList, font_outline_size, "outline_size");
BIND_THEME_ITEM(Theme::DATA_TYPE_COLOR, ItemList, font_outline_color);

BIND_THEME_ITEM(Theme::DATA_TYPE_CONSTANT, ItemList, line_separation);
BIND_THEME_ITEM(Theme::DATA_TYPE_CONSTANT, ItemList, icon_margin);
BIND_THEME_ITEM_CUSTOM(Theme::DATA_TYPE_STYLEBOX, ItemList, hovered_style, "hovered");
BIND_THEME_ITEM_CUSTOM(Theme::DATA_TYPE_STYLEBOX, ItemList, hovered_selected_style, "hovered_selected");
BIND_THEME_ITEM_CUSTOM(Theme::DATA_TYPE_STYLEBOX, ItemList, hovered_selected_focus_style, "hovered_selected_focus");
BIND_THEME_ITEM_CUSTOM(Theme::DATA_TYPE_STYLEBOX, ItemList, selected_style, "selected");
BIND_THEME_ITEM_CUSTOM(Theme::DATA_TYPE_STYLEBOX, ItemList, selected_focus_style, "selected_focus");
BIND_THEME_ITEM_CUSTOM(Theme::DATA_TYPE_STYLEBOX, ItemList, cursor_style, "cursor_unfocused");
Expand Down
3 changes: 3 additions & 0 deletions scene/gui/item_list.h
View file
Original file line number Diff line number Diff line change
Expand Up @@ -145,13 +145,16 @@ class ItemList : public Control {
int font_size = 0;
Color font_color;
Color font_hovered_color;
Color font_hovered_selected_color;
Color font_selected_color;
int font_outline_size = 0;
Color font_outline_color;

int line_separation = 0;
int icon_margin = 0;
Ref<StyleBox> hovered_style;
Ref<StyleBox> hovered_selected_style;
Ref<StyleBox> hovered_selected_focus_style;
Ref<StyleBox> selected_style;
Ref<StyleBox> selected_focus_style;
Ref<StyleBox> cursor_style;
Expand Down
3 changes: 3 additions & 0 deletions scene/theme/default_theme.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -129,6 +129,7 @@ void fill_default_theme(Ref<Theme> &theme, const Ref<Font> &default_font, const
// StyleBox colors
const Color style_normal_color = Color(0.1, 0.1, 0.1, 0.6);
const Color style_hover_color = Color(0.225, 0.225, 0.225, 0.6);
const Color style_hover_selected_color = Color(1, 1, 1, 0.4);
const Color style_pressed_color = Color(0, 0, 0, 0.6);
const Color style_disabled_color = Color(0.1, 0.1, 0.1, 0.3);
const Color style_focus_color = Color(1, 1, 1, 0.75);
Expand Down Expand Up @@ -933,6 +934,8 @@ void fill_default_theme(Ref<Theme> &theme, const Ref<Font> &default_font, const
theme->set_color("font_outline_color", "ItemList", Color(0, 0, 0));
theme->set_color("guide_color", "ItemList", Color(0.7, 0.7, 0.7, 0.25));
theme->set_stylebox("hovered", "ItemList", make_flat_stylebox(Color(1, 1, 1, 0.07)));
theme->set_stylebox("hovered_selected", "ItemList", make_flat_stylebox(style_hover_selected_color));
theme->set_stylebox("hovered_selected_focus", "ItemList", make_flat_stylebox(style_hover_selected_color));
theme->set_stylebox("selected", "ItemList", make_flat_stylebox(style_selected_color));
theme->set_stylebox("selected_focus", "ItemList", make_flat_stylebox(style_selected_color));
theme->set_stylebox("cursor", "ItemList", focus);
Expand Down

0 comments on commit 352f907

Please sign in to comment.