Improve tour example

12 files changed, 93 insertions, 48 deletions

diff --git a/src/lib.rs b/src/lib.rs
index 88a5e81e..c1c18b41 100644
--- a/src/lib.rs
+++ b/src/lib.rs
@@ -97,7 +97,7 @@
 //! #     }
 //! #
 //! #     impl text::Renderer<[f32; 4]> for Renderer {
-//! #         fn node(&self, style: Style, _content: &str, _size: f32) -> Node {
+//! #         fn node(&self, style: Style, _content: &str, _size: Option<u16>) -> Node {
 //! #             Node::new(style)
 //! #         }
 //! #
@@ -105,7 +105,7 @@
 //! #             &mut self,
 //! #             _bounds: Rectangle,
 //! #             _content: &str,
-//! #             _size: f32,
+//! #             _size: Option<u16>,
 //! #             _color: Option<[f32; 4]>,
 //! #             _horizontal_alignment: HorizontalAlignment,
 //! #             _vertical_alignment: VerticalAlignment,
diff --git a/src/style.rs b/src/style.rs
index 9e1f7df2..575ea366 100644
--- a/src/style.rs
+++ b/src/style.rs
@@ -11,7 +11,7 @@ impl Style {
     /// Defines the width of a [`Node`] in pixels.
     ///
     /// [`Node`]: struct.Node.html
-    pub fn width(mut self, width: u32) -> Self {
+    pub fn width(mut self, width: u16) -> Self {
         self.0.size.width = style::Dimension::Points(width as f32);
         self
     }
@@ -19,7 +19,7 @@ impl Style {
     /// Defines the height of a [`Node`] in pixels.
     ///
     /// [`Node`]: struct.Node.html
-    pub fn height(mut self, height: u32) -> Self {
+    pub fn height(mut self, height: u16) -> Self {
         self.0.size.height = style::Dimension::Points(height as f32);
         self
     }
@@ -27,7 +27,7 @@ impl Style {
     /// Defines the minimum width of a [`Node`] in pixels.
     ///
     /// [`Node`]: struct.Node.html
-    pub fn min_width(mut self, min_width: u32) -> Self {
+    pub fn min_width(mut self, min_width: u16) -> Self {
         self.0.min_size.width = style::Dimension::Points(min_width as f32);
         self
     }
@@ -35,7 +35,7 @@ impl Style {
     /// Defines the maximum width of a [`Node`] in pixels.
     ///
     /// [`Node`]: struct.Node.html
-    pub fn max_width(mut self, max_width: u32) -> Self {
+    pub fn max_width(mut self, max_width: u16) -> Self {
         self.0.max_size.width = style::Dimension::Points(max_width as f32);
         self.fill_width()
     }
@@ -43,16 +43,18 @@ impl Style {
     /// Defines the minimum height of a [`Node`] in pixels.
     ///
     /// [`Node`]: struct.Node.html
-    pub fn min_height(mut self, min_height: u32) -> Self {
-        self.0.min_size.height = style::Dimension::Points(min_height as f32);
+    pub fn min_height(mut self, min_height: u16) -> Self {
+        self.0.min_size.height =
+            style::Dimension::Points(f32::from(min_height));
         self
     }
 
     /// Defines the maximum height of a [`Node`] in pixels.
     ///
     /// [`Node`]: struct.Node.html
-    pub fn max_height(mut self, max_height: u32) -> Self {
-        self.0.max_size.height = style::Dimension::Points(max_height as f32);
+    pub fn max_height(mut self, max_height: u16) -> Self {
+        self.0.max_size.height =
+            style::Dimension::Points(f32::from(max_height));
         self.fill_height()
     }
 
@@ -100,7 +102,7 @@ impl Style {
     /// Sets the padding of a [`Node`] in pixels.
     ///
     /// [`Node`]: struct.Node.html
-    pub fn padding(mut self, px: u32) -> Self {
+    pub fn padding(mut self, px: u16) -> Self {
         self.0.padding = stretch::geometry::Rect {
             start: style::Dimension::Points(px as f32),
             end: style::Dimension::Points(px as f32),
diff --git a/src/widget.rs b/src/widget.rs
index b8ecb409..30606934 100644
--- a/src/widget.rs
+++ b/src/widget.rs
@@ -26,16 +26,16 @@ mod row;
 pub mod button;
 pub mod checkbox;
 pub mod image;
-pub mod progress_bar;
+//pub mod progress_bar;
 pub mod radio;
 pub mod slider;
 pub mod text;
 
 pub use button::Button;
 pub use checkbox::Checkbox;
-pub use image::Image;
 pub use column::Column;
-pub use progress_bar::ProgressBar;
+pub use image::Image;
+//pub use progress_bar::ProgressBar;
 pub use radio::Radio;
 pub use row::Row;
 pub use slider::Slider;
diff --git a/src/widget/button.rs b/src/widget/button.rs
index 14fd3852..abcdbfeb 100644
--- a/src/widget/button.rs
+++ b/src/widget/button.rs
@@ -83,7 +83,7 @@ impl<'a, Message> Button<'a, Message> {
     /// Sets the width of the [`Button`] in pixels.
     ///
     /// [`Button`]: struct.Button.html
-    pub fn width(mut self, width: u32) -> Self {
+    pub fn width(mut self, width: u16) -> Self {
         self.style = self.style.width(width);
         self
     }
diff --git a/src/widget/checkbox.rs b/src/widget/checkbox.rs
index 34d5df53..c60807fd 100644
--- a/src/widget/checkbox.rs
+++ b/src/widget/checkbox.rs
@@ -142,7 +142,7 @@ where
             renderer,
             text_bounds,
             &self.label,
-            20.0,
+            None,
             self.label_color,
             text::HorizontalAlignment::Left,
             text::VerticalAlignment::Top,
diff --git a/src/widget/column.rs b/src/widget/column.rs
index 903de897..ff754e98 100644
--- a/src/widget/column.rs
+++ b/src/widget/column.rs
@@ -55,7 +55,7 @@ impl<'a, Message, Renderer> Column<'a, Message, Renderer> {
     /// Sets the padding of the [`Column`] in pixels.
     ///
     /// [`Column`]: struct.Column.html
-    pub fn padding(mut self, px: u32) -> Self {
+    pub fn padding(mut self, px: u16) -> Self {
         self.style = self.style.padding(px);
         self
     }
@@ -63,7 +63,7 @@ impl<'a, Message, Renderer> Column<'a, Message, Renderer> {
     /// Sets the width of the [`Column`] in pixels.
     ///
     /// [`Column`]: struct.Column.html
-    pub fn width(mut self, width: u32) -> Self {
+    pub fn width(mut self, width: u16) -> Self {
         self.style = self.style.width(width);
         self
     }
@@ -71,7 +71,7 @@ impl<'a, Message, Renderer> Column<'a, Message, Renderer> {
     /// Sets the height of the [`Column`] in pixels.
     ///
     /// [`Column`]: struct.Column.html
-    pub fn height(mut self, height: u32) -> Self {
+    pub fn height(mut self, height: u16) -> Self {
         self.style = self.style.height(height);
         self
     }
@@ -79,7 +79,7 @@ impl<'a, Message, Renderer> Column<'a, Message, Renderer> {
     /// Sets the maximum width of the [`Column`] in pixels.
     ///
     /// [`Column`]: struct.Column.html
-    pub fn max_width(mut self, max_width: u32) -> Self {
+    pub fn max_width(mut self, max_width: u16) -> Self {
         self.style = self.style.max_width(max_width);
         self
     }
@@ -87,7 +87,7 @@ impl<'a, Message, Renderer> Column<'a, Message, Renderer> {
     /// Sets the maximum height of the [`Column`] in pixels.
     ///
     /// [`Column`]: struct.Column.html
-    pub fn max_height(mut self, max_height: u32) -> Self {
+    pub fn max_height(mut self, max_height: u16) -> Self {
         self.style = self.style.max_height(max_height);
         self
     }
diff --git a/src/widget/image.rs b/src/widget/image.rs
index 8cbcd02c..161dc963 100644
--- a/src/widget/image.rs
+++ b/src/widget/image.rs
@@ -1,7 +1,8 @@
 //! Display images in your user interface.
 
 use crate::{
-    Element, Hasher, Layout, MouseCursor, Node, Point, Rectangle, Style, Widget,
+    Align, Element, Hasher, Layout, MouseCursor, Node, Point, Rectangle, Style,
+    Widget,
 };
 
 use std::hash::Hash;
@@ -25,6 +26,8 @@ use std::hash::Hash;
 pub struct Image<I> {
     image: I,
     source: Option<Rectangle<u16>>,
+    width: Option<u16>,
+    height: Option<u16>,
     style: Style,
 }
 
@@ -32,6 +35,8 @@ impl<I> std::fmt::Debug for Image<I> {
     fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
         f.debug_struct("Image")
             .field("source", &self.source)
+            .field("width", &self.width)
+            .field("height", &self.height)
             .field("style", &self.style)
             .finish()
     }
@@ -45,7 +50,9 @@ impl<I> Image<I> {
         Image {
             image,
             source: None,
-            style: Style::default().fill_width().fill_height(),
+            width: None,
+            height: None,
+            style: Style::default(),
         }
     }
 
@@ -60,16 +67,27 @@ impl<I> Image<I> {
     /// Sets the width of the [`Image`] boundaries in pixels.
     ///
     /// [`Image`]: struct.Image.html
-    pub fn width(mut self, width: u32) -> Self {
-        self.style = self.style.width(width);
+    pub fn width(mut self, width: u16) -> Self {
+        self.width = Some(width);
         self
     }
 
     /// Sets the height of the [`Image`] boundaries in pixels.
     ///
     /// [`Image`]: struct.Image.html
-    pub fn height(mut self, height: u32) -> Self {
-        self.style = self.style.height(height);
+    pub fn height(mut self, height: u16) -> Self {
+        self.height = Some(height);
+        self
+    }
+
+    /// Sets the alignment of the [`Image`] itself.
+    ///
+    /// This is useful if you want to override the default alignment given by
+    /// the parent container.
+    ///
+    /// [`Image`]: struct.Button.html
+    pub fn align_self(mut self, align: Align) -> Self {
+        self.style = self.style.align_self(align);
         self
     }
 }
@@ -79,8 +97,14 @@ where
     Renderer: self::Renderer<I>,
     I: Clone,
 {
-    fn node(&self, _renderer: &Renderer) -> Node {
-        Node::new(self.style)
+    fn node(&self, renderer: &Renderer) -> Node {
+        renderer.node(
+            self.style,
+            &self.image,
+            self.width,
+            self.height,
+            self.source,
+        )
     }
 
     fn draw(
@@ -89,13 +113,15 @@ where
         layout: Layout<'_>,
         _cursor_position: Point,
     ) -> MouseCursor {
-        renderer.draw(layout.bounds(), self.image.clone(), self.source);
+        renderer.draw(&self.image, layout.bounds(), self.source);
 
         MouseCursor::OutOfBounds
     }
 
     fn hash_layout(&self, state: &mut Hasher) {
         self.style.hash(state);
+        self.width.hash(state);
+        self.height.hash(state);
     }
 }
 
@@ -107,6 +133,23 @@ where
 /// [`Image`]: struct.Image.html
 /// [renderer]: ../../renderer/index.html
 pub trait Renderer<I> {
+    /// Creates a [`Node`] with the given [`Style`] for the provided [`Image`]
+    /// and its size.
+    ///
+    /// You should probably keep the original aspect ratio, if possible.
+    ///
+    /// [`Node`]: ../../struct.Node.html
+    /// [`Style`]: ../../struct.Style.html
+    /// [`Image`]: struct.Image.html
+    fn node(
+        &self,
+        style: Style,
+        image: &I,
+        width: Option<u16>,
+        height: Option<u16>,
+        source: Option<Rectangle<u16>>,
+    ) -> Node;
+
     /// Draws an [`Image`].
     ///
     /// It receives:
@@ -118,8 +161,8 @@ pub trait Renderer<I> {
     /// [`Image`]: struct.Image.html
     fn draw(
         &mut self,
+        image: &I,
         bounds: Rectangle<f32>,
-        image: I,
         source: Option<Rectangle<u16>>,
     );
 }
diff --git a/src/widget/progress_bar.rs b/src/widget/progress_bar.rs
index 645c7277..d4499160 100644
--- a/src/widget/progress_bar.rs
+++ b/src/widget/progress_bar.rs
@@ -47,7 +47,7 @@ impl ProgressBar {
     /// Sets the width of the [`ProgressBar`] in pixels.
     ///
     /// [`ProgressBar`]: struct.ProgressBar.html
-    pub fn width(mut self, width: u32) -> Self {
+    pub fn width(mut self, width: u16) -> Self {
         self.style = self.style.width(width);
         self
     }
diff --git a/src/widget/radio.rs b/src/widget/radio.rs
index a59d52aa..28353ef4 100644
--- a/src/widget/radio.rs
+++ b/src/widget/radio.rs
@@ -152,7 +152,7 @@ where
             renderer,
             text_bounds,
             &self.label,
-            20.0,
+            None,
             self.label_color,
             text::HorizontalAlignment::Left,
             text::VerticalAlignment::Top,
diff --git a/src/widget/row.rs b/src/widget/row.rs
index 7b7033a1..959528dc 100644
--- a/src/widget/row.rs
+++ b/src/widget/row.rs
@@ -52,7 +52,7 @@ impl<'a, Message, Renderer> Row<'a, Message, Renderer> {
     /// Sets the padding of the [`Row`] in pixels.
     ///
     /// [`Row`]: struct.Row.html
-    pub fn padding(mut self, px: u32) -> Self {
+    pub fn padding(mut self, px: u16) -> Self {
         self.style = self.style.padding(px);
         self
     }
@@ -60,7 +60,7 @@ impl<'a, Message, Renderer> Row<'a, Message, Renderer> {
     /// Sets the width of the [`Row`] in pixels.
     ///
     /// [`Row`]: struct.Row.html
-    pub fn width(mut self, width: u32) -> Self {
+    pub fn width(mut self, width: u16) -> Self {
         self.style = self.style.width(width);
         self
     }
@@ -68,7 +68,7 @@ impl<'a, Message, Renderer> Row<'a, Message, Renderer> {
     /// Sets the height of the [`Row`] in pixels.
     ///
     /// [`Row`]: struct.Row.html
-    pub fn height(mut self, height: u32) -> Self {
+    pub fn height(mut self, height: u16) -> Self {
         self.style = self.style.height(height);
         self
     }
@@ -76,7 +76,7 @@ impl<'a, Message, Renderer> Row<'a, Message, Renderer> {
     /// Sets the maximum width of the [`Row`] in pixels.
     ///
     /// [`Row`]: struct.Row.html
-    pub fn max_width(mut self, max_width: u32) -> Self {
+    pub fn max_width(mut self, max_width: u16) -> Self {
         self.style = self.style.max_width(max_width);
         self
     }
@@ -84,7 +84,7 @@ impl<'a, Message, Renderer> Row<'a, Message, Renderer> {
     /// Sets the maximum height of the [`Row`] in pixels.
     ///
     /// [`Row`]: struct.Row.html
-    pub fn max_height(mut self, max_height: u32) -> Self {
+    pub fn max_height(mut self, max_height: u16) -> Self {
         self.style = self.style.max_height(max_height);
         self
     }
diff --git a/src/widget/slider.rs b/src/widget/slider.rs
index c7adbb51..cdec9ec4 100644
--- a/src/widget/slider.rs
+++ b/src/widget/slider.rs
@@ -93,7 +93,7 @@ impl<'a, Message> Slider<'a, Message> {
     /// Sets the width of the [`Slider`] in pixels.
     ///
     /// [`Slider`]: struct.Slider.html
-    pub fn width(mut self, width: u32) -> Self {
+    pub fn width(mut self, width: u16) -> Self {
         self.style = self.style.width(width);
         self
     }
diff --git a/src/widget/text.rs b/src/widget/text.rs
index 7b62e5cb..59b599bb 100644
--- a/src/widget/text.rs
+++ b/src/widget/text.rs
@@ -30,7 +30,7 @@ use std::hash::Hash;
 #[derive(Debug, Clone)]
 pub struct Text<Color> {
     content: String,
-    size: u16,
+    size: Option<u16>,
     color: Option<Color>,
     style: Style,
     horizontal_alignment: HorizontalAlignment,
@@ -44,7 +44,7 @@ impl<Color> Text<Color> {
     pub fn new(label: &str) -> Self {
         Text {
             content: String::from(label),
-            size: 20,
+            size: None,
             color: None,
             style: Style::default().fill_width(),
             horizontal_alignment: HorizontalAlignment::Left,
@@ -56,7 +56,7 @@ impl<Color> Text<Color> {
     ///
     /// [`Text`]: struct.Text.html
     pub fn size(mut self, size: u16) -> Self {
-        self.size = size;
+        self.size = Some(size);
         self
     }
 
@@ -71,7 +71,7 @@ impl<Color> Text<Color> {
     /// Sets the width of the [`Text`] boundaries in pixels.
     ///
     /// [`Text`]: struct.Text.html
-    pub fn width(mut self, width: u32) -> Self {
+    pub fn width(mut self, width: u16) -> Self {
         self.style = self.style.width(width);
         self
     }
@@ -79,7 +79,7 @@ impl<Color> Text<Color> {
     /// Sets the height of the [`Text`] boundaries in pixels.
     ///
     /// [`Text`]: struct.Text.html
-    pub fn height(mut self, height: u32) -> Self {
+    pub fn height(mut self, height: u16) -> Self {
         self.style = self.style.height(height);
         self
     }
@@ -112,7 +112,7 @@ where
     Renderer: self::Renderer<Color>,
 {
     fn node(&self, renderer: &Renderer) -> Node {
-        renderer.node(self.style, &self.content, f32::from(self.size))
+        renderer.node(self.style, &self.content, self.size)
     }
 
     fn draw(
@@ -124,7 +124,7 @@ where
         renderer.draw(
             layout.bounds(),
             &self.content,
-            f32::from(self.size),
+            self.size,
             self.color,
             self.horizontal_alignment,
             self.vertical_alignment,
@@ -160,7 +160,7 @@ pub trait Renderer<Color> {
     /// [`Style`]: ../../struct.Style.html
     /// [`Text`]: struct.Text.html
     /// [`Node::with_measure`]: ../../struct.Node.html#method.with_measure
-    fn node(&self, style: Style, content: &str, size: f32) -> Node;
+    fn node(&self, style: Style, content: &str, size: Option<u16>) -> Node;
 
     /// Draws a [`Text`] fragment.
     ///
@@ -179,7 +179,7 @@ pub trait Renderer<Color> {
         &mut self,
         bounds: Rectangle,
         content: &str,
-        size: f32,
+        size: Option<u16>,
         color: Option<Color>,
         horizontal_alignment: HorizontalAlignment,
         vertical_alignment: VerticalAlignment,