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

New Buttons and Input Frame

Browse Source 
Former-commit-id: 140b27f9d41de04eb7018d1bbe65012af889a271
This commit is contained in:
Pfauenauge 2019-05-03 13:02:03 +02:00
parent 485108afd4
commit b2918c2ebc
4 changed files with 60 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
assets/voxygen

@ -1 +1 @@
Subproject commit d4cffdf6946cdbc44b6c28e9ab4abf82b8ee6442 Subproject commit d887de6c9bbe1a770be06a1a4abb6be5fa35f3d2

44
voxygen/src/hud/mod.rs
View File

@ -218,9 +218,9 @@ pub(self) struct Imgs {
// Menu // Menu
esc_bg: ImgId, esc_bg: ImgId,
fireplace: ImgId, fireplace: ImgId,
button_dark: ImgId, button: ImgId,
button_dark_hover: ImgId, button_hover: ImgId,
button_dark_press: ImgId, button_press: ImgId,
// MiniMap // MiniMap
mmap_frame: ImgId, mmap_frame: ImgId,
@ -381,9 +381,9 @@ impl Imgs {
// Esc-Menu // Esc-Menu
esc_bg: load_img("element/frames/menu.png", ui), esc_bg: load_img("element/frames/menu.png", ui),
fireplace: load_vox("element/misc_bg/fireplace.vox", ui), fireplace: load_vox("element/misc_bg/fireplace.vox", ui),
button_dark: load_vox("element/buttons/button_dark.vox", ui), button: load_vox("element/buttons/button.vox", ui),
button_dark_hover: load_img("element/buttons/button_dark_hover.png", ui), button_hover: load_img("element/buttons/button_hover.png", ui),
button_dark_press: load_img("element/buttons/button_dark_press.png", ui), button_press: load_img("element/buttons/button_press.png", ui),
// MiniMap // MiniMap
mmap_frame: load_vox("element/frames/mmap.vox", ui), mmap_frame: load_vox("element/frames/mmap.vox", ui),
@ -1310,7 +1310,7 @@ impl Hud {
.font_id(self.font_opensans) .font_id(self.font_opensans)
.font_size(18) .font_size(18)
.set(self.ids.controls_text, ui_widgets); .set(self.ids.controls_text, ui_widgets);
// TODO // TODO: Replace with buttons that show the actual keybind and allow the user to change it.
Text::new( Text::new(
"TAB\n\ "TAB\n\
F1\n\ F1\n\
@ -1778,11 +1778,11 @@ impl Hud {
.set(self.ids.fireplace, ui_widgets); .set(self.ids.fireplace, ui_widgets);
// Settings // Settings
if Button::image(self.imgs.button_dark) if Button::image(self.imgs.button)
.mid_top_with_margin_on(self.ids.esc_bg, 115.0) .mid_top_with_margin_on(self.ids.esc_bg, 115.0)
.w_h(170.0, 50.0) .w_h(170.0, 50.0)
.hover_image(self.imgs.button_dark_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_dark_press) .press_image(self.imgs.button_press)
.label("Settings") .label("Settings")
.label_y(conrod_core::position::Relative::Scalar(2.0)) .label_y(conrod_core::position::Relative::Scalar(2.0))
.label_color(TEXT_COLOR) .label_color(TEXT_COLOR)
@ -1794,11 +1794,11 @@ impl Hud {
self.open_windows = Windows::Settings; self.open_windows = Windows::Settings;
}; };
// Controls // Controls
if Button::image(self.imgs.button_dark) if Button::image(self.imgs.button)
.mid_top_with_margin_on(self.ids.esc_bg, 175.0) .mid_top_with_margin_on(self.ids.esc_bg, 175.0)
.w_h(170.0, 50.0) .w_h(170.0, 50.0)
.hover_image(self.imgs.button_dark_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_dark_press) .press_image(self.imgs.button_press)
.label("Controls") .label("Controls")
.label_y(conrod_core::position::Relative::Scalar(2.0)) .label_y(conrod_core::position::Relative::Scalar(2.0))
.label_color(TEXT_COLOR) .label_color(TEXT_COLOR)
@ -1811,11 +1811,11 @@ impl Hud {
self.open_windows = Windows::Settings; self.open_windows = Windows::Settings;
}; };
// Servers // Servers
if Button::image(self.imgs.button_dark) if Button::image(self.imgs.button)
.mid_top_with_margin_on(self.ids.esc_bg, 235.0) .mid_top_with_margin_on(self.ids.esc_bg, 235.0)
.w_h(170.0, 50.0) .w_h(170.0, 50.0)
.hover_image(self.imgs.button_dark_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_dark_press) .press_image(self.imgs.button_press)
.label("Servers") .label("Servers")
.label_y(conrod_core::position::Relative::Scalar(2.0)) .label_y(conrod_core::position::Relative::Scalar(2.0))
.label_color(TEXT_COLOR) .label_color(TEXT_COLOR)
@ -1826,11 +1826,11 @@ impl Hud {
//self.menu_open = false; //self.menu_open = false;
}; };
// Logout // Logout
if Button::image(self.imgs.button_dark) if Button::image(self.imgs.button)
.mid_top_with_margin_on(self.ids.esc_bg, 295.0) .mid_top_with_margin_on(self.ids.esc_bg, 295.0)
.w_h(170.0, 50.0) .w_h(170.0, 50.0)
.hover_image(self.imgs.button_dark_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_dark_press) .press_image(self.imgs.button_press)
.label("Logout") .label("Logout")
.label_y(conrod_core::position::Relative::Scalar(2.0)) .label_y(conrod_core::position::Relative::Scalar(2.0))
.label_color(TEXT_COLOR) .label_color(TEXT_COLOR)
@ -1841,11 +1841,11 @@ impl Hud {
events.push(Event::Logout); events.push(Event::Logout);
}; };
// Quit // Quit
if Button::image(self.imgs.button_dark) if Button::image(self.imgs.button)
.mid_top_with_margin_on(self.ids.esc_bg, 355.0) .mid_top_with_margin_on(self.ids.esc_bg, 355.0)
.w_h(170.0, 50.0) .w_h(170.0, 50.0)
.hover_image(self.imgs.button_dark_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_dark_press) .press_image(self.imgs.button_press)
.label("Quit") .label("Quit")
.label_y(conrod_core::position::Relative::Scalar(2.0)) .label_y(conrod_core::position::Relative::Scalar(2.0))
.label_color(TEXT_COLOR) .label_color(TEXT_COLOR)

6
voxygen/src/menu/char_selection/ui.rs
View File

@ -52,6 +52,7 @@ widget_ids! {
undead_skin_bg, undead_skin_bg,
elf_skin_bg, elf_skin_bg,
danari_skin_bg, danari_skin_bg,
name_input_bg,
// Buttons // Buttons
@ -577,9 +578,12 @@ impl CharSelectionUi {
self.character_creation = false; self.character_creation = false;
} }
// Character Name Input // Character Name Input
Rectangle::fill_with([320.0, 50.0], color::rgba(0.0, 0.0, 0.0, 0.99))
.mid_bottom_with_margin_on(self.ids.bg_creation, 20.0)
.set(self.ids.name_input_bg, ui_widgets);
Button::image(self.imgs.name_input) Button::image(self.imgs.name_input)
.w_h(337.0, 67.0) .w_h(337.0, 67.0)
.mid_bottom_with_margin_on(self.ids.bg_creation, 10.0) .middle_of(self.ids.name_input_bg)
.set(self.ids.name_input, ui_widgets); .set(self.ids.name_input, ui_widgets);
for event in TextBox::new(&self.character_name) for event in TextBox::new(&self.character_name)
.w_h(300.0, 60.0) .w_h(300.0, 60.0)

61
voxygen/src/menu/main/ui.rs
View File

@ -34,6 +34,8 @@ widget_ids! {
username_field, username_field,
singleplayer_button, singleplayer_button,
singleplayer_text, singleplayer_text,
usrnm_bg,
srvr_bg,
// Serverlist // Serverlist
servers_button, servers_button,
servers_frame, servers_frame,
@ -56,9 +58,6 @@ struct Imgs {
input_bg: ImgId, input_bg: ImgId,
error_frame: ImgId, error_frame: ImgId,
button_dark: ImgId,
button_dark_hover: ImgId,
button_dark_press: ImgId,
button: ImgId, button: ImgId,
button_hover: ImgId, button_hover: ImgId,
button_press: ImgId, button_press: ImgId,
@ -93,9 +92,6 @@ impl Imgs {
input_bg: load_vox("element/misc_bg/textbox.vox", ui), input_bg: load_vox("element/misc_bg/textbox.vox", ui),
error_frame: load_img("element/frames/window_2.png", ui), error_frame: load_img("element/frames/window_2.png", ui),
button_dark: load_vox("element/buttons/button_dark.vox", ui),
button_dark_hover: load_vox("element/buttons/button_dark_hover.vox", ui),
button_dark_press: load_vox("element/buttons/button_dark_press.vox", ui),
button: load_vox("element/buttons/button.vox", ui), button: load_vox("element/buttons/button.vox", ui),
button_hover: load_vox("element/buttons/button_hover.vox", ui), button_hover: load_vox("element/buttons/button_hover.vox", ui),
button_press: load_vox("element/buttons/button_press.vox", ui), button_press: load_vox("element/buttons/button_press.vox", ui),
@ -209,15 +205,17 @@ impl MainMenuUi {
const TEXT_COLOR: Color = Color::Rgba(1.0, 1.0, 1.0, 1.0); const TEXT_COLOR: Color = Color::Rgba(1.0, 1.0, 1.0, 1.0);
// Username // Username
// TODO: get a lower resolution and cleaner input_bg.png Rectangle::fill_with([320.0, 50.0], color::rgba(0.0, 0.0, 0.0, 0.99))
.middle_of(ui_widgets.window)
.set(self.ids.usrnm_bg, ui_widgets);
Image::new(self.imgs.input_bg) Image::new(self.imgs.input_bg)
.w_h(337.0, 67.0) .w_h(337.0, 67.0)
.middle_of(ui_widgets.window) .middle_of(self.ids.usrnm_bg)
.set(self.ids.username_bg, ui_widgets); .set(self.ids.username_bg, ui_widgets);
for event in TextBox::new(&self.username) for event in TextBox::new(&self.username)
.w_h(580.0 / 2.0, 60.0 / 2.0) .w_h(290.0, 30.0)
.mid_bottom_with_margin_on(self.ids.username_bg, 44.0 / 2.0) .mid_bottom_with_margin_on(self.ids.username_bg, 44.0 / 2.0)
.font_size(20) .font_size(22)
.font_id(self.font_opensans) .font_id(self.font_opensans)
.text_color(TEXT_COLOR) .text_color(TEXT_COLOR)
// transparent background // transparent background
@ -252,11 +250,11 @@ impl MainMenuUi {
.set(self.ids.error_frame, ui_widgets); .set(self.ids.error_frame, ui_widgets);
text.mid_top_with_margin_on(self.ids.error_frame, 10.0) text.mid_top_with_margin_on(self.ids.error_frame, 10.0)
.set(self.ids.login_error, ui_widgets); .set(self.ids.login_error, ui_widgets);
if Button::image(self.imgs.button_dark) if Button::image(self.imgs.button)
.w_h(100.0, 30.0) .w_h(100.0, 30.0)
.mid_bottom_with_margin_on(self.ids.login_error_bg, 5.0) .mid_bottom_with_margin_on(self.ids.login_error_bg, 5.0)
.hover_image(self.imgs.button_dark_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_dark_press) .press_image(self.imgs.button_press)
.label_y(Relative::Scalar(2.0)) .label_y(Relative::Scalar(2.0))
.label("Okay") .label("Okay")
.label_font_size(10) .label_font_size(10)
@ -294,11 +292,11 @@ impl MainMenuUi {
if item if item
.set( .set(
Button::image(self.imgs.button_dark) Button::image(self.imgs.button)
.w_h(100.0, 53.0) .w_h(100.0, 53.0)
.mid_bottom_with_margin_on(self.ids.servers_frame, 5.0) .mid_bottom_with_margin_on(self.ids.servers_frame, 5.0)
.hover_image(self.imgs.button_dark_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_dark_press) .press_image(self.imgs.button_press)
.label_y(Relative::Scalar(2.0)) .label_y(Relative::Scalar(2.0))
.label(&text) .label(&text)
.label_font_size(20) .label_font_size(20)
@ -312,11 +310,11 @@ impl MainMenuUi {
} }
} }
if Button::image(self.imgs.button_dark) if Button::image(self.imgs.button)
.w_h(200.0, 53.0) .w_h(200.0, 53.0)
.mid_bottom_with_margin_on(self.ids.servers_frame, 5.0) .mid_bottom_with_margin_on(self.ids.servers_frame, 5.0)
.hover_image(self.imgs.button_dark_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_dark_press) .press_image(self.imgs.button_press)
.label_y(Relative::Scalar(2.0)) .label_y(Relative::Scalar(2.0))
.label("Close") .label("Close")
.label_font_size(20) .label_font_size(20)
@ -328,14 +326,17 @@ impl MainMenuUi {
}; };
} }
// Server address // Server address
Rectangle::fill_with([320.0, 50.0], color::rgba(0.0, 0.0, 0.0, 0.98))
.down_from(self.ids.usrnm_bg, 30.0)
.set(self.ids.srvr_bg, ui_widgets);
Image::new(self.imgs.input_bg) Image::new(self.imgs.input_bg)
.w_h(337.0, 67.0) .w_h(337.0, 67.0)
.down_from(self.ids.username_bg, 10.0) .middle_of(self.ids.srvr_bg)
.set(self.ids.address_bg, ui_widgets); .set(self.ids.address_bg, ui_widgets);
for event in TextBox::new(&self.server_address) for event in TextBox::new(&self.server_address)
.w_h(580.0 / 2.0, 60.0 / 2.0) .w_h(290.0, 30.0)
.mid_bottom_with_margin_on(self.ids.address_bg, 44.0 / 2.0) .mid_bottom_with_margin_on(self.ids.address_bg, 44.0 / 2.0)
.font_size(20) .font_size(22)
.font_id(self.font_opensans) .font_id(self.font_opensans)
.text_color(TEXT_COLOR) .text_color(TEXT_COLOR)
// transparent background // transparent background
@ -356,7 +357,7 @@ impl MainMenuUi {
// Change button text and remove hover/press images if a connection is in progress // Change button text and remove hover/press images if a connection is in progress
if let Some(start) = self.connecting { if let Some(start) = self.connecting {
Button::image(self.imgs.button) Button::image(self.imgs.button)
.w_h(258.0, 68.0) .w_h(258.0, 55.0)
.down_from(self.ids.address_bg, 20.0) .down_from(self.ids.address_bg, 20.0)
.align_middle_x_of(self.ids.address_bg) .align_middle_x_of(self.ids.address_bg)
.label("Connecting...") .label("Connecting...")
@ -369,14 +370,14 @@ impl MainMenuUi {
pulse / 4.0 + 0.75, pulse / 4.0 + 0.75,
) )
}) })
.label_font_size(24) .label_font_size(22)
.label_y(Relative::Scalar(5.0)) .label_y(Relative::Scalar(5.0))
.set(self.ids.login_button, ui_widgets); .set(self.ids.login_button, ui_widgets);
} else { } else {
if Button::image(self.imgs.button) if Button::image(self.imgs.button)
.hover_image(self.imgs.button_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_press) .press_image(self.imgs.button_press)
.w_h(258.0, 68.0) .w_h(258.0, 55.0)
.down_from(self.ids.address_bg, 20.0) .down_from(self.ids.address_bg, 20.0)
.align_middle_x_of(self.ids.address_bg) .align_middle_x_of(self.ids.address_bg)
.label("Login") .label("Login")
@ -394,12 +395,12 @@ impl MainMenuUi {
if Button::image(self.imgs.button) if Button::image(self.imgs.button)
.hover_image(self.imgs.button_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_press) .press_image(self.imgs.button_press)
.w_h(258.0, 68.0) .w_h(258.0, 55.0)
.down_from(self.ids.login_button, 20.0) .down_from(self.ids.login_button, 20.0)
.align_middle_x_of(self.ids.address_bg) .align_middle_x_of(self.ids.address_bg)
.label("Singleplayer") .label("Singleplayer")
.label_color(TEXT_COLOR) .label_color(TEXT_COLOR)
.label_font_size(24) .label_font_size(22)
.label_y(Relative::Scalar(5.0)) .label_y(Relative::Scalar(5.0))
.label_x(Relative::Scalar(2.0)) .label_x(Relative::Scalar(2.0))
.set(self.ids.singleplayer_button, ui_widgets) .set(self.ids.singleplayer_button, ui_widgets)
@ -409,7 +410,7 @@ impl MainMenuUi {
} }
// Quit // Quit
if Button::image(self.imgs.button) if Button::image(self.imgs.button)
.w_h(203.0, 53.0) .w_h(190.0, 40.0)
.bottom_left_with_margins_on(ui_widgets.window, 60.0, 30.0) .bottom_left_with_margins_on(ui_widgets.window, 60.0, 30.0)
.hover_image(self.imgs.button_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_press) .press_image(self.imgs.button_press)
@ -424,7 +425,7 @@ impl MainMenuUi {
}; };
// Settings // Settings
if Button::image(self.imgs.button) if Button::image(self.imgs.button)
.w_h(203.0, 53.0) .w_h(190.0, 40.0)
.up_from(self.ids.quit_button, 8.0) .up_from(self.ids.quit_button, 8.0)
.hover_image(self.imgs.button_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_press) .press_image(self.imgs.button_press)
@ -437,7 +438,7 @@ impl MainMenuUi {
{}; {};
// Servers // Servers
if Button::image(self.imgs.button) if Button::image(self.imgs.button)
.w_h(203.0, 53.0) .w_h(190.0, 40.0)
.up_from(self.ids.settings_button, 8.0) .up_from(self.ids.settings_button, 8.0)
.hover_image(self.imgs.button_hover) .hover_image(self.imgs.button_hover)
.press_image(self.imgs.button_press) .press_image(self.imgs.button_press)