Add support for Space widget, refine main menu ui, misc fixes and improvements.

voxygen/src/menu/char_selection/ui.rs

@@ -192,7 +192,7 @@ image_ids! {
         selection_hover: "voxygen.element.frames.selection_hover",
         selection_press: "voxygen.element.frames.selection_press",
 
-        name_input: "voxygen.element.misc_bg.textbox_mid",
+        name_input: "voxygen.element.misc_bg.textbox",
 
         slider_range: "voxygen.element.slider.track",
         slider_indicator: "voxygen.element.slider.indicator",

voxygen/src/menu/main/ui.rs

@@ -107,7 +107,7 @@ image_ids! {
         button: "voxygen.element.buttons.button",
         button_hover: "voxygen.element.buttons.button_hover",
         button_press: "voxygen.element.buttons.button_press",
-        input_bg: "voxygen.element.misc_bg.textbox_mid",
+        input_bg: "voxygen.element.misc_bg.textbox",
         //disclaimer: "voxygen.element.frames.disclaimer",
         loading_art: "voxygen.element.frames.loading_screen.loading_bg",
         loading_art_l: "voxygen.element.frames.loading_screen.loading_bg_l",
@@ -140,9 +140,7 @@ image_ids_ice! {
         button: "voxygen.element.buttons.button",
         button_hover: "voxygen.element.buttons.button_hover",
         button_press: "voxygen.element.buttons.button_press",
-        input_bg_top: "voxygen.element.misc_bg.textbox_top",
-        input_bg_mid: "voxygen.element.misc_bg.textbox_mid",
-        input_bg_bot: "voxygen.element.misc_bg.textbox_bot",
+        input_bg: "voxygen.element.misc_bg.textbox",
         disclaimer: "voxygen.element.frames.disclaimer",
 
         <BlankGraphic>
@@ -193,7 +191,7 @@ struct IcedState {
 pub type Message = Event;
 impl IcedState {
     pub fn view(&mut self) -> Element<Message> {
-        use iced::{Align, Column, Container, Length, Row};
+        use iced::{Align, Column, Container, Length, Row, Space};
         use ui::ice::{
             compound_graphic::{CompoundGraphic, Graphic},
             BackgroundContainer, Image, Padding,
@@ -216,23 +214,68 @@ impl IcedState {
             .align_y(Align::End)
             .padding(20);
 
-        let banner_content =
-            Column::with_children(vec![Image::new(self.imgs.v_logo).fix_aspect_ratio().into()]);
-        //.padding(15);
+        let banner_content = Column::with_children(vec![
+            Image::new(self.imgs.v_logo)
+                .fix_aspect_ratio()
+                .height(Length::FillPortion(20))
+                .into(),
+            Space::new(Length::Fill, Length::FillPortion(5)).into(),
+            Column::with_children(vec![
+                BackgroundContainer::new(
+                    CompoundGraphic::padded_image(self.imgs.input_bg, [169, 25], [0, 0, 0, 1])
+                        .fix_aspect_ratio(),
+                    Space::new(Length::Fill, Length::Fill),
+                )
+                .into(),
+                BackgroundContainer::new(
+                    CompoundGraphic::padded_image(self.imgs.input_bg, [169, 25], [0, 1, 0, 1])
+                        .fix_aspect_ratio(),
+                    Space::new(Length::Fill, Length::Fill),
+                )
+                .into(),
+                BackgroundContainer::new(
+                    CompoundGraphic::padded_image(self.imgs.input_bg, [169, 25], [0, 1, 0, 0])
+                        .fix_aspect_ratio(),
+                    Space::new(Length::Fill, Length::Fill),
+                )
+                .into(),
+            ])
+            .height(Length::FillPortion(50))
+            .into(),
+            Column::with_children(vec![
+                BackgroundContainer::new(
+                    CompoundGraphic::padded_image(self.imgs.button, [106, 26], [10, 0, 10, 2])
+                        .fix_aspect_ratio(),
+                    Space::new(Length::Fill, Length::Fill),
+                )
+                .into(),
+                BackgroundContainer::new(
+                    CompoundGraphic::padded_image(self.imgs.button, [106, 26], [10, 2, 10, 0])
+                        .fix_aspect_ratio(),
+                    Space::new(Length::Fill, Length::Fill),
+                )
+                .into(),
+            ])
+            .max_width(240)
+            .height(Length::FillPortion(25))
+            .into(),
+        ])
+        .width(Length::Fill)
+        .height(Length::Fill)
+        .align_items(Align::Center);
 
         let banner = BackgroundContainer::new(
-            CompoundGraphic::with_graphics(vec![
+            CompoundGraphic::from_graphics(vec![
                 Graphic::image(self.imgs.banner_top, [138, 17], [0, 0]),
-                Graphic::rect(Rgba::new(0, 0, 0, 230), [130, 175], [4, 17]),
-                // Might need floats here
-                Graphic::image(self.imgs.banner, [130, 15], [4, 192])
+                Graphic::rect(Rgba::new(0, 0, 0, 230), [130, 195], [4, 17]),
+                Graphic::image(self.imgs.banner, [130, 15], [4, 212])
                     .color(Rgba::new(255, 255, 255, 230)),
             ])
             .fix_aspect_ratio()
             .height(Length::Fill),
             banner_content,
         )
-        .padding(Padding::new().horizontal(16).top(21).bottom(4))
+        .padding(Padding::new().horizontal(16).vertical(20))
         .max_width(330);
 
         let central_column = Container::new(banner)

voxygen/src/ui/ice/renderer.rs

@@ -4,6 +4,7 @@ mod compound_graphic;
 mod container;
 mod image;
 mod row;
+mod space;
 
 use super::{
     super::{
@@ -69,6 +70,7 @@ pub enum Primitive {
         bounds: iced::Rectangle,
         color: Rgba<u8>,
     },
+    Nothing,
 }
 
 // Optimization idea inspired by what I think iced wgpu renderer may be doing
@@ -347,6 +349,7 @@ impl IcedRenderer {
                     UiMode::Geometry,
                 ));
             },
+            Primitive::Nothing => {},
         }
     }
 

voxygen/src/ui/ice/renderer/background_container.rs

@@ -1,7 +1,4 @@
-use super::{
-    super::widget::{background_container, image},
-    IcedRenderer, Primitive,
-};
+use super::{super::widget::background_container, IcedRenderer, Primitive};
 use iced::{Element, Layout, Point};
 
 impl background_container::Renderer for IcedRenderer {

voxygen/src/ui/ice/renderer/compound_graphic.rs

@@ -4,7 +4,6 @@ use super::{
 };
 use compound_graphic::GraphicKind;
 use iced::{MouseCursor, Rectangle};
-use vek::Rgba;
 
 impl compound_graphic::Renderer for IcedRenderer {
     fn draw<I>(

voxygen/src/ui/ice/renderer/space.rs

@@ -0,0 +1,8 @@
+use super::{IcedRenderer, Primitive};
+use iced::{space, MouseCursor, Rectangle};
+
+impl space::Renderer for IcedRenderer {
+    fn draw(&mut self, _bounds: Rectangle) -> Self::Output {
+        (Primitive::Nothing, MouseCursor::OutOfBounds)
+    }
+}

voxygen/src/ui/ice/widget/background_container.rs

@@ -195,7 +195,6 @@ where
             } else {
                 limits.max_height((max_width / aspect_ratio) as u32)
             };
-            limits;
             // Account for padding at max size in the limits for the children
             let limits = limits.shrink({
                 let max = limits.max();
@@ -204,7 +203,6 @@ where
                     max.height * vertical_pad_frac,
                 )
             });
-            limits;
 
             // Get content size
             // again, why is loose() used here?
@@ -221,7 +219,7 @@ where
             let size = if content_aspect_ratio > aspect_ratio {
                 Size::new(content_size.width, content_size.width / aspect_ratio)
             } else {
-                Size::new(content_size.height * aspect_ratio, content_size.width)
+                Size::new(content_size.height * aspect_ratio, content_size.height)
             };
 
             // Move content to account for padding
@@ -229,7 +227,6 @@ where
                 left_pad_frac * size.width,
                 top_pad_frac * size.height,
             ));
-            size;
 
             (size, content)
         } else {

voxygen/src/ui/ice/widget/compound_graphic.rs

@@ -70,7 +70,7 @@ pub struct CompoundGraphic {
 }
 
 impl CompoundGraphic {
-    pub fn with_graphics(graphics: Vec<Graphic>) -> Self {
+    pub fn from_graphics(graphics: Vec<Graphic>) -> Self {
         let width = Length::Fill;
         let height = Length::Fill;
         let graphics_size = graphics
@@ -89,6 +89,14 @@ impl CompoundGraphic {
         }
     }
 
+    pub fn padded_image(image: Handle, size: [u16; 2], pad: [u16; 4]) -> Self {
+        let image = Graphic::image(image, size, [pad[0], pad[1]]);
+        let mut this = Self::from_graphics(vec![image]);
+        this.graphics_size[0] += pad[2];
+        this.graphics_size[1] += pad[3];
+        this
+    }
+
     pub fn width(mut self, width: Length) -> Self {
         self.width = width;
         self