Implement padding support for Container

examples/clock/src/main.rs

@@ -66,6 +66,7 @@ impl Application for Clock {
         Container::new(canvas)
             .width(Length::Fill)
             .height(Length::Fill)
+            .padding(20)
             .center_x()
             .center_y()
             .into()

examples/pane_grid/src/main.rs

@@ -106,11 +106,10 @@ impl Sandbox for Example {
             .on_resize(Message::Resized)
             .on_key_press(handle_hotkey);
 
-        Column::new()
+        Container::new(pane_grid)
             .width(Length::Fill)
             .height(Length::Fill)
             .padding(10)
-            .push(pane_grid)
             .into()
     }
 }
@@ -213,9 +212,10 @@ impl Content {
             .push(Text::new(format!("Pane {}", id)).size(30))
             .push(controls);
 
-        Container::new(Column::new().padding(5).push(content))
+        Container::new(content)
             .width(Length::Fill)
             .height(Length::Fill)
+            .padding(5)
             .center_y()
             .style(style::Pane {
                 is_focused: focus.is_some(),

examples/pokedex/src/main.rs

@@ -225,7 +225,7 @@ enum Error {
 
 impl From<reqwest::Error> for Error {
     fn from(error: reqwest::Error) -> Error {
-        dbg!(&error);
+        dbg!(error);
 
         Error::APIError
     }

examples/svg/src/main.rs

@@ -1,4 +1,4 @@
-use iced::{Column, Container, Element, Length, Sandbox, Settings, Svg};
+use iced::{Container, Element, Length, Sandbox, Settings, Svg};
 
 pub fn main() {
     env_logger::init();
@@ -23,18 +23,17 @@ impl Sandbox for Tiger {
     fn update(&mut self, _message: ()) {}
 
     fn view(&mut self) -> Element<()> {
-        let content = Column::new().padding(20).push(
-            Svg::new(format!(
-                "{}/resources/tiger.svg",
-                env!("CARGO_MANIFEST_DIR")
-            ))
-            .width(Length::Fill)
-            .height(Length::Fill),
-        );
+        let svg = Svg::new(format!(
+            "{}/resources/tiger.svg",
+            env!("CARGO_MANIFEST_DIR")
+        ))
+        .width(Length::Fill)
+        .height(Length::Fill);
 
-        Container::new(content)
+        Container::new(svg)
             .width(Length::Fill)
             .height(Length::Fill)
+            .padding(20)
             .center_x()
             .center_y()
             .into()

native/src/layout/flex.rs

@@ -171,8 +171,5 @@ where
     let (width, height) = axis.pack(main - padding, cross);
     let size = limits.resolve(Size::new(width, height));
 
-    Node::with_children(
-        Size::new(size.width + padding * 2.0, size.height + padding * 2.0),
-        nodes,
-    )
+    Node::with_children(size.pad(padding), nodes)
 }

native/src/widget/container.rs

@@ -13,6 +13,7 @@ use std::u32;
 /// It is normally used for alignment purposes.
 #[allow(missing_debug_implementations)]
 pub struct Container<'a, Message, Renderer: self::Renderer> {
+    padding: u16,
     width: Length,
     height: Length,
     max_width: u32,
@@ -35,6 +36,7 @@ where
         T: Into<Element<'a, Message, Renderer>>,
     {
         Container {
+            padding: 0,
             width: Length::Shrink,
             height: Length::Shrink,
             max_width: u32::MAX,
@@ -46,6 +48,14 @@ where
         }
     }
 
+    /// Sets the padding of the [`Container`].
+    ///
+    /// [`Container`]: struct.Column.html
+    pub fn padding(mut self, units: u16) -> Self {
+        self.padding = units;
+        self
+    }
+
     /// Sets the width of the [`Container`].
     ///
     /// [`Container`]: struct.Container.html
@@ -137,19 +147,23 @@ where
         renderer: &Renderer,
         limits: &layout::Limits,
     ) -> layout::Node {
+        let padding = f32::from(self.padding);
+
         let limits = limits
             .loose()
             .max_width(self.max_width)
             .max_height(self.max_height)
             .width(self.width)
-            .height(self.height);
+            .height(self.height)
+            .pad(padding);
 
         let mut content = self.content.layout(renderer, &limits.loose());
         let size = limits.resolve(content.size());
 
+        content.move_to(Point::new(padding, padding));
         content.align(self.horizontal_alignment, self.vertical_alignment, size);
 
-        layout::Node::with_children(size, vec![content])
+        layout::Node::with_children(size.pad(padding), vec![content])
     }
 
     fn on_event(
@@ -191,6 +205,7 @@ where
     fn hash_layout(&self, state: &mut Hasher) {
         std::any::TypeId::of::<Container<'_, (), Renderer>>().hash(state);
 
+        self.padding.hash(state);
         self.width.hash(state);
         self.height.hash(state);
         self.max_width.hash(state);

web/src/widget/container.rs

@@ -8,6 +8,7 @@ pub use iced_style::container::{Style, StyleSheet};
 /// It is normally used for alignment purposes.
 #[allow(missing_debug_implementations)]
 pub struct Container<'a, Message> {
+    padding: u16,
     width: Length,
     height: Length,
     max_width: u32,
@@ -29,6 +30,7 @@ impl<'a, Message> Container<'a, Message> {
         use std::u32;
 
         Container {
+            padding: 0,
             width: Length::Shrink,
             height: Length::Shrink,
             max_width: u32::MAX,
@@ -40,6 +42,14 @@ impl<'a, Message> Container<'a, Message> {
         }
     }
 
+    /// Sets the padding of the [`Container`].
+    ///
+    /// [`Container`]: struct.Column.html
+    pub fn padding(mut self, units: u16) -> Self {
+        self.padding = units;
+        self
+    }
+
     /// Sets the width of the [`Container`].
     ///
     /// [`Container`]: struct.Container.html
@@ -113,12 +123,15 @@ where
 
         let column_class = style_sheet.insert(bump, css::Rule::Column);
 
+        let padding_class =
+            style_sheet.insert(bump, css::Rule::Padding(self.padding));
+
         let style = self.style_sheet.style();
 
         let node = div(bump)
             .attr(
                 "class",
-                bumpalo::format!(in bump, "{}", column_class).into_bump_str(),
+                bumpalo::format!(in bump, "{} {}", column_class, padding_class).into_bump_str(),
             )
             .attr(
                 "style",