Better highlighting in listers, panel margin color fix

This commit is contained in:
Allen Webster 2020-01-26 19:32:54 -08:00
parent 9dd79d5957
commit bff434be53
15 changed files with 74 additions and 50 deletions

View File

@ -104,7 +104,7 @@ make_color_table(Application_Links *app, Arena *arena){
function void function void
set_default_color_scheme(Application_Links *app){ set_default_color_scheme(Application_Links *app){
if (global_theme_arena.base_allocator == 0){ if (global_theme_arena.base_allocator == 0){
global_theme_arena = make_arena_system(); global_theme_arena = make_arena_system();
} }
Arena *arena = &global_theme_arena; Arena *arena = &global_theme_arena;
@ -120,9 +120,9 @@ set_default_color_scheme(Application_Links *app){
default_color_table.arrays[defcolor_margin] = make_colors(arena, 0xFF181818); default_color_table.arrays[defcolor_margin] = make_colors(arena, 0xFF181818);
default_color_table.arrays[defcolor_margin_hover] = make_colors(arena, 0xFF252525); default_color_table.arrays[defcolor_margin_hover] = make_colors(arena, 0xFF252525);
default_color_table.arrays[defcolor_margin_active] = make_colors(arena, 0xFF323232); default_color_table.arrays[defcolor_margin_active] = make_colors(arena, 0xFF323232);
default_color_table.arrays[defcolor_list_item] = make_colors(arena, 0xFF181818); default_color_table.arrays[defcolor_list_item] = make_colors(arena, 0xFF181818, 0xFF0C0C0C);
default_color_table.arrays[defcolor_list_item_hover] = make_colors(arena, 0xFF252525); default_color_table.arrays[defcolor_list_item_hover] = make_colors(arena, 0xFF252525, 0xFF0C0C0C);
default_color_table.arrays[defcolor_list_item_active] = make_colors(arena, 0xFF323232); default_color_table.arrays[defcolor_list_item_active] = make_colors(arena, 0xFF323232, 0xFF0C0C0C);
default_color_table.arrays[defcolor_cursor] = make_colors(arena, 0xFF00EE00, 0xFFEE7700); default_color_table.arrays[defcolor_cursor] = make_colors(arena, 0xFF00EE00, 0xFFEE7700);
default_color_table.arrays[defcolor_at_cursor] = make_colors(arena, 0xFF0C0C0C); default_color_table.arrays[defcolor_at_cursor] = make_colors(arena, 0xFF0C0C0C);
default_color_table.arrays[defcolor_highlight_cursor_line] = make_colors(arena, 0xFF1E1E1E); default_color_table.arrays[defcolor_highlight_cursor_line] = make_colors(arena, 0xFF1E1E1E);

View File

@ -12,21 +12,45 @@ draw_text_layout_default(Application_Links *app, Text_Layout_ID layout_id){
} }
function FColor function FColor
get_margin_color(i32 level){ get_item_margin_color(i32 level, i32 sub_id){
FColor margin = fcolor_zero(); FColor margin = fcolor_zero();
switch (level){ switch (level){
default: default:
case UIHighlight_None: case UIHighlight_None:
{ {
margin = fcolor_id(defcolor_list_item); margin = fcolor_id(defcolor_list_item, sub_id);
}break; }break;
case UIHighlight_Hover: case UIHighlight_Hover:
{ {
margin = fcolor_id(defcolor_list_item_hover); margin = fcolor_id(defcolor_list_item_hover, sub_id);
}break; }break;
case UIHighlight_Active: case UIHighlight_Active:
{ {
margin = fcolor_id(defcolor_list_item_active); margin = fcolor_id(defcolor_list_item_active, sub_id);
}break;
}
return(margin);
}
function FColor
get_item_margin_color(i32 level){
return(get_item_margin_color(level, 0));
}
function FColor
get_panel_margin_color(i32 level){
FColor margin = fcolor_zero();
switch (level){
default:
case UIHighlight_None:
{
margin = fcolor_id(defcolor_margin);
}break;
case UIHighlight_Hover:
{
margin = fcolor_id(defcolor_margin_hover);
}break;
case UIHighlight_Active:
{
margin = fcolor_id(defcolor_margin_active);
}break; }break;
} }
return(margin); return(margin);
@ -254,7 +278,7 @@ draw_background_and_margin(Application_Links *app, View_ID view, FColor margin,
function Rect_f32 function Rect_f32
draw_background_and_margin(Application_Links *app, View_ID view, b32 is_active_view){ draw_background_and_margin(Application_Links *app, View_ID view, b32 is_active_view){
FColor margin_color = get_margin_color(is_active_view?UIHighlight_Active:UIHighlight_None); FColor margin_color = get_panel_margin_color(is_active_view?UIHighlight_Active:UIHighlight_None);
return(draw_background_and_margin(app, view, margin_color, fcolor_id(defcolor_back))); return(draw_background_and_margin(app, view, margin_color, fcolor_id(defcolor_back)));
} }
@ -832,10 +856,10 @@ draw_button(Application_Links *app, Rect_f32 rect, Vec2_f32 mouse_p, Face_ID fac
hovered = true; hovered = true;
} }
FColor margin_color = get_margin_color(hovered?UIHighlight_Active:UIHighlight_None); UI_Highlight_Level highlight = hovered?UIHighlight_Active:UIHighlight_None;
draw_rectangle_fcolor(app, rect, 3.f, margin_color); draw_rectangle_fcolor(app, rect, 3.f, get_item_margin_color(highlight));
rect = rect_inner(rect, 3.f); rect = rect_inner(rect, 3.f);
draw_rectangle_fcolor(app, rect, 3.f, fcolor_id(defcolor_back)); draw_rectangle_fcolor(app, rect, 3.f, get_item_margin_color(highlight, 1));
Scratch_Block scratch(app); Scratch_Block scratch(app);
Fancy_String *fancy = push_fancy_string(scratch, 0, face, fcolor_id(defcolor_text_default), text); Fancy_String *fancy = push_fancy_string(scratch, 0, face, fcolor_id(defcolor_text_default), text);

View File

@ -266,8 +266,8 @@ lister_render(Application_Links *app, Frame_Info frame_info, View_ID view){
highlight = UIHighlight_Hover; highlight = UIHighlight_Hover;
} }
draw_rectangle_fcolor(app, item_rect, 6.f, get_margin_color(highlight)); draw_rectangle_fcolor(app, item_rect, 6.f, get_item_margin_color(highlight));
draw_rectangle_fcolor(app, item_inner, 6.f, fcolor_id(defcolor_back)); draw_rectangle_fcolor(app, item_inner, 6.f, get_item_margin_color(highlight, 1));
Fancy_Line line = {}; Fancy_Line line = {};
push_fancy_string(scratch, &line, fcolor_id(defcolor_text_default), node->string); push_fancy_string(scratch, &line, fcolor_id(defcolor_text_default), node->string);

View File

@ -672,7 +672,7 @@ log_graph_render(Application_Links *app, Frame_Info frame_info, View_ID view){
Rect_f32 view_rect = view_get_screen_rect(app, view); Rect_f32 view_rect = view_get_screen_rect(app, view);
Rect_f32 inner = rect_inner(view_rect, 3); Rect_f32 inner = rect_inner(view_rect, 3);
draw_rectangle_fcolor(app, view_rect, 0.f, draw_rectangle_fcolor(app, view_rect, 0.f,
get_margin_color(is_active_view?UIHighlight_Active:UIHighlight_None)); get_item_margin_color(is_active_view?UIHighlight_Active:UIHighlight_None));
draw_rectangle_fcolor(app, inner, 0.f, fcolor_id(defcolor_back)); draw_rectangle_fcolor(app, inner, 0.f, fcolor_id(defcolor_back));
Rect_f32 prev_clip = draw_set_clip(app, inner); Rect_f32 prev_clip = draw_set_clip(app, inner);

View File

@ -121,7 +121,7 @@ tutorial_render(Application_Links *app, Frame_Info frame_info, View_ID view_id){
View_ID active_view = get_active_view(app, Access_Always); View_ID active_view = get_active_view(app, Access_Always);
b32 is_active_view = (active_view == view_id); b32 is_active_view = (active_view == view_id);
FColor margin_color = get_margin_color(is_active_view?UIHighlight_Active:UIHighlight_None); FColor margin_color = get_panel_margin_color(is_active_view?UIHighlight_Active:UIHighlight_None);
Rect_f32 region = draw_background_and_margin(app, view_id, margin_color, margin_color); Rect_f32 region = draw_background_and_margin(app, view_id, margin_color, margin_color);
Rect_f32 prev_clip = draw_set_clip(app, region); Rect_f32 prev_clip = draw_set_clip(app, region);
@ -152,9 +152,9 @@ tutorial_render(Application_Links *app, Frame_Info frame_info, View_ID view_id){
Rect_f32_Pair pair = rect_split_left_right(footer, b_width); Rect_f32_Pair pair = rect_split_left_right(footer, b_width);
footer = pair.max; footer = pair.max;
footer.x0 += 10.f; footer.x0 += 10.f;
if (draw_button(app, pair.min, m_p, face, string_u8_litexpr("minimize"))){ if (draw_button(app, pair.min, m_p, face, string_u8_litexpr("minimize"))){
tutorial.hover_action = TutorialAction_Minimize; tutorial.hover_action = TutorialAction_Minimize;
} }
} }
{ {
@ -241,7 +241,7 @@ tutorial_run_loop(Application_Links *app){
case CoreCode_ClickActivateView: case CoreCode_ClickActivateView:
{ {
tutorial_maximize(app); tutorial_maximize(app);
tutorial_action(app, tutorial.hover_action); tutorial_action(app, tutorial.hover_action);
change_active_panel(app); change_active_panel(app);
}break; }break;

View File

@ -3,9 +3,9 @@ defcolor_back = 0xFF0C0C0C;
defcolor_margin = 0xFF181818; defcolor_margin = 0xFF181818;
defcolor_margin_hover = 0xFF252525; defcolor_margin_hover = 0xFF252525;
defcolor_margin_active = 0xFF323232; defcolor_margin_active = 0xFF323232;
defcolor_list_item = defcolor_margin; defcolor_list_item = {defcolor_margin, defcolor_back};
defcolor_list_item_hover = defcolor_margin_hover; defcolor_list_item_hover = {defcolor_margin_hover, defcolor_margin};
defcolor_list_item_active = defcolor_margin_active; defcolor_list_item_active = {defcolor_margin_active, defcolor_margin_active};
defcolor_cursor = {0xFF00EE00, 0xFFEE7700}; defcolor_cursor = {0xFF00EE00, 0xFFEE7700};
defcolor_at_cursor = defcolor_back; defcolor_at_cursor = defcolor_back;
defcolor_highlight_cursor_line = 0xFF1E1E1E; defcolor_highlight_cursor_line = 0xFF1E1E1E;

View File

@ -4,9 +4,9 @@ defcolor_back = 0xFF161616;
defcolor_margin = 0xFF262626; defcolor_margin = 0xFF262626;
defcolor_margin_hover = 0xFF333333; defcolor_margin_hover = 0xFF333333;
defcolor_margin_active = 0xFF404040; defcolor_margin_active = 0xFF404040;
defcolor_list_item = defcolor_margin; defcolor_list_item = {defcolor_margin, defcolor_back};
defcolor_list_item_hover = defcolor_margin_hover; defcolor_list_item_hover = {defcolor_margin_hover, defcolor_margin};
defcolor_list_item_active = defcolor_margin_active; defcolor_list_item_active = {defcolor_margin_active, defcolor_margin_active};
defcolor_cursor = {0xFF40FF40, 0xFFFF4040}; defcolor_cursor = {0xFF40FF40, 0xFFFF4040};
defcolor_at_cursor = defcolor_back; defcolor_at_cursor = defcolor_back;
defcolor_highlight_cursor_line = 0xFF121E12; defcolor_highlight_cursor_line = 0xFF121E12;

View File

@ -4,9 +4,9 @@ defcolor_back = 0xFFF0F0F0;
defcolor_margin = 0xFF9E9E9E; defcolor_margin = 0xFF9E9E9E;
defcolor_margin_hover = 0xFF7E7E7E; defcolor_margin_hover = 0xFF7E7E7E;
defcolor_margin_active = 0xFF5C5C5C; defcolor_margin_active = 0xFF5C5C5C;
defcolor_list_item = defcolor_margin; defcolor_list_item = {defcolor_margin, defcolor_back};
defcolor_list_item_hover = defcolor_margin_hover; defcolor_list_item_hover = {defcolor_margin_hover, defcolor_margin};
defcolor_list_item_active = defcolor_margin_active; defcolor_list_item_active = {defcolor_margin_active, defcolor_margin_active};
defcolor_cursor = {0xFF000000, 0xFF008080}; defcolor_cursor = {0xFF000000, 0xFF008080};
defcolor_at_cursor = 0xFFD6D6D6; defcolor_at_cursor = 0xFFD6D6D6;
defcolor_highlight_cursor_line = 0xFFB8B098; defcolor_highlight_cursor_line = 0xFFB8B098;

View File

@ -3,9 +3,9 @@ defcolor_back = 0xFF202020;
defcolor_margin = 0xFF383838; defcolor_margin = 0xFF383838;
defcolor_margin_hover = 0xFF404040; defcolor_margin_hover = 0xFF404040;
defcolor_margin_active = 0xFF484848; defcolor_margin_active = 0xFF484848;
defcolor_list_item = defcolor_margin; defcolor_list_item = {defcolor_margin, defcolor_back};
defcolor_list_item_hover = defcolor_margin_hover; defcolor_list_item_hover = {defcolor_margin_hover, defcolor_margin};
defcolor_list_item_active = defcolor_margin_active; defcolor_list_item_active = {defcolor_margin_active, defcolor_margin_active};
defcolor_cursor = {0xFFDDDDDD, 0xFFDD7777}; defcolor_cursor = {0xFFDDDDDD, 0xFFDD7777};
defcolor_at_cursor = defcolor_back; defcolor_at_cursor = defcolor_back;
defcolor_highlight_cursor_line = 0xFF383838; defcolor_highlight_cursor_line = 0xFF383838;

View File

@ -3,9 +3,9 @@ defcolor_back = 0xFF303030;
defcolor_margin = 0xFF383838; defcolor_margin = 0xFF383838;
defcolor_margin_hover = 0xFF404040; defcolor_margin_hover = 0xFF404040;
defcolor_margin_active = 0xFF484848; defcolor_margin_active = 0xFF484848;
defcolor_list_item = defcolor_margin; defcolor_list_item = {defcolor_margin, defcolor_back};
defcolor_list_item_hover = defcolor_margin_hover; defcolor_list_item_hover = {defcolor_margin_hover, defcolor_margin};
defcolor_list_item_active = defcolor_margin_active; defcolor_list_item_active = {defcolor_margin_active, defcolor_margin_active};
defcolor_cursor = {0xFFDDDDDD, 0xFFDDF0F0}; defcolor_cursor = {0xFFDDDDDD, 0xFFDDF0F0};
defcolor_at_cursor = defcolor_back; defcolor_at_cursor = defcolor_back;
defcolor_highlight_cursor_line = 0xFF383838; defcolor_highlight_cursor_line = 0xFF383838;

View File

@ -3,9 +3,9 @@ defcolor_back = 0xFFD6D6D6;
defcolor_margin = 0xFF9E9E9E; defcolor_margin = 0xFF9E9E9E;
defcolor_margin_hover = 0xFF7E7E7E; defcolor_margin_hover = 0xFF7E7E7E;
defcolor_margin_active = 0xFF5C5C5C; defcolor_margin_active = 0xFF5C5C5C;
defcolor_list_item = defcolor_margin; defcolor_list_item = {defcolor_margin, defcolor_back};
defcolor_list_item_hover = defcolor_margin_hover; defcolor_list_item_hover = {defcolor_margin_hover, defcolor_margin};
defcolor_list_item_active = defcolor_margin_active; defcolor_list_item_active = {defcolor_margin_active, defcolor_margin_active};
defcolor_cursor = {0xFF000000, 0xFF002020}; defcolor_cursor = {0xFF000000, 0xFF002020};
defcolor_at_cursor = defcolor_back; defcolor_at_cursor = defcolor_back;
defcolor_highlight_cursor_line = 0xFFBCBCBC; defcolor_highlight_cursor_line = 0xFFBCBCBC;

View File

@ -4,9 +4,9 @@ defcolor_back = 0xFF161616;
defcolor_margin = 0xFF606590; defcolor_margin = 0xFF606590;
defcolor_margin_hover = 0xFF606590; defcolor_margin_hover = 0xFF606590;
defcolor_margin_active = 0xFF9A99E7; defcolor_margin_active = 0xFF9A99E7;
defcolor_list_item = defcolor_margin; defcolor_list_item = {defcolor_margin, defcolor_back};
defcolor_list_item_hover = defcolor_margin_hover; defcolor_list_item_hover = {defcolor_margin_hover, defcolor_margin};
defcolor_list_item_active = defcolor_margin_active; defcolor_list_item_active = {defcolor_margin_active, defcolor_margin_active};
defcolor_cursor = {0xFFd96e26, 0xFFd9d926}; defcolor_cursor = {0xFFd96e26, 0xFFd9d926};
defcolor_at_cursor = defcolor_back; defcolor_at_cursor = defcolor_back;
defcolor_highlight_cursor_line = 0xFF002222; defcolor_highlight_cursor_line = 0xFF002222;

View File

@ -3,9 +3,9 @@ defcolor_back = 0xFFDFD5D0;
defcolor_margin = 0xFFC7C7C7; defcolor_margin = 0xFFC7C7C7;
defcolor_margin_hover = 0xFFBFBFBF; defcolor_margin_hover = 0xFFBFBFBF;
defcolor_margin_active = 0xFFB7B7B7; defcolor_margin_active = 0xFFB7B7B7;
defcolor_list_item = defcolor_margin; defcolor_list_item = {defcolor_margin, defcolor_back};
defcolor_list_item_hover = defcolor_margin_hover; defcolor_list_item_hover = {defcolor_margin_hover, defcolor_margin};
defcolor_list_item_active = defcolor_margin_active; defcolor_list_item_active = {defcolor_margin_active, defcolor_margin_active};
defcolor_cursor = {0xFF222222, 0xFF442244}; defcolor_cursor = {0xFF222222, 0xFF442244};
defcolor_at_cursor = defcolor_back; defcolor_at_cursor = defcolor_back;
defcolor_highlight_cursor_line = 0xFFC7C7C7; defcolor_highlight_cursor_line = 0xFFC7C7C7;

View File

@ -3,9 +3,9 @@ defcolor_back = 0xFF090D12;
defcolor_margin = 0xFF1A2634; defcolor_margin = 0xFF1A2634;
defcolor_margin_hover = 0xFF2D415B; defcolor_margin_hover = 0xFF2D415B;
defcolor_margin_active = 0xFF405D82; defcolor_margin_active = 0xFF405D82;
defcolor_list_item = defcolor_margin; defcolor_list_item = {defcolor_margin, defcolor_back};
defcolor_list_item_hover = defcolor_margin_hover; defcolor_list_item_hover = {defcolor_margin_hover, defcolor_margin};
defcolor_list_item_active = defcolor_margin_active; defcolor_list_item_active = {defcolor_margin_active, defcolor_margin_active};
defcolor_cursor = {0xFFEEE800, 0xFFEE00E8}; defcolor_cursor = {0xFFEEE800, 0xFFEE00E8};
defcolor_at_cursor = defcolor_back; defcolor_at_cursor = defcolor_back;
defcolor_highlight_cursor_line = 0xFF1A2634; defcolor_highlight_cursor_line = 0xFF1A2634;

View File

@ -4,9 +4,9 @@ defcolor_back = 0xFF242424;
defcolor_margin = 0xFF181818; defcolor_margin = 0xFF181818;
defcolor_margin_hover = 0xFF252525; defcolor_margin_hover = 0xFF252525;
defcolor_margin_active = 0xFF323232; defcolor_margin_active = 0xFF323232;
defcolor_list_item = defcolor_margin; defcolor_list_item = {defcolor_margin, defcolor_back};
defcolor_list_item_hover = defcolor_margin_hover; defcolor_list_item_hover = {defcolor_margin_hover, defcolor_margin};
defcolor_list_item_active = defcolor_margin_active; defcolor_list_item_active = {defcolor_margin_active, defcolor_margin_active};
defcolor_cursor = {0xFF656565, 0xFF654065}; defcolor_cursor = {0xFF656565, 0xFF654065};
defcolor_highlight = 0xFF636066; defcolor_highlight = 0xFF636066;
defcolor_mark = defcolor_cursor; defcolor_mark = defcolor_cursor;