diff --git a/core/src/lib.rs b/core/src/lib.rs index f2d21a5f..6453d599 100644 --- a/core/src/lib.rs +++ b/core/src/lib.rs @@ -22,6 +22,7 @@ mod background; mod color; mod font; mod length; +mod padding; mod point; mod rectangle; mod size; @@ -32,6 +33,7 @@ pub use background::Background; pub use color::Color; pub use font::Font; pub use length::Length; +pub use padding::Padding; pub use point::Point; pub use rectangle::Rectangle; pub use size::Size; diff --git a/core/src/padding.rs b/core/src/padding.rs new file mode 100644 index 00000000..22467d6b --- /dev/null +++ b/core/src/padding.rs @@ -0,0 +1,107 @@ +/// An amount of space to pad for each side of a box +/// +/// You can leverage the `From` trait to build [`Padding`] conveniently: +/// +/// ``` +/// # use iced_core::Padding; +/// # +/// let padding = Padding::from(20); // 20px on all sides +/// let padding = Padding::from([10, 20]); // top/bottom, left/right +/// let padding = Padding::from([5, 10, 15, 20]); // top, right, bottom, left +/// ``` +/// +/// Normally, the `padding` method of a widget will ask for an `Into`, +/// so you can easily write: +/// +/// ``` +/// # use iced_core::Padding; +/// # +/// # struct Widget; +/// # +/// impl Widget { +/// # pub fn new() -> Self { Self } +/// # +/// pub fn padding(mut self, padding: impl Into) -> Self { +/// // ... +/// self +/// } +/// } +/// +/// let widget = Widget::new().padding(20); // 20px on all sides +/// let widget = Widget::new().padding([10, 20]); // top/bottom, left/right +/// let widget = Widget::new().padding([5, 10, 15, 20]); // top, right, bottom, left +/// ``` +#[derive(Debug, Hash, Copy, Clone)] +pub struct Padding { + /// Top padding + pub top: u16, + /// Right padding + pub right: u16, + /// Bottom padding + pub bottom: u16, + /// Left padding + pub left: u16, +} + +impl Padding { + /// Padding of zero + pub const ZERO: Padding = Padding { + top: 0, + right: 0, + bottom: 0, + left: 0, + }; + + /// Create a Padding that is equal on all sides + pub const fn new(padding: u16) -> Padding { + Padding { + top: padding, + right: padding, + bottom: padding, + left: padding, + } + } + + /// Returns the total amount of vertical [`Padding`]. + pub fn vertical(self) -> u16 { + self.top + self.bottom + } + + /// Returns the total amount of horizontal [`Padding`]. + pub fn horizontal(self) -> u16 { + self.left + self.right + } +} + +impl std::convert::From for Padding { + fn from(p: u16) -> Self { + Padding { + top: p, + right: p, + bottom: p, + left: p, + } + } +} + +impl std::convert::From<[u16; 2]> for Padding { + fn from(p: [u16; 2]) -> Self { + Padding { + top: p[0], + right: p[1], + bottom: p[0], + left: p[1], + } + } +} + +impl std::convert::From<[u16; 4]> for Padding { + fn from(p: [u16; 4]) -> Self { + Padding { + top: p[0], + right: p[1], + bottom: p[2], + left: p[3], + } + } +} diff --git a/core/src/size.rs b/core/src/size.rs index 9ea9e686..6745c6c8 100644 --- a/core/src/size.rs +++ b/core/src/size.rs @@ -1,4 +1,4 @@ -use crate::Vector; +use crate::{Padding, Vector}; use std::f32; /// An amount of space in 2 dimensions. @@ -28,10 +28,10 @@ impl Size { pub const INFINITY: Size = Size::new(f32::INFINITY, f32::INFINITY); /// Increments the [`Size`] to account for the given padding. - pub fn pad(&self, padding: f32) -> Self { + pub fn pad(&self, padding: Padding) -> Self { Size { - width: self.width + padding * 2.0, - height: self.height + padding * 2.0, + width: self.width + padding.horizontal() as f32, + height: self.height + padding.vertical() as f32, } } } diff --git a/graphics/src/overlay/menu.rs b/graphics/src/overlay/menu.rs index ffe998c5..9e91a0ef 100644 --- a/graphics/src/overlay/menu.rs +++ b/graphics/src/overlay/menu.rs @@ -2,8 +2,8 @@ use crate::backend::{self, Backend}; use crate::{Primitive, Renderer}; use iced_native::{ - mouse, overlay, Color, Font, HorizontalAlignment, Point, Rectangle, - VerticalAlignment, + mouse, overlay, Color, Font, HorizontalAlignment, Padding, Point, + Rectangle, VerticalAlignment, }; pub use iced_style::menu::Style; @@ -45,7 +45,7 @@ where viewport: &Rectangle, options: &[T], hovered_option: Option, - padding: u16, + padding: Padding, text_size: u16, font: Font, style: &Style, @@ -53,7 +53,7 @@ where use std::f32; let is_mouse_over = bounds.contains(cursor_position); - let option_height = text_size as usize + padding as usize * 2; + let option_height = (text_size + padding.vertical()) as usize; let mut primitives = Vec::new(); @@ -72,7 +72,7 @@ where x: bounds.x, y: bounds.y + (option_height * i) as f32, width: bounds.width, - height: f32::from(text_size + padding * 2), + height: f32::from(text_size + padding.vertical()), }; if is_selected { @@ -88,7 +88,7 @@ where primitives.push(Primitive::Text { content: option.to_string(), bounds: Rectangle { - x: bounds.x + f32::from(padding), + x: bounds.x + padding.left as f32, y: bounds.center_y(), width: f32::INFINITY, ..bounds diff --git a/graphics/src/widget/button.rs b/graphics/src/widget/button.rs index 2e3f78ca..60400ed8 100644 --- a/graphics/src/widget/button.rs +++ b/graphics/src/widget/button.rs @@ -5,7 +5,7 @@ use crate::defaults::{self, Defaults}; use crate::{Backend, Primitive, Renderer}; use iced_native::mouse; use iced_native::{ - Background, Color, Element, Layout, Point, Rectangle, Vector, + Background, Color, Element, Layout, Padding, Point, Rectangle, Vector, }; pub use iced_native::button::State; @@ -21,7 +21,7 @@ impl iced_native::button::Renderer for Renderer where B: Backend, { - const DEFAULT_PADDING: u16 = 5; + const DEFAULT_PADDING: Padding = Padding::new(5); type Style = Box; diff --git a/graphics/src/widget/pick_list.rs b/graphics/src/widget/pick_list.rs index f42a8707..32dfbdf9 100644 --- a/graphics/src/widget/pick_list.rs +++ b/graphics/src/widget/pick_list.rs @@ -2,7 +2,8 @@ use crate::backend::{self, Backend}; use crate::{Primitive, Renderer}; use iced_native::{ - mouse, Font, HorizontalAlignment, Point, Rectangle, VerticalAlignment, + mouse, Font, HorizontalAlignment, Padding, Point, Rectangle, + VerticalAlignment, }; use iced_style::menu; @@ -19,7 +20,7 @@ where { type Style = Box; - const DEFAULT_PADDING: u16 = 5; + const DEFAULT_PADDING: Padding = Padding::new(5); fn menu_style(style: &Box) -> menu::Style { style.menu() @@ -30,7 +31,7 @@ where bounds: Rectangle, cursor_position: Point, selected: Option, - padding: u16, + padding: Padding, text_size: u16, font: Font, style: &Box, @@ -56,7 +57,7 @@ where font: B::ICON_FONT, size: bounds.height * style.icon_size, bounds: Rectangle { - x: bounds.x + bounds.width - f32::from(padding) * 2.0, + x: bounds.x + bounds.width - f32::from(padding.horizontal()), y: bounds.center_y(), ..bounds }, @@ -74,7 +75,7 @@ where font, color: style.text_color, bounds: Rectangle { - x: bounds.x + f32::from(padding), + x: bounds.x + f32::from(padding.left), y: bounds.center_y(), ..bounds }, diff --git a/graphics/src/widget/tooltip.rs b/graphics/src/widget/tooltip.rs index 1a1b5352..493a6389 100644 --- a/graphics/src/widget/tooltip.rs +++ b/graphics/src/widget/tooltip.rs @@ -5,7 +5,7 @@ use crate::{Primitive, Renderer, Vector}; use iced_native::container; use iced_native::layout::{self, Layout}; -use iced_native::{Element, Point, Rectangle, Size, Text}; +use iced_native::{Element, Padding, Point, Rectangle, Size, Text}; /// An element decorating some content. /// @@ -49,7 +49,6 @@ where use iced_native::Widget; let gap = f32::from(gap); - let padding = f32::from(padding); let style = style_sheet.style(); let defaults = Defaults { @@ -62,9 +61,10 @@ where tooltip, self, &layout::Limits::new(Size::ZERO, viewport.size()) - .pad(f32::from(padding)), + .pad(Padding::new(padding)), ); + let padding = f32::from(padding); let text_bounds = text_layout.bounds(); let x_center = bounds.x + (bounds.width - text_bounds.width) / 2.0; let y_center = diff --git a/native/src/layout/flex.rs b/native/src/layout/flex.rs index 4f6523fb..3d3ff82c 100644 --- a/native/src/layout/flex.rs +++ b/native/src/layout/flex.rs @@ -16,9 +16,10 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. + use crate::{ layout::{Limits, Node}, - Align, Element, Point, Size, + Align, Element, Padding, Point, Size, }; /// The main axis of a flex layout. @@ -62,7 +63,7 @@ pub fn resolve( axis: Axis, renderer: &Renderer, limits: &Limits, - padding: f32, + padding: Padding, spacing: f32, align_items: Align, items: &[Element<'_, Message, Renderer>], @@ -141,14 +142,15 @@ where } } - let mut main = padding; + let pad = axis.pack(padding.left as f32, padding.top as f32); + let mut main = pad.0; for (i, node) in nodes.iter_mut().enumerate() { if i > 0 { main += spacing; } - let (x, y) = axis.pack(main, padding); + let (x, y) = axis.pack(main, pad.1); node.move_to(Point::new(x, y)); @@ -166,7 +168,7 @@ where main += axis.main(size); } - let (width, height) = axis.pack(main - padding, cross); + let (width, height) = axis.pack(main - pad.0, cross); let size = limits.resolve(Size::new(width, height)); Node::with_children(size.pad(padding), nodes) diff --git a/native/src/layout/limits.rs b/native/src/layout/limits.rs index a7bb5c9c..6d5f6563 100644 --- a/native/src/layout/limits.rs +++ b/native/src/layout/limits.rs @@ -1,4 +1,4 @@ -use crate::{Length, Size}; +use crate::{Length, Padding, Size}; /// A set of size constraints for layouting. #[derive(Debug, Clone, Copy)] @@ -117,8 +117,11 @@ impl Limits { } /// Shrinks the current [`Limits`] to account for the given padding. - pub fn pad(&self, padding: f32) -> Limits { - self.shrink(Size::new(padding * 2.0, padding * 2.0)) + pub fn pad(&self, padding: Padding) -> Limits { + self.shrink(Size::new( + padding.horizontal() as f32, + padding.vertical() as f32, + )) } /// Shrinks the current [`Limits`] by the given [`Size`]. diff --git a/native/src/lib.rs b/native/src/lib.rs index 20bbb1d0..cd214e36 100644 --- a/native/src/lib.rs +++ b/native/src/lib.rs @@ -61,8 +61,8 @@ mod debug; mod debug; pub use iced_core::{ - Align, Background, Color, Font, HorizontalAlignment, Length, Point, - Rectangle, Size, Vector, VerticalAlignment, + Align, Background, Color, Font, HorizontalAlignment, Length, Padding, + Point, Rectangle, Size, Vector, VerticalAlignment, }; pub use iced_futures::{executor, futures, Command}; diff --git a/native/src/overlay/menu.rs b/native/src/overlay/menu.rs index afb17bd3..f62dcb46 100644 --- a/native/src/overlay/menu.rs +++ b/native/src/overlay/menu.rs @@ -8,8 +8,8 @@ use crate::scrollable; use crate::text; use crate::touch; use crate::{ - Clipboard, Container, Element, Hasher, Layout, Length, Point, Rectangle, - Scrollable, Size, Vector, Widget, + Clipboard, Container, Element, Hasher, Layout, Length, Padding, Point, + Rectangle, Scrollable, Size, Vector, Widget, }; /// A list of selectable options. @@ -20,7 +20,7 @@ pub struct Menu<'a, T, Renderer: self::Renderer> { hovered_option: &'a mut Option, last_selection: &'a mut Option, width: u16, - padding: u16, + padding: Padding, text_size: Option, font: Renderer::Font, style: ::Style, @@ -45,7 +45,7 @@ where hovered_option, last_selection, width: 0, - padding: 0, + padding: Padding::ZERO, text_size: None, font: Default::default(), style: Default::default(), @@ -58,9 +58,9 @@ where self } - /// Sets the padding of the [`Menu`]. - pub fn padding(mut self, padding: u16) -> Self { - self.padding = padding; + /// Sets the [`Padding`] of the [`Menu`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -261,7 +261,7 @@ struct List<'a, T, Renderer: self::Renderer> { options: &'a [T], hovered_option: &'a mut Option, last_selection: &'a mut Option, - padding: u16, + padding: Padding, text_size: Option, font: Renderer::Font, style: ::Style, @@ -294,7 +294,7 @@ where let size = { let intrinsic = Size::new( 0.0, - f32::from(text_size + self.padding * 2) + f32::from(text_size + self.padding.vertical()) * self.options.len() as f32, ); @@ -345,7 +345,7 @@ where *self.hovered_option = Some( ((cursor_position.y - bounds.y) - / f32::from(text_size + self.padding * 2)) + / f32::from(text_size + self.padding.vertical())) as usize, ); } @@ -359,7 +359,7 @@ where *self.hovered_option = Some( ((cursor_position.y - bounds.y) - / f32::from(text_size + self.padding * 2)) + / f32::from(text_size + self.padding.vertical())) as usize, ); @@ -430,7 +430,7 @@ pub trait Renderer: viewport: &Rectangle, options: &[T], hovered_option: Option, - padding: u16, + padding: Padding, text_size: u16, font: Self::Font, style: &::Style, diff --git a/native/src/renderer/null.rs b/native/src/renderer/null.rs index 9e91d29f..28746585 100644 --- a/native/src/renderer/null.rs +++ b/native/src/renderer/null.rs @@ -1,7 +1,7 @@ use crate::{ button, checkbox, column, container, pane_grid, progress_bar, radio, row, scrollable, slider, text, text_input, Color, Element, Font, - HorizontalAlignment, Layout, Point, Rectangle, Renderer, Size, + HorizontalAlignment, Layout, Padding, Point, Rectangle, Renderer, Size, VerticalAlignment, }; @@ -145,7 +145,7 @@ impl text_input::Renderer for Null { } impl button::Renderer for Null { - const DEFAULT_PADDING: u16 = 0; + const DEFAULT_PADDING: Padding = Padding::ZERO; type Style = (); diff --git a/native/src/widget/button.rs b/native/src/widget/button.rs index 99e98fd1..f61c22d0 100644 --- a/native/src/widget/button.rs +++ b/native/src/widget/button.rs @@ -7,7 +7,8 @@ use crate::mouse; use crate::overlay; use crate::touch; use crate::{ - Clipboard, Element, Hasher, Layout, Length, Point, Rectangle, Widget, + Clipboard, Element, Hasher, Layout, Length, Padding, Point, Rectangle, + Widget, }; use std::hash::Hash; @@ -37,7 +38,7 @@ pub struct Button<'a, Message, Renderer: self::Renderer> { height: Length, min_width: u32, min_height: u32, - padding: u16, + padding: Padding, style: Renderer::Style, } @@ -89,9 +90,9 @@ where self } - /// Sets the padding of the [`Button`]. - pub fn padding(mut self, padding: u16) -> Self { - self.padding = padding; + /// Sets the [`Padding`] of the [`Button`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -140,18 +141,20 @@ where renderer: &Renderer, limits: &layout::Limits, ) -> layout::Node { - let padding = f32::from(self.padding); let limits = limits .min_width(self.min_width) .min_height(self.min_height) .width(self.width) .height(self.height) - .pad(padding); + .pad(self.padding); let mut content = self.content.layout(renderer, &limits); - content.move_to(Point::new(padding, padding)); + content.move_to(Point::new( + self.padding.left.into(), + self.padding.top.into(), + )); - let size = limits.resolve(content.size()).pad(padding); + let size = limits.resolve(content.size()).pad(self.padding); layout::Node::with_children(size, vec![content]) } @@ -258,7 +261,7 @@ where /// [renderer]: crate::renderer pub trait Renderer: crate::Renderer + Sized { /// The default padding of a [`Button`]. - const DEFAULT_PADDING: u16; + const DEFAULT_PADDING: Padding; /// The style supported by this renderer. type Style: Default; diff --git a/native/src/widget/column.rs b/native/src/widget/column.rs index d7f0365a..52a2e80c 100644 --- a/native/src/widget/column.rs +++ b/native/src/widget/column.rs @@ -5,7 +5,8 @@ use crate::event::{self, Event}; use crate::layout; use crate::overlay; use crate::{ - Align, Clipboard, Element, Hasher, Layout, Length, Point, Rectangle, Widget, + Align, Clipboard, Element, Hasher, Layout, Length, Padding, Point, + Rectangle, Widget, }; use std::u32; @@ -14,7 +15,7 @@ use std::u32; #[allow(missing_debug_implementations)] pub struct Column<'a, Message, Renderer> { spacing: u16, - padding: u16, + padding: Padding, width: Length, height: Length, max_width: u32, @@ -35,7 +36,7 @@ impl<'a, Message, Renderer> Column<'a, Message, Renderer> { ) -> Self { Column { spacing: 0, - padding: 0, + padding: Padding::ZERO, width: Length::Shrink, height: Length::Shrink, max_width: u32::MAX, @@ -55,9 +56,9 @@ impl<'a, Message, Renderer> Column<'a, Message, Renderer> { self } - /// Sets the padding of the [`Column`]. - pub fn padding(mut self, units: u16) -> Self { - self.padding = units; + /// Sets the [`Padding`] of the [`Column`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -129,7 +130,7 @@ where layout::flex::Axis::Vertical, renderer, &limits, - self.padding as f32, + self.padding, self.spacing as f32, self.align_items, &self.children, diff --git a/native/src/widget/container.rs b/native/src/widget/container.rs index 69fe699b..69aee64d 100644 --- a/native/src/widget/container.rs +++ b/native/src/widget/container.rs @@ -5,7 +5,8 @@ use crate::event::{self, Event}; use crate::layout; use crate::overlay; use crate::{ - Align, Clipboard, Element, Hasher, Layout, Length, Point, Rectangle, Widget, + Align, Clipboard, Element, Hasher, Layout, Length, Padding, Point, + Rectangle, Widget, }; use std::u32; @@ -15,7 +16,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, + padding: Padding, width: Length, height: Length, max_width: u32, @@ -36,7 +37,7 @@ where T: Into>, { Container { - padding: 0, + padding: Padding::ZERO, width: Length::Shrink, height: Length::Shrink, max_width: u32::MAX, @@ -48,9 +49,9 @@ where } } - /// Sets the padding of the [`Container`]. - pub fn padding(mut self, units: u16) -> Self { - self.padding = units; + /// Sets the [`Padding`] of the [`Container`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -127,23 +128,24 @@ 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) - .pad(padding); + .pad(self.padding); let mut content = self.content.layout(renderer, &limits.loose()); let size = limits.resolve(content.size()); - content.move_to(Point::new(padding, padding)); + content.move_to(Point::new( + self.padding.left.into(), + self.padding.top.into(), + )); content.align(self.horizontal_alignment, self.vertical_alignment, size); - layout::Node::with_children(size.pad(padding), vec![content]) + layout::Node::with_children(size.pad(self.padding), vec![content]) } fn on_event( diff --git a/native/src/widget/pane_grid/title_bar.rs b/native/src/widget/pane_grid/title_bar.rs index 8e42ce38..d9d85dbb 100644 --- a/native/src/widget/pane_grid/title_bar.rs +++ b/native/src/widget/pane_grid/title_bar.rs @@ -2,7 +2,9 @@ use crate::container; use crate::event::{self, Event}; use crate::layout; use crate::pane_grid; -use crate::{Clipboard, Element, Hasher, Layout, Point, Rectangle, Size}; +use crate::{ + Clipboard, Element, Hasher, Layout, Padding, Point, Rectangle, Size, +}; /// The title bar of a [`Pane`]. /// @@ -11,7 +13,7 @@ use crate::{Clipboard, Element, Hasher, Layout, Point, Rectangle, Size}; pub struct TitleBar<'a, Message, Renderer: pane_grid::Renderer> { content: Element<'a, Message, Renderer>, controls: Option>, - padding: u16, + padding: Padding, always_show_controls: bool, style: ::Style, } @@ -28,7 +30,7 @@ where Self { content: content.into(), controls: None, - padding: 0, + padding: Padding::ZERO, always_show_controls: false, style: Default::default(), } @@ -43,9 +45,9 @@ where self } - /// Sets the padding of the [`TitleBar`]. - pub fn padding(mut self, units: u16) -> Self { - self.padding = units; + /// Sets the [`Padding`] of the [`TitleBar`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -161,8 +163,7 @@ where renderer: &Renderer, limits: &layout::Limits, ) -> layout::Node { - let padding = f32::from(self.padding); - let limits = limits.pad(padding); + let limits = limits.pad(self.padding); let max_size = limits.max(); let title_layout = self @@ -192,9 +193,12 @@ where ) }; - node.move_to(Point::new(padding, padding)); + node.move_to(Point::new( + self.padding.left.into(), + self.padding.top.into(), + )); - layout::Node::with_children(node.size().pad(padding), vec![node]) + layout::Node::with_children(node.size().pad(self.padding), vec![node]) } pub(crate) fn on_event( diff --git a/native/src/widget/pick_list.rs b/native/src/widget/pick_list.rs index b17d93a3..92c183f3 100644 --- a/native/src/widget/pick_list.rs +++ b/native/src/widget/pick_list.rs @@ -8,7 +8,8 @@ use crate::scrollable; use crate::text; use crate::touch; use crate::{ - Clipboard, Element, Hasher, Layout, Length, Point, Rectangle, Size, Widget, + Clipboard, Element, Hasher, Layout, Length, Padding, Point, Rectangle, + Size, Widget, }; use std::borrow::Cow; @@ -26,7 +27,7 @@ where options: Cow<'a, [T]>, selected: Option, width: Length, - padding: u16, + padding: Padding, text_size: Option, font: Renderer::Font, style: ::Style, @@ -96,9 +97,9 @@ where self } - /// Sets the padding of the [`PickList`]. - pub fn padding(mut self, padding: u16) -> Self { - self.padding = padding; + /// Sets the [`Padding`] of the [`PickList`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -150,7 +151,7 @@ where let limits = limits .width(self.width) .height(Length::Shrink) - .pad(f32::from(self.padding)); + .pad(self.padding); let text_size = self.text_size.unwrap_or(renderer.default_size()); @@ -179,11 +180,11 @@ where let intrinsic = Size::new( max_width as f32 + f32::from(text_size) - + f32::from(self.padding), + + f32::from(self.padding.left), f32::from(text_size), ); - limits.resolve(intrinsic).pad(f32::from(self.padding)) + limits.resolve(intrinsic).pad(self.padding) }; layout::Node::new(size) @@ -308,7 +309,7 @@ where /// [renderer]: crate::renderer pub trait Renderer: text::Renderer + menu::Renderer { /// The default padding of a [`PickList`]. - const DEFAULT_PADDING: u16; + const DEFAULT_PADDING: Padding; /// The [`PickList`] style supported by this renderer. type Style: Default; @@ -324,7 +325,7 @@ pub trait Renderer: text::Renderer + menu::Renderer { bounds: Rectangle, cursor_position: Point, selected: Option, - padding: u16, + padding: Padding, text_size: u16, font: Self::Font, style: &::Style, diff --git a/native/src/widget/row.rs b/native/src/widget/row.rs index 5634ab12..9ebc9145 100644 --- a/native/src/widget/row.rs +++ b/native/src/widget/row.rs @@ -3,7 +3,8 @@ use crate::event::{self, Event}; use crate::layout; use crate::overlay; use crate::{ - Align, Clipboard, Element, Hasher, Layout, Length, Point, Rectangle, Widget, + Align, Clipboard, Element, Hasher, Layout, Length, Padding, Point, + Rectangle, Widget, }; use std::hash::Hash; @@ -13,7 +14,7 @@ use std::u32; #[allow(missing_debug_implementations)] pub struct Row<'a, Message, Renderer> { spacing: u16, - padding: u16, + padding: Padding, width: Length, height: Length, max_width: u32, @@ -34,7 +35,7 @@ impl<'a, Message, Renderer> Row<'a, Message, Renderer> { ) -> Self { Row { spacing: 0, - padding: 0, + padding: Padding::ZERO, width: Length::Shrink, height: Length::Shrink, max_width: u32::MAX, @@ -54,9 +55,9 @@ impl<'a, Message, Renderer> Row<'a, Message, Renderer> { self } - /// Sets the padding of the [`Row`]. - pub fn padding(mut self, units: u16) -> Self { - self.padding = units; + /// Sets the [`Padding`] of the [`Row`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -128,7 +129,7 @@ where layout::flex::Axis::Horizontal, renderer, &limits, - self.padding as f32, + self.padding, self.spacing as f32, self.align_items, &self.children, diff --git a/native/src/widget/scrollable.rs b/native/src/widget/scrollable.rs index 70ebebe2..7c4ea16c 100644 --- a/native/src/widget/scrollable.rs +++ b/native/src/widget/scrollable.rs @@ -6,7 +6,7 @@ use crate::mouse; use crate::overlay; use crate::touch; use crate::{ - Align, Clipboard, Column, Element, Hasher, Layout, Length, Point, + Align, Clipboard, Column, Element, Hasher, Layout, Length, Padding, Point, Rectangle, Size, Vector, Widget, }; @@ -51,9 +51,9 @@ impl<'a, Message, Renderer: self::Renderer> Scrollable<'a, Message, Renderer> { self } - /// Sets the padding of the [`Scrollable`]. - pub fn padding(mut self, units: u16) -> Self { - self.content = self.content.padding(units); + /// Sets the [`Padding`] of the [`Scrollable`]. + pub fn padding>(mut self, padding: P) -> Self { + self.content = self.content.padding(padding); self } diff --git a/native/src/widget/text_input.rs b/native/src/widget/text_input.rs index de6032b7..20117fa0 100644 --- a/native/src/widget/text_input.rs +++ b/native/src/widget/text_input.rs @@ -18,7 +18,8 @@ use crate::mouse::{self, click}; use crate::text; use crate::touch; use crate::{ - Clipboard, Element, Hasher, Layout, Length, Point, Rectangle, Size, Widget, + Clipboard, Element, Hasher, Layout, Length, Padding, Point, Rectangle, + Size, Widget, }; use std::u32; @@ -56,7 +57,7 @@ pub struct TextInput<'a, Message, Renderer: self::Renderer> { font: Renderer::Font, width: Length, max_width: u32, - padding: u16, + padding: Padding, size: Option, on_change: Box Message>, on_submit: Option, @@ -92,7 +93,7 @@ where font: Default::default(), width: Length::Fill, max_width: u32::MAX, - padding: 0, + padding: Padding::ZERO, size: None, on_change: Box::new(on_change), on_submit: None, @@ -126,9 +127,9 @@ where self } - /// Sets the padding of the [`TextInput`]. - pub fn padding(mut self, units: u16) -> Self { - self.padding = units; + /// Sets the [`Padding`] of the [`TextInput`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -223,19 +224,21 @@ where renderer: &Renderer, limits: &layout::Limits, ) -> layout::Node { - let padding = self.padding as f32; let text_size = self.size.unwrap_or(renderer.default_size()); let limits = limits - .pad(padding) + .pad(self.padding) .width(self.width) .max_width(self.max_width) .height(Length::Units(text_size)); let mut text = layout::Node::new(limits.resolve(Size::ZERO)); - text.move_to(Point::new(padding, padding)); + text.move_to(Point::new( + self.padding.left.into(), + self.padding.top.into(), + )); - layout::Node::with_children(text.size().pad(padding), vec![text]) + layout::Node::with_children(text.size().pad(self.padding), vec![text]) } fn on_event( diff --git a/web/src/css.rs b/web/src/css.rs index bdde23f3..66c363f2 100644 --- a/web/src/css.rs +++ b/web/src/css.rs @@ -1,5 +1,5 @@ //! Style your widgets. -use crate::{bumpalo, Align, Background, Color, Length}; +use crate::{bumpalo, Align, Background, Color, Length, Padding}; use std::collections::BTreeMap; @@ -12,9 +12,6 @@ pub enum Rule { /// Container with horizonal distribution Row, - /// Padding of the container - Padding(u16), - /// Spacing between elements Spacing(u16), } @@ -25,7 +22,6 @@ impl Rule { match self { Rule::Column => String::from("c"), Rule::Row => String::from("r"), - Rule::Padding(padding) => format!("p-{}", padding), Rule::Spacing(spacing) => format!("s-{}", spacing), } } @@ -45,13 +41,6 @@ impl Rule { bumpalo::format!(in bump, ".{} {}", class, body).into_bump_str() } - Rule::Padding(padding) => bumpalo::format!( - in bump, - ".{} {{ box-sizing: border-box; padding: {}px }}", - class, - padding - ) - .into_bump_str(), Rule::Spacing(spacing) => bumpalo::format!( in bump, ".c.{} > * {{ margin-bottom: {}px }} \ @@ -170,3 +159,13 @@ pub fn align(align: Align) -> &'static str { Align::End => "flex-end", } } + +/// Returns the style value for the given [`Padding`]. +/// +/// [`Padding`]: struct.Padding.html +pub fn padding(padding: Padding) -> String { + format!( + "{}px {}px {}px {}px", + padding.top, padding.right, padding.bottom, padding.left + ) +} diff --git a/web/src/lib.rs b/web/src/lib.rs index 4c65dfa3..e4271d58 100644 --- a/web/src/lib.rs +++ b/web/src/lib.rs @@ -75,7 +75,7 @@ pub use element::Element; pub use hasher::Hasher; pub use iced_core::{ keyboard, mouse, Align, Background, Color, Font, HorizontalAlignment, - Length, Point, Rectangle, Size, Vector, VerticalAlignment, + Length, Padding, Point, Rectangle, Size, Vector, VerticalAlignment, }; pub use iced_futures::{executor, futures, Command}; pub use subscription::Subscription; diff --git a/web/src/widget/button.rs b/web/src/widget/button.rs index 7c389a9f..8a36aab9 100644 --- a/web/src/widget/button.rs +++ b/web/src/widget/button.rs @@ -1,7 +1,7 @@ //! Allow your users to perform actions by pressing a button. //! //! A [`Button`] has some local [`State`]. -use crate::{css, Background, Bus, Css, Element, Length, Widget}; +use crate::{css, Background, Bus, Css, Element, Length, Padding, Widget}; pub use iced_style::button::{Style, StyleSheet}; @@ -30,7 +30,7 @@ pub struct Button<'a, Message> { min_width: u32, #[allow(dead_code)] min_height: u32, - padding: u16, + padding: Padding, style: Box, } @@ -48,7 +48,7 @@ impl<'a, Message> Button<'a, Message> { height: Length::Shrink, min_width: 0, min_height: 0, - padding: 5, + padding: Padding::new(5), style: Default::default(), } } @@ -77,9 +77,9 @@ impl<'a, Message> Button<'a, Message> { self } - /// Sets the padding of the [`Button`]. - pub fn padding(mut self, padding: u16) -> Self { - self.padding = padding; + /// Sets the [`Padding`] of the [`Button`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -122,9 +122,6 @@ where // TODO: State-based styling let style = self.style.active(); - let padding_class = - style_sheet.insert(bump, css::Rule::Padding(self.padding)); - let background = match style.background { None => String::from("none"), Some(background) => match background { @@ -132,25 +129,19 @@ where }, }; - let class = { - use dodrio::bumpalo::collections::String; - - String::from_str_in(&padding_class, bump).into_bump_str() - }; - let mut node = button(bump) - .attr("class", class) .attr( "style", bumpalo::format!( in bump, "background: {}; border-radius: {}px; width:{}; \ - min-width: {}; color: {}", + min-width: {}; color: {}; padding: {}", background, style.border_radius, css::length(self.width), css::min_length(self.min_width), - css::color(style.text_color) + css::color(style.text_color), + css::padding(self.padding) ) .into_bump_str(), ) diff --git a/web/src/widget/column.rs b/web/src/widget/column.rs index d832fdcb..8738c2af 100644 --- a/web/src/widget/column.rs +++ b/web/src/widget/column.rs @@ -1,4 +1,4 @@ -use crate::{css, Align, Bus, Css, Element, Length, Widget}; +use crate::{css, Align, Bus, Css, Element, Length, Padding, Widget}; use dodrio::bumpalo; use std::u32; @@ -9,7 +9,7 @@ use std::u32; #[allow(missing_debug_implementations)] pub struct Column<'a, Message> { spacing: u16, - padding: u16, + padding: Padding, width: Length, height: Length, max_width: u32, @@ -28,7 +28,7 @@ impl<'a, Message> Column<'a, Message> { pub fn with_children(children: Vec>) -> Self { Column { spacing: 0, - padding: 0, + padding: Padding::ZERO, width: Length::Fill, height: Length::Shrink, max_width: u32::MAX, @@ -48,9 +48,9 @@ impl<'a, Message> Column<'a, Message> { self } - /// Sets the padding of the [`Column`]. - pub fn padding(mut self, units: u16) -> Self { - self.padding = units; + /// Sets the [`Padding`] of the [`Column`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -114,23 +114,21 @@ impl<'a, Message> Widget for Column<'a, Message> { let spacing_class = style_sheet.insert(bump, css::Rule::Spacing(self.spacing)); - let padding_class = - style_sheet.insert(bump, css::Rule::Padding(self.padding)); - // TODO: Complete styling div(bump) .attr( "class", - bumpalo::format!(in bump, "{} {} {}", column_class, spacing_class, padding_class) + bumpalo::format!(in bump, "{} {}", column_class, spacing_class) .into_bump_str(), ) .attr("style", bumpalo::format!( in bump, - "width: {}; height: {}; max-width: {}; max-height: {}; align-items: {}", + "width: {}; height: {}; max-width: {}; max-height: {}; padding: {}; align-items: {}", css::length(self.width), css::length(self.height), css::max_length(self.max_width), css::max_length(self.max_height), + css::padding(self.padding), css::align(self.align_items) ).into_bump_str() ) diff --git a/web/src/widget/container.rs b/web/src/widget/container.rs index 8de3cc41..c006e011 100644 --- a/web/src/widget/container.rs +++ b/web/src/widget/container.rs @@ -1,5 +1,5 @@ //! Decorate content and apply alignment. -use crate::{bumpalo, css, Align, Bus, Css, Element, Length, Widget}; +use crate::{bumpalo, css, Align, Bus, Css, Element, Length, Padding, Widget}; pub use iced_style::container::{Style, StyleSheet}; @@ -8,7 +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, + padding: Padding, width: Length, height: Length, max_width: u32, @@ -29,7 +29,7 @@ impl<'a, Message> Container<'a, Message> { use std::u32; Container { - padding: 0, + padding: Padding::ZERO, width: Length::Shrink, height: Length::Shrink, max_width: u32::MAX, @@ -41,9 +41,9 @@ impl<'a, Message> Container<'a, Message> { } } - /// Sets the padding of the [`Container`]. - pub fn padding(mut self, units: u16) -> Self { - self.padding = units; + /// Sets the [`Padding`] of the [`Container`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -106,24 +106,22 @@ 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, padding_class).into_bump_str(), + bumpalo::format!(in bump, "{}", column_class).into_bump_str(), ) .attr( "style", bumpalo::format!( in bump, - "width: {}; height: {}; max-width: {}; align-items: {}; justify-content: {}; background: {}; color: {}; border-width: {}px; border-color: {}; border-radius: {}px", + "width: {}; height: {}; max-width: {}; padding: {}; align-items: {}; justify-content: {}; background: {}; color: {}; border-width: {}px; border-color: {}; border-radius: {}px", css::length(self.width), css::length(self.height), css::max_length(self.max_width), + css::padding(self.padding), css::align(self.horizontal_alignment), css::align(self.vertical_alignment), style.background.map(css::background).unwrap_or(String::from("initial")), diff --git a/web/src/widget/row.rs b/web/src/widget/row.rs index f00a544a..ffb515cf 100644 --- a/web/src/widget/row.rs +++ b/web/src/widget/row.rs @@ -1,4 +1,4 @@ -use crate::{css, Align, Bus, Css, Element, Length, Widget}; +use crate::{css, Align, Bus, Css, Element, Length, Padding, Widget}; use dodrio::bumpalo; use std::u32; @@ -9,7 +9,7 @@ use std::u32; #[allow(missing_debug_implementations)] pub struct Row<'a, Message> { spacing: u16, - padding: u16, + padding: Padding, width: Length, height: Length, max_width: u32, @@ -28,7 +28,7 @@ impl<'a, Message> Row<'a, Message> { pub fn with_children(children: Vec>) -> Self { Row { spacing: 0, - padding: 0, + padding: Padding::ZERO, width: Length::Fill, height: Length::Shrink, max_width: u32::MAX, @@ -48,9 +48,9 @@ impl<'a, Message> Row<'a, Message> { self } - /// Sets the padding of the [`Row`]. - pub fn padding(mut self, units: u16) -> Self { - self.padding = units; + /// Sets the [`Padding`] of the [`Row`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -114,23 +114,21 @@ impl<'a, Message> Widget for Row<'a, Message> { let spacing_class = style_sheet.insert(bump, css::Rule::Spacing(self.spacing)); - let padding_class = - style_sheet.insert(bump, css::Rule::Padding(self.padding)); - // TODO: Complete styling div(bump) .attr( "class", - bumpalo::format!(in bump, "{} {} {}", row_class, spacing_class, padding_class) + bumpalo::format!(in bump, "{} {}", row_class, spacing_class) .into_bump_str(), ) .attr("style", bumpalo::format!( in bump, - "width: {}; height: {}; max-width: {}; max-height: {}; align-items: {}", + "width: {}; height: {}; max-width: {}; max-height: {}; padding: {}; align-items: {}", css::length(self.width), css::length(self.height), css::max_length(self.max_width), css::max_length(self.max_height), + css::padding(self.padding), css::align(self.align_items) ).into_bump_str() ) diff --git a/web/src/widget/scrollable.rs b/web/src/widget/scrollable.rs index bd9260ff..ce0a10d4 100644 --- a/web/src/widget/scrollable.rs +++ b/web/src/widget/scrollable.rs @@ -1,5 +1,7 @@ //! Navigate an endless amount of content with a scrollbar. -use crate::{bumpalo, css, Align, Bus, Column, Css, Element, Length, Widget}; +use crate::{ + bumpalo, css, Align, Bus, Column, Css, Element, Length, Padding, Widget, +}; pub use iced_style::scrollable::{Scrollbar, Scroller, StyleSheet}; @@ -39,9 +41,9 @@ impl<'a, Message> Scrollable<'a, Message> { self } - /// Sets the padding of the [`Scrollable`]. - pub fn padding(mut self, units: u16) -> Self { - self.content = self.content.padding(units); + /// Sets the [`Padding`] of the [`Scrollable`]. + pub fn padding>(mut self, padding: P) -> Self { + self.content = self.content.padding(padding); self } diff --git a/web/src/widget/text_input.rs b/web/src/widget/text_input.rs index bc2048a8..e8d8ca2f 100644 --- a/web/src/widget/text_input.rs +++ b/web/src/widget/text_input.rs @@ -1,7 +1,7 @@ //! Display fields that can be filled with text. //! //! A [`TextInput`] has some local [`State`]. -use crate::{bumpalo, css, Bus, Css, Element, Length, Widget}; +use crate::{bumpalo, css, Bus, Css, Element, Length, Padding, Widget}; pub use iced_style::text_input::{Style, StyleSheet}; @@ -35,7 +35,7 @@ pub struct TextInput<'a, Message> { is_secure: bool, width: Length, max_width: u32, - padding: u16, + padding: Padding, size: Option, on_change: Rc Message>>, on_submit: Option, @@ -66,7 +66,7 @@ impl<'a, Message> TextInput<'a, Message> { is_secure: false, width: Length::Fill, max_width: u32::MAX, - padding: 0, + padding: Padding::ZERO, size: None, on_change: Rc::new(Box::new(on_change)), on_submit: None, @@ -92,9 +92,9 @@ impl<'a, Message> TextInput<'a, Message> { self } - /// Sets the padding of the [`TextInput`]. - pub fn padding(mut self, units: u16) -> Self { - self.padding = units; + /// Sets the [`Padding`] of the [`TextInput`]. + pub fn padding>(mut self, padding: P) -> Self { + self.padding = padding.into(); self } @@ -126,20 +126,11 @@ where &self, bump: &'b bumpalo::Bump, bus: &Bus, - style_sheet: &mut Css<'b>, + _style_sheet: &mut Css<'b>, ) -> dodrio::Node<'b> { use dodrio::builder::*; use wasm_bindgen::JsCast; - let class = { - use dodrio::bumpalo::collections::String; - - let padding_class = - style_sheet.insert(bump, css::Rule::Padding(self.padding)); - - String::from_str_in(&padding_class, bump).into_bump_str() - }; - let placeholder = { use dodrio::bumpalo::collections::String; @@ -159,16 +150,16 @@ where let style = self.style_sheet.active(); input(bump) - .attr("class", class) .attr( "style", bumpalo::format!( in bump, - "width: {}; max-width: {}; font-size: {}px; \ + "width: {}; max-width: {}; padding: {}; font-size: {}px; \ background: {}; border-width: {}px; border-color: {}; \ border-radius: {}px; color: {}", css::length(self.width), css::max_length(self.max_width), + css::padding(self.padding), self.size.unwrap_or(20), css::background(style.background), style.border_width,