ItemList - highlight selected items && draw cursor last

This commit is contained in:
havi05 2024-11-11 19:38:46 +01:00
parent 863a24ac86
commit b05111799b
5 changed files with 51 additions and 12 deletions

View File

@ -484,11 +484,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.
@ -527,6 +530,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>

View File

@ -1058,6 +1058,10 @@ 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);
@ -1065,6 +1069,8 @@ void EditorThemeManager::_populate_standard_styles(const Ref<EditorTheme> &p_the
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);

View File

@ -1166,6 +1166,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;
@ -1182,11 +1184,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;
@ -1197,6 +1200,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);
}
@ -1294,7 +1304,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;
@ -1366,16 +1378,18 @@ void ItemList::_notification(int p_what) {
}
if (i == current && (select_mode == SELECT_MULTI || select_mode == SELECT_TOGGLE)) {
Rect2 r = rcache;
r.position += base_ofs;
if (rtl) {
r.position.x = size.width - r.position.x - r.size.x;
}
draw_style_box(cursor, r);
cursor_rcache = rcache;
}
}
if (cursor_rcache.size != Size2()) { // Draw cursor last, so border isn't cut off.
cursor_rcache.position += base_ofs;
if (rtl) {
cursor_rcache.position.x = size.width - cursor_rcache.position.x - cursor_rcache.size.x;
}
draw_style_box(cursor, cursor_rcache);
}
} break;
}
}
@ -1966,6 +1980,7 @@ 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);
@ -1973,6 +1988,8 @@ void ItemList::_bind_methods() {
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");

View File

@ -146,6 +146,7 @@ private:
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;
@ -153,6 +154,8 @@ private:
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;

View File

@ -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);
@ -929,10 +930,13 @@ void fill_default_theme(Ref<Theme> &theme, const Ref<Font> &default_font, const
theme->set_color(SceneStringName(font_color), "ItemList", control_font_lower_color);
theme->set_color("font_hovered_color", "ItemList", control_font_hover_color);
theme->set_color("font_hovered_selected_color", "ItemList", control_font_pressed_color);
theme->set_color("font_selected_color", "ItemList", control_font_pressed_color);
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);