Mirrored_Repos/veloren
1
0
Fork 0
mirror of https://gitlab.com/veloren/veloren.git synced 2024-08-30 18:12:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'mkatsenelson/focused_chat_border' into 'master'

Browse Source 
add focus chat borders with avarage opacity of chat and input text color

See merge request veloren/veloren!3984
This commit is contained in:
Monty Marz 2023-06-16 08:29:39 +00:00
commit 138e7bf0a2
1 changed files with 43 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
voxygen/src/hud/chat.rs
View File

@ -13,7 +13,7 @@ use conrod_core::{
self, self,
cursor::{self, Index}, cursor::{self, Index},
}, },
widget::{self, Button, Id, Image, List, Rectangle, Text, TextEdit}, widget::{self, Button, Id, Image, Line, List, Rectangle, Text, TextEdit},
widget_ids, Color, Colorable, Labelable, Positionable, Sizeable, Ui, UiCell, Widget, widget_ids, Color, Colorable, Labelable, Positionable, Sizeable, Ui, UiCell, Widget,
WidgetCommon, WidgetCommon,
}; };
@ -28,6 +28,10 @@ widget_ids! {
chat_input, chat_input,
chat_input_bg, chat_input_bg,
chat_input_icon, chat_input_icon,
chat_input_border_up,
chat_input_border_down,
chat_input_border_left,
chat_input_border_right,
chat_arrow, chat_arrow,
chat_icon_align, chat_icon_align,
chat_icons[], chat_icons[],
@ -47,6 +51,7 @@ const X: f64 = 18.0;*/
const MAX_MESSAGES: usize = 100; const MAX_MESSAGES: usize = 100;
const CHAT_ICON_WIDTH: f64 = 16.0; const CHAT_ICON_WIDTH: f64 = 16.0;
const CHAT_MARGIN_THICKNESS: f64 = 2.0;
const CHAT_ICON_HEIGHT: f64 = 16.0; const CHAT_ICON_HEIGHT: f64 = 16.0;
const CHAT_BOX_WIDTH: f64 = 470.0; const CHAT_BOX_WIDTH: f64 = 470.0;
const CHAT_BOX_INPUT_WIDTH: f64 = 460.0 - CHAT_ICON_WIDTH - 1.0; const CHAT_BOX_INPUT_WIDTH: f64 = 460.0 - CHAT_ICON_WIDTH - 1.0;
@ -203,6 +208,12 @@ impl<'a> Widget for Chat<'a> {
fn style(&self) -> Self::Style {} fn style(&self) -> Self::Style {}
fn update(self, args: widget::UpdateArgs<Self>) -> Self::Event { fn update(self, args: widget::UpdateArgs<Self>) -> Self::Event {
fn adjust_border_opacity(color: Color, opacity: f32) -> Color {
match color {
Color::Rgba(r, g, b, a) => Color::Rgba(r, g, b, (a + opacity) / 2.0),
_ => panic!("Color input should be Rgba, instead found: {:?}", color),
}
}
common_base::prof_span!("Chat::update"); common_base::prof_span!("Chat::update");
let widget::UpdateArgs { id, state, ui, .. } = args; let widget::UpdateArgs { id, state, ui, .. } = args;
@ -385,6 +396,33 @@ impl<'a> Widget for Chat<'a> {
.w(CHAT_BOX_WIDTH) .w(CHAT_BOX_WIDTH)
.set(state.ids.chat_input_bg, ui); .set(state.ids.chat_input_bg, ui);
//border around focused chat window
let border_color = adjust_border_opacity(color, chat_settings.chat_opacity);
//top line
Line::centred([0.0, 0.0], [CHAT_BOX_WIDTH, 0.0])
.color(border_color)
.thickness(CHAT_MARGIN_THICKNESS)
.top_left_of(state.ids.chat_input_bg)
.set(state.ids.chat_input_border_up, ui);
//bottom line
Line::centred([0.0, 0.0], [CHAT_BOX_WIDTH, 0.0])
.color(border_color)
.thickness(CHAT_MARGIN_THICKNESS)
.bottom_left_of(state.ids.chat_input_bg)
.set(state.ids.chat_input_border_down, ui);
//left line
Line::centred([0.0, 0.0], [0.0, y])
.color(border_color)
.thickness(CHAT_MARGIN_THICKNESS)
.bottom_left_of(state.ids.chat_input_bg)
.set(state.ids.chat_input_border_left, ui);
//right line
Line::centred([0.0, 0.0], [0.0, y])
.color(border_color)
.thickness(CHAT_MARGIN_THICKNESS)
.bottom_right_of(state.ids.chat_input_bg)
.set(state.ids.chat_input_border_right, ui);
if let Some(mut input) = text_edit if let Some(mut input) = text_edit
.right_from(state.ids.chat_input_icon, 1.0) .right_from(state.ids.chat_input_icon, 1.0)
.set(state.ids.chat_input, ui) .set(state.ids.chat_input, ui)
@ -399,7 +437,10 @@ impl<'a> Widget for Chat<'a> {
.rgba(0.0, 0.0, 0.0, chat_settings.chat_opacity) .rgba(0.0, 0.0, 0.0, chat_settings.chat_opacity)
.and(|r| { .and(|r| {
if input_focused { if input_focused {
r.up_from(state.ids.chat_input_bg, 0.0) r.up_from(
state.ids.chat_input_border_up,
0.0 + CHAT_MARGIN_THICKNESS / 2.0,
)
} else { } else {
r.bottom_left_with_margins_on(ui.window, 10.0, 10.0) r.bottom_left_with_margins_on(ui.window, 10.0, 10.0)
} }