hotkey button highlighting
This commit is contained in:
parent
992e8762ae
commit
0bfefe064f
@ -36,7 +36,7 @@ String StringFromButton(Button button)
|
||||
[Button_F22] = CompLit("F22"),
|
||||
[Button_F23] = CompLit("F23"),
|
||||
[Button_F24] = CompLit("F24"),
|
||||
[Button_GraveAccent] = CompLit("~"),
|
||||
[Button_GraveAccent] = CompLit("Tilde"),
|
||||
[Button_0] = CompLit("0"),
|
||||
[Button_1] = CompLit("1"),
|
||||
[Button_2] = CompLit("2"),
|
||||
@ -91,7 +91,7 @@ String StringFromButton(Button button)
|
||||
[Button_PageDown] = CompLit("PageDown"),
|
||||
[Button_Home] = CompLit("Home"),
|
||||
[Button_End] = CompLit("End"),
|
||||
[Button_ForwardSlash] = CompLit("ForwardSlash"),
|
||||
[Button_ForwardSlash] = CompLit("Slash"),
|
||||
[Button_Period] = CompLit("Period"),
|
||||
[Button_Comma] = CompLit("Comma"),
|
||||
[Button_Quote] = CompLit("Quote"),
|
||||
|
||||
@ -209,6 +209,11 @@ JobDef(PP_VisWorker, sig, job_id)
|
||||
PP_WidgetTheme theme = PP_GetWidgetTheme();
|
||||
PP_PushWidgetThemeStyles(theme);
|
||||
|
||||
UI_Push(ChildLayoutAxis, Axis_Y);
|
||||
UI_Push(Width, UI_GROW(1, 0));
|
||||
UI_Push(Height, UI_GROW(1, 0));
|
||||
UI_Push(Parent, UI_BuildColumnEx(UI_KeyF("AAH")));
|
||||
|
||||
//////////////////////////////
|
||||
//- Process controller events vis cmds
|
||||
|
||||
|
||||
@ -8,7 +8,7 @@ PP_WidgetTheme PP_GetWidgetTheme(void)
|
||||
theme.window_background_color = Rgb32(0xff1a1d1e);
|
||||
theme.window_border_color = Rgb32(0xff343a3b);
|
||||
theme.window_border = 1;
|
||||
theme.window_width = 1000;
|
||||
theme.window_width = 600;
|
||||
theme.window_padding = theme.window_border - 1;
|
||||
theme.divider_color = theme.window_border_color;
|
||||
|
||||
@ -167,26 +167,27 @@ void PP_EndCommandsWidget(PP_CommandsWidget *widget)
|
||||
|
||||
UI_Key btn_key = item->key;
|
||||
UI_Report btn_rep = UI_ReportFromKey(btn_key);
|
||||
|
||||
Vec4 btn_color = theme.window_background_color;
|
||||
Vec4 btn_border_color = ZI;
|
||||
{
|
||||
Vec4 hovered_color = Rgb32(0x103c4c);
|
||||
Vec4 pressed_color = hovered_color;
|
||||
pressed_color.w = 0.2;
|
||||
|
||||
f32 hot = btn_rep.hot;
|
||||
f32 active = btn_rep.active;
|
||||
f32 hovered = btn_rep.hovered;
|
||||
|
||||
Vec4 color = theme.window_background_color;
|
||||
Vec4 border_color = ZI;
|
||||
color = BlendSrgb(color, hovered_color, hot);
|
||||
color = BlendSrgb(color, pressed_color, active * hovered);
|
||||
border_color = BlendSrgb(border_color, Rgb32(0x0078a6), hot);
|
||||
f32 btn_hot = btn_rep.hot;
|
||||
f32 btn_active = btn_rep.active;
|
||||
f32 btn_hovered = btn_rep.hovered;
|
||||
btn_color = BlendSrgb(btn_color, hovered_color, btn_hot);
|
||||
btn_color = BlendSrgb(btn_color, pressed_color, btn_active * btn_hovered);
|
||||
btn_border_color = BlendSrgb(btn_border_color, Rgb32(0x0078a6), btn_hot);
|
||||
}
|
||||
|
||||
UI_SetNext(Rounding, 0);
|
||||
UI_SetNext(Tint, 0);
|
||||
UI_PushCP(UI_BuildRow());
|
||||
{
|
||||
UI_SetNext(BorderColor, border_color);
|
||||
UI_SetNext(BackgroundColor, color);
|
||||
UI_SetNext(BorderColor, btn_border_color);
|
||||
UI_SetNext(BackgroundColor, btn_color);
|
||||
UI_SetNext(Rounding, UI_RPIX(5));
|
||||
UI_SetNext(Width, UI_GROW(1, 0));
|
||||
UI_SetNext(Height, UI_FNT(1.5, 1));
|
||||
@ -194,6 +195,8 @@ void PP_EndCommandsWidget(PP_CommandsWidget *widget)
|
||||
UI_SetNext(Flags, UI_BoxFlag_DrawText | UI_BoxFlag_Interactable);
|
||||
UI_PushCP(UI_BuildRowEx(btn_key));
|
||||
{
|
||||
UI_Push(Tag, btn_key.hash);
|
||||
|
||||
/* Begin spacer */
|
||||
UI_BuildSpacer(UI_PIX(20, 1), Axis_X);
|
||||
|
||||
@ -206,6 +209,23 @@ void PP_EndCommandsWidget(PP_CommandsWidget *widget)
|
||||
/* Command hotkey buttons */
|
||||
for (u64 i = 0; i < countof(item->desc.hotkeys); ++i)
|
||||
{
|
||||
UI_Key hotkey_key = UI_KeyF("hotkey%F", FmtUint(i));
|
||||
UI_Report hotkey_rep = UI_ReportFromKey(hotkey_key);
|
||||
|
||||
Vec4 hotkey_color = ZI;
|
||||
Vec4 hotkey_border_color = ZI;
|
||||
{
|
||||
Vec4 hovered_color = Rgb32(0x103c4c);
|
||||
Vec4 pressed_color = hovered_color;
|
||||
pressed_color.w = 0.2;
|
||||
f32 hotkey_hot = hotkey_rep.hot;
|
||||
f32 hotkey_active = hotkey_rep.active;
|
||||
f32 hotkey_hovered = hotkey_rep.hovered;
|
||||
hotkey_color = BlendSrgb(hotkey_color, hovered_color, hotkey_hot);
|
||||
hotkey_color = BlendSrgb(hotkey_color, pressed_color, hotkey_active * hotkey_hovered);
|
||||
hotkey_border_color = BlendSrgb(hotkey_border_color, Rgb32(0x0078a6), hotkey_hot);
|
||||
}
|
||||
|
||||
PP_Hotkey hotkey = item->desc.hotkeys[i];
|
||||
if (hotkey.button == Button_None)
|
||||
{
|
||||
@ -214,15 +234,18 @@ void PP_EndCommandsWidget(PP_CommandsWidget *widget)
|
||||
else
|
||||
{
|
||||
String hotkey_name = PP_StringFromHotkey(UI_FrameArena(), hotkey);
|
||||
UI_SetNext(BackgroundColor, hotkey_color);
|
||||
UI_SetNext(BorderColor, hotkey_border_color);
|
||||
UI_SetNext(Text, hotkey_name);
|
||||
UI_SetNext(Width, UI_SHRINK(theme.text_padding_x + 5, 1));
|
||||
// UI_SetNext(Width, UI_SHRINK(0, 1));
|
||||
UI_SetNext(Height, UI_GROW(1, 0));
|
||||
UI_SetNext(Rounding, UI_RGROW(1));
|
||||
UI_SetNext(Rounding, UI_RPIX(5));
|
||||
UI_SetNext(Border, 1);
|
||||
// UI_SetNext(BackgroundColor, Color_Cyan);
|
||||
UI_SetNext(ChildAlignment, UI_Alignment_Center);
|
||||
UI_SetNext(Flags, UI_BoxFlag_DrawText | UI_BoxFlag_Interactable);
|
||||
UI_PushCP(UI_BuildRow());
|
||||
UI_PushCP(UI_BuildRowEx(hotkey_key));
|
||||
{
|
||||
|
||||
}
|
||||
|
||||
@ -7,6 +7,7 @@ UI_Key UI_BuildLabel(String text)
|
||||
ResourceKey font = UI_UseTop(Font);
|
||||
f32 font_size = UI_UseTop(FontSize);
|
||||
Vec4 tint = UI_UseTop(Tint);
|
||||
UI_Alignment alignment = UI_UseTop(ChildAlignment);
|
||||
|
||||
UI_Key key = ZI;
|
||||
UI_PushCP(UI_NilKey);
|
||||
@ -19,6 +20,7 @@ UI_Key UI_BuildLabel(String text)
|
||||
UI_SetNext(Width, UI_SHRINK(0, 1));
|
||||
UI_SetNext(Height, UI_SHRINK(0, 1));
|
||||
UI_SetNext(Text, text);
|
||||
UI_SetNext(ChildAlignment, alignment);
|
||||
UI_SetNext(Flags, UI_BoxFlag_DrawText);
|
||||
key = UI_BuildBox();
|
||||
}
|
||||
|
||||
@ -14,8 +14,8 @@ UI_Key UI_BuildDivider(UI_Size size, Vec4 color, Axis axis);
|
||||
////////////////////////////////////////////////////////////
|
||||
//~ Layout helpers
|
||||
|
||||
UI_Key UI_BuildColumnEx(UI_Key key);
|
||||
UI_Key UI_BuildRowEx(UI_Key key);
|
||||
UI_Key UI_BuildColumnEx(UI_Key key);
|
||||
|
||||
#define UI_BuildColumn() UI_BuildColumnEx(UI_TransKey())
|
||||
#define UI_BuildRow() UI_BuildRowEx(UI_TransKey())
|
||||
#define UI_BuildColumn() UI_BuildColumnEx(UI_TransKey())
|
||||
|
||||
@ -586,6 +586,8 @@ UI_Frame UI_BeginFrame(UI_FrameFlag frame_flags)
|
||||
|
||||
result.window_frame = g->bframe.window_frame;
|
||||
result.cursor_pos = g->bframe.cursor_pos;
|
||||
result.hovered_box = g->bframe.hovered_box;
|
||||
result.active_box = g->bframe.hovered_box;
|
||||
return result;
|
||||
}
|
||||
|
||||
@ -1316,7 +1318,6 @@ i64 UI_EndFrame(UI_Frame frame)
|
||||
}
|
||||
baseline = CeilVec2(baseline);
|
||||
|
||||
|
||||
/* Push text rects */
|
||||
for (u64 i = 0; i < run.count; ++i)
|
||||
{
|
||||
|
||||
@ -290,6 +290,8 @@ Struct(UI_Frame)
|
||||
{
|
||||
WND_Frame window_frame;
|
||||
Vec2 cursor_pos;
|
||||
UI_Key hovered_box;
|
||||
UI_Key active_box;
|
||||
};
|
||||
|
||||
////////////////////////////////////////////////////////////
|
||||
|
||||
@ -56,8 +56,6 @@ UI_RectPS_Output PSDef(UI_RectPS, UI_RectPS_Input input)
|
||||
Vec2 p0 = rect.p0;
|
||||
Vec2 p1 = rect.p1;
|
||||
|
||||
b32 aa_enabled = 0;
|
||||
|
||||
/* Calculate rect sdf (negative means pixel is inside of rect) */
|
||||
f32 rect_dist = min(min(p.x - p0.x, p1.x - p.x), min(p.y - p0.y, p1.y - p.y));
|
||||
{
|
||||
@ -69,10 +67,10 @@ UI_RectPS_Output PSDef(UI_RectPS, UI_RectPS_Input input)
|
||||
Vec2 tr = Vec2(p1.x - tr_radius, p0.y + tr_radius);
|
||||
Vec2 br = Vec2(p1.x - br_radius, p1.y - br_radius);
|
||||
Vec2 bl = Vec2(p0.x + bl_radius, p1.y - bl_radius);
|
||||
if (p.x < tl.x && p.y < tl.y) { rect_dist = min(rect_dist, tl_radius - length(tl - p)); aa_enabled = 1; }
|
||||
if (p.x > tr.x && p.y < tr.y) { rect_dist = min(rect_dist, tr_radius - length(tr - p)); aa_enabled = 1; }
|
||||
if (p.x > br.x && p.y > br.y) { rect_dist = min(rect_dist, br_radius - length(br - p)); aa_enabled = 1; }
|
||||
if (p.x < bl.x && p.y > bl.y) { rect_dist = min(rect_dist, bl_radius - length(bl - p)); aa_enabled = 1; }
|
||||
if (p.x < tl.x && p.y < tl.y) { rect_dist = min(rect_dist, tl_radius - length(tl - p)); }
|
||||
if (p.x > tr.x && p.y < tr.y) { rect_dist = min(rect_dist, tr_radius - length(tr - p)); }
|
||||
if (p.x > br.x && p.y > br.y) { rect_dist = min(rect_dist, br_radius - length(br - p)); }
|
||||
if (p.x < bl.x && p.y > bl.y) { rect_dist = min(rect_dist, bl_radius - length(bl - p)); }
|
||||
}
|
||||
rect_dist = -rect_dist;
|
||||
|
||||
@ -98,20 +96,16 @@ UI_RectPS_Output PSDef(UI_RectPS, UI_RectPS_Input input)
|
||||
}
|
||||
}
|
||||
|
||||
/* Calculate border blend from derivitive */
|
||||
f32 border_dist_fwidth = fwidth(border_dist);
|
||||
f32 border_blend = saturate(0.5 - border_dist / border_dist_fwidth);
|
||||
if (!aa_enabled)
|
||||
{
|
||||
border_blend = border_dist <= 0;
|
||||
}
|
||||
|
||||
/* Background color */
|
||||
Vec4 background_color = 0;
|
||||
{
|
||||
if (rect_dist <= 0)
|
||||
{
|
||||
if (rect.flags & UI_RectFlag_DrawTexture)
|
||||
if (border_dist <= 0)
|
||||
{
|
||||
background_color = border_color;
|
||||
}
|
||||
else if (rect.flags & UI_RectFlag_DrawTexture)
|
||||
{
|
||||
SamplerState sampler = UniformSamplerFromRid(sig.sampler);
|
||||
Texture2D<Vec4> tex = NonUniformResourceFromRid(rect.tex);
|
||||
@ -125,7 +119,7 @@ UI_RectPS_Output PSDef(UI_RectPS, UI_RectPS_Input input)
|
||||
}
|
||||
|
||||
/* Final color */
|
||||
Vec4 final_color = lerp(background_color, border_color, border_blend);
|
||||
Vec4 final_color = background_color;
|
||||
final_color *= input.tint_lin;
|
||||
|
||||
/* Debug color */
|
||||
|
||||
Loading…
Reference in New Issue
Block a user