Merge branch 'iced-rs:master' into master

native/src/image.rs

@@ -1,7 +1,6 @@
 //! Load and draw raster graphics.
 use crate::{Hasher, Rectangle, Size};
 
-use std::borrow::Cow;
 use std::hash::{Hash, Hasher as _};
 use std::path::PathBuf;
 use std::sync::Arc;
@@ -10,7 +9,7 @@ use std::sync::Arc;
 #[derive(Debug, Clone)]
 pub struct Handle {
     id: u64,
-    data: Arc<Data>,
+    data: Data,
 }
 
 impl Handle {
@@ -29,12 +28,12 @@ impl Handle {
     pub fn from_pixels(
         width: u32,
         height: u32,
-        pixels: impl Into<Cow<'static, [u8]>>,
+        pixels: impl AsRef<[u8]> + Send + Sync + 'static,
     ) -> Handle {
         Self::from_data(Data::Rgba {
             width,
             height,
-            pixels: pixels.into(),
+            pixels: Bytes::new(pixels),
         })
     }
 
@@ -44,8 +43,10 @@ impl Handle {
     ///
     /// This is useful if you already have your image loaded in-memory, maybe
     /// because you downloaded or generated it procedurally.
-    pub fn from_memory(bytes: impl Into<Cow<'static, [u8]>>) -> Handle {
-        Self::from_data(Data::Bytes(bytes.into()))
+    pub fn from_memory(
+        bytes: impl AsRef<[u8]> + Send + Sync + 'static,
+    ) -> Handle {
+        Self::from_data(Data::Bytes(Bytes::new(bytes)))
     }
 
     fn from_data(data: Data) -> Handle {
@@ -54,7 +55,7 @@ impl Handle {
 
         Handle {
             id: hasher.finish(),
-            data: Arc::new(data),
+            data,
         }
     }
 
@@ -84,6 +85,45 @@ impl Hash for Handle {
     }
 }
 
+/// A wrapper around raw image data.
+///
+/// It behaves like a `&[u8]`.
+#[derive(Clone)]
+pub struct Bytes(Arc<dyn AsRef<[u8]> + Send + Sync + 'static>);
+
+impl Bytes {
+    /// Creates new [`Bytes`] around `data`.
+    pub fn new(data: impl AsRef<[u8]> + Send + Sync + 'static) -> Self {
+        Self(Arc::new(data))
+    }
+}
+
+impl std::fmt::Debug for Bytes {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        self.0.as_ref().as_ref().fmt(f)
+    }
+}
+
+impl std::hash::Hash for Bytes {
+    fn hash<H: std::hash::Hasher>(&self, state: &mut H) {
+        self.0.as_ref().as_ref().hash(state);
+    }
+}
+
+impl AsRef<[u8]> for Bytes {
+    fn as_ref(&self) -> &[u8] {
+        self.0.as_ref().as_ref()
+    }
+}
+
+impl std::ops::Deref for Bytes {
+    type Target = [u8];
+
+    fn deref(&self) -> &[u8] {
+        self.0.as_ref().as_ref()
+    }
+}
+
 /// The data of a raster image.
 #[derive(Clone, Hash)]
 pub enum Data {
@@ -91,7 +131,7 @@ pub enum Data {
     Path(PathBuf),
 
     /// In-memory data
-    Bytes(Cow<'static, [u8]>),
+    Bytes(Bytes),
 
     /// Decoded image pixels in RGBA format.
     Rgba {
@@ -100,7 +140,7 @@ pub enum Data {
         /// The height of the image.
         height: u32,
         /// The pixels.
-        pixels: Cow<'static, [u8]>,
+        pixels: Bytes,
     },
 }
 

native/src/layout/flex.rs

@@ -191,7 +191,7 @@ where
         }
     }
 
-    let pad = axis.pack(padding.left as f32, padding.top as f32);
+    let pad = axis.pack(padding.left, padding.top);
     let mut main = pad.0;
 
     for (i, node) in nodes.iter_mut().enumerate() {

native/src/layout/limits.rs

@@ -42,17 +42,16 @@ impl Limits {
     }
 
     /// Applies a width constraint to the current [`Limits`].
-    pub fn width(mut self, width: Length) -> Limits {
-        match width {
+    pub fn width(mut self, width: impl Into<Length>) -> Limits {
+        match width.into() {
             Length::Shrink => {
                 self.fill.width = self.min.width;
             }
             Length::Fill | Length::FillPortion(_) => {
                 self.fill.width = self.fill.width.min(self.max.width);
             }
-            Length::Units(units) => {
-                let new_width =
-                    (units as f32).min(self.max.width).max(self.min.width);
+            Length::Fixed(amount) => {
+                let new_width = amount.min(self.max.width).max(self.min.width);
 
                 self.min.width = new_width;
                 self.max.width = new_width;
@@ -64,17 +63,17 @@ impl Limits {
     }
 
     /// Applies a height constraint to the current [`Limits`].
-    pub fn height(mut self, height: Length) -> Limits {
-        match height {
+    pub fn height(mut self, height: impl Into<Length>) -> Limits {
+        match height.into() {
             Length::Shrink => {
                 self.fill.height = self.min.height;
             }
             Length::Fill | Length::FillPortion(_) => {
                 self.fill.height = self.fill.height.min(self.max.height);
             }
-            Length::Units(units) => {
+            Length::Fixed(amount) => {
                 let new_height =
-                    (units as f32).min(self.max.height).max(self.min.height);
+                    amount.min(self.max.height).max(self.min.height);
 
                 self.min.height = new_height;
                 self.max.height = new_height;
@@ -86,43 +85,36 @@ impl Limits {
     }
 
     /// Applies a minimum width constraint to the current [`Limits`].
-    pub fn min_width(mut self, min_width: u32) -> Limits {
-        self.min.width =
-            self.min.width.max(min_width as f32).min(self.max.width);
+    pub fn min_width(mut self, min_width: f32) -> Limits {
+        self.min.width = self.min.width.max(min_width).min(self.max.width);
 
         self
     }
 
     /// Applies a maximum width constraint to the current [`Limits`].
-    pub fn max_width(mut self, max_width: u32) -> Limits {
-        self.max.width =
-            self.max.width.min(max_width as f32).max(self.min.width);
+    pub fn max_width(mut self, max_width: f32) -> Limits {
+        self.max.width = self.max.width.min(max_width).max(self.min.width);
 
         self
     }
 
     /// Applies a minimum height constraint to the current [`Limits`].
-    pub fn min_height(mut self, min_height: u32) -> Limits {
-        self.min.height =
-            self.min.height.max(min_height as f32).min(self.max.height);
+    pub fn min_height(mut self, min_height: f32) -> Limits {
+        self.min.height = self.min.height.max(min_height).min(self.max.height);
 
         self
     }
 
     /// Applies a maximum height constraint to the current [`Limits`].
-    pub fn max_height(mut self, max_height: u32) -> Limits {
-        self.max.height =
-            self.max.height.min(max_height as f32).max(self.min.height);
+    pub fn max_height(mut self, max_height: f32) -> Limits {
+        self.max.height = self.max.height.min(max_height).max(self.min.height);
 
         self
     }
 
     /// Shrinks the current [`Limits`] to account for the given padding.
     pub fn pad(&self, padding: Padding) -> Limits {
-        self.shrink(Size::new(
-            padding.horizontal() as f32,
-            padding.vertical() as f32,
-        ))
+        self.shrink(Size::new(padding.horizontal(), padding.vertical()))
     }
 
     /// Shrinks the current [`Limits`] by the given [`Size`].

native/src/lib.rs

@@ -23,8 +23,8 @@
 //! - Build a new renderer, see the [renderer] module.
 //! - Build a custom widget, start at the [`Widget`] trait.
 //!
-//! [`iced_core`]: https://github.com/iced-rs/iced/tree/0.7/core
-//! [`iced_winit`]: https://github.com/iced-rs/iced/tree/0.7/winit
+//! [`iced_core`]: https://github.com/iced-rs/iced/tree/0.8/core
+//! [`iced_winit`]: https://github.com/iced-rs/iced/tree/0.8/winit
 //! [`druid`]: https://github.com/xi-editor/druid
 //! [`raw-window-handle`]: https://github.com/rust-windowing/raw-window-handle
 //! [renderer]: crate::renderer
@@ -81,7 +81,7 @@ pub use iced_core::alignment;
 pub use iced_core::time;
 pub use iced_core::{
     color, Alignment, Background, Color, ContentFit, Font, Length, Padding,
-    Point, Rectangle, Size, Vector,
+    Pixels, Point, Rectangle, Size, Vector,
 };
 pub use iced_futures::{executor, futures};
 pub use iced_style::application;

native/src/overlay/menu.rs

@@ -11,8 +11,8 @@ use crate::widget::container::{self, Container};
 use crate::widget::scrollable::{self, Scrollable};
 use crate::widget::Tree;
 use crate::{
-    Clipboard, Color, Element, Layout, Length, Padding, Point, Rectangle,
-    Shell, Size, Vector, Widget,
+    Clipboard, Color, Element, Layout, Length, Padding, Pixels, Point,
+    Rectangle, Shell, Size, Vector, Widget,
 };
 
 pub use iced_style::menu::{Appearance, StyleSheet};
@@ -28,9 +28,9 @@ where
     options: &'a [T],
     hovered_option: &'a mut Option<usize>,
     last_selection: &'a mut Option<T>,
-    width: u16,
+    width: f32,
     padding: Padding,
-    text_size: Option<u16>,
+    text_size: Option<f32>,
     font: Renderer::Font,
     style: <Renderer::Theme as StyleSheet>::Style,
 }
@@ -55,7 +55,7 @@ where
             options,
             hovered_option,
             last_selection,
-            width: 0,
+            width: 0.0,
             padding: Padding::ZERO,
             text_size: None,
             font: Default::default(),
@@ -64,7 +64,7 @@ where
     }
 
     /// Sets the width of the [`Menu`].
-    pub fn width(mut self, width: u16) -> Self {
+    pub fn width(mut self, width: f32) -> Self {
         self.width = width;
         self
     }
@@ -76,8 +76,8 @@ where
     }
 
     /// Sets the text size of the [`Menu`].
-    pub fn text_size(mut self, text_size: u16) -> Self {
-        self.text_size = Some(text_size);
+    pub fn text_size(mut self, text_size: impl Into<Pixels>) -> Self {
+        self.text_size = Some(text_size.into().0);
         self
     }
 
@@ -142,7 +142,7 @@ where
 {
     state: &'a mut Tree,
     container: Container<'a, Message, Renderer>,
-    width: u16,
+    width: f32,
     target_height: f32,
     style: <Renderer::Theme as StyleSheet>::Style,
 }
@@ -219,7 +219,7 @@ where
                 },
             ),
         )
-        .width(Length::Units(self.width));
+        .width(self.width);
 
         let mut node = self.container.layout(renderer, &limits);
 
@@ -310,7 +310,7 @@ where
     hovered_option: &'a mut Option<usize>,
     last_selection: &'a mut Option<T>,
     padding: Padding,
-    text_size: Option<u16>,
+    text_size: Option<f32>,
     font: Renderer::Font,
     style: <Renderer::Theme as StyleSheet>::Style,
 }
@@ -344,7 +344,7 @@ where
         let size = {
             let intrinsic = Size::new(
                 0.0,
-                f32::from(text_size + self.padding.vertical())
+                (text_size + self.padding.vertical())
                     * self.options.len() as f32,
             );
 
@@ -386,7 +386,7 @@ where
 
                     *self.hovered_option = Some(
                         ((cursor_position.y - bounds.y)
-                            / f32::from(text_size + self.padding.vertical()))
+                            / (text_size + self.padding.vertical()))
                             as usize,
                     );
                 }
@@ -401,7 +401,7 @@ where
 
                     *self.hovered_option = Some(
                         ((cursor_position.y - bounds.y)
-                            / f32::from(text_size + self.padding.vertical()))
+                            / (text_size + self.padding.vertical()))
                             as usize,
                     );
 
@@ -467,7 +467,7 @@ where
                 x: bounds.x,
                 y: bounds.y + (option_height * i) as f32,
                 width: bounds.width,
-                height: f32::from(text_size + self.padding.vertical()),
+                height: text_size + self.padding.vertical(),
             };
 
             if is_selected {
@@ -485,12 +485,12 @@ where
             renderer.fill_text(Text {
                 content: &option.to_string(),
                 bounds: Rectangle {
-                    x: bounds.x + self.padding.left as f32,
+                    x: bounds.x + self.padding.left,
                     y: bounds.center_y(),
                     width: f32::INFINITY,
                     ..bounds
                 },
-                size: f32::from(text_size),
+                size: text_size,
                 font: self.font.clone(),
                 color: if is_selected {
                     appearance.selected_text_color

native/src/renderer/null.rs

@@ -44,14 +44,14 @@ impl text::Renderer for Null {
     const CHECKMARK_ICON: char = '0';
     const ARROW_DOWN_ICON: char = '0';
 
-    fn default_size(&self) -> u16 {
-        20
+    fn default_size(&self) -> f32 {
+        20.0
     }
 
     fn measure(
         &self,
         _content: &str,
-        _size: u16,
+        _size: f32,
         _font: Font,
         _bounds: Size,
     ) -> (f32, f32) {

native/src/subscription.rs

@@ -100,11 +100,24 @@ where
     })
 }
 
+/// Returns a [`Subscription`] that will call the given function to create and
+/// asynchronously run the given [`Stream`].
+pub fn run<S, Message>(builder: fn() -> S) -> Subscription<Message>
+where
+    S: Stream<Item = Message> + MaybeSend + 'static,
+    Message: 'static,
+{
+    Subscription::from_recipe(Runner {
+        id: builder,
+        spawn: move |_| builder(),
+    })
+}
+
 /// Returns a [`Subscription`] that will create and asynchronously run the
 /// given [`Stream`].
 ///
 /// The `id` will be used to uniquely identify the [`Subscription`].
-pub fn run<I, S, Message>(id: I, stream: S) -> Subscription<Message>
+pub fn run_with_id<I, S, Message>(id: I, stream: S) -> Subscription<Message>
 where
     I: Hash + 'static,
     S: Stream<Item = Message> + MaybeSend + 'static,
@@ -184,7 +197,7 @@ where
 /// Check out the [`websocket`] example, which showcases this pattern to maintain a WebSocket
 /// connection open.
 ///
-/// [`websocket`]: https://github.com/iced-rs/iced/tree/0.7/examples/websocket
+/// [`websocket`]: https://github.com/iced-rs/iced/tree/0.8/examples/websocket
 pub fn unfold<I, T, Fut, Message>(
     id: I,
     initial: T,
@@ -199,7 +212,7 @@ where
     use futures::future::{self, FutureExt};
     use futures::stream::StreamExt;
 
-    run(
+    run_with_id(
         id,
         futures::stream::unfold(initial, move |state| f(state).map(Some))
             .filter_map(future::ready),

native/src/text.rs

@@ -73,20 +73,20 @@ pub trait Renderer: crate::Renderer {
     const ARROW_DOWN_ICON: char;
 
     /// Returns the default size of [`Text`].
-    fn default_size(&self) -> u16;
+    fn default_size(&self) -> f32;
 
     /// Measures the text in the given bounds and returns the minimum boundaries
     /// that can fit the contents.
     fn measure(
         &self,
         content: &str,
-        size: u16,
+        size: f32,
         font: Self::Font,
         bounds: Size,
     ) -> (f32, f32);
 
     /// Measures the width of the text as if it were laid out in a single line.
-    fn measure_width(&self, content: &str, size: u16, font: Self::Font) -> f32 {
+    fn measure_width(&self, content: &str, size: f32, font: Self::Font) -> f32 {
         let (width, _) = self.measure(content, size, font, Size::INFINITY);
 
         width

native/src/user_interface.rs

@@ -21,8 +21,8 @@ use crate::{
 /// The [`integration_opengl`] & [`integration_wgpu`] examples use a
 /// [`UserInterface`] to integrate Iced in an existing graphical application.
 ///
-/// [`integration_opengl`]: https://github.com/iced-rs/iced/tree/0.7/examples/integration_opengl
-/// [`integration_wgpu`]: https://github.com/iced-rs/iced/tree/0.7/examples/integration_wgpu
+/// [`integration_opengl`]: https://github.com/iced-rs/iced/tree/0.8/examples/integration_opengl
+/// [`integration_wgpu`]: https://github.com/iced-rs/iced/tree/0.8/examples/integration_wgpu
 #[allow(missing_debug_implementations)]
 pub struct UserInterface<'a, Message, Renderer> {
     root: Element<'a, Message, Renderer>,
@@ -263,16 +263,16 @@ where
                 }
             }
 
-            let base_cursor = if manual_overlay
+            let base_cursor = manual_overlay
                 .as_ref()
-                .unwrap()
-                .is_over(Layout::new(&layout), cursor_position)
-            {
-                // TODO: Type-safe cursor availability
-                Point::new(-1.0, -1.0)
-            } else {
-                cursor_position
-            };
+                .filter(|overlay| {
+                    overlay.is_over(Layout::new(&layout), cursor_position)
+                })
+                .map(|_| {
+                    // TODO: Type-safe cursor availability
+                    Point::new(-1.0, -1.0)
+                })
+                .unwrap_or(cursor_position);
 
             self.overlay = Some(layout);
 
@@ -440,12 +440,13 @@ where
                 overlay.layout(renderer, self.bounds, Vector::ZERO)
             });
 
-            let new_cursor_position =
-                if overlay_layout.bounds().contains(cursor_position) {
-                    Point::new(-1.0, -1.0)
-                } else {
-                    cursor_position
-                };
+            let new_cursor_position = if overlay
+                .is_over(Layout::new(&overlay_layout), cursor_position)
+            {
+                Point::new(-1.0, -1.0)
+            } else {
+                cursor_position
+            };
 
             self.overlay = Some(overlay_layout);
 

native/src/widget.rs

@@ -110,12 +110,12 @@ use crate::{Clipboard, Layout, Length, Point, Rectangle, Shell};
 /// - [`geometry`], a custom widget showcasing how to draw geometry with the
 /// `Mesh2D` primitive in [`iced_wgpu`].
 ///
-/// [examples]: https://github.com/iced-rs/iced/tree/0.7/examples
-/// [`bezier_tool`]: https://github.com/iced-rs/iced/tree/0.7/examples/bezier_tool
-/// [`custom_widget`]: https://github.com/iced-rs/iced/tree/0.7/examples/custom_widget
-/// [`geometry`]: https://github.com/iced-rs/iced/tree/0.7/examples/geometry
+/// [examples]: https://github.com/iced-rs/iced/tree/0.8/examples
+/// [`bezier_tool`]: https://github.com/iced-rs/iced/tree/0.8/examples/bezier_tool
+/// [`custom_widget`]: https://github.com/iced-rs/iced/tree/0.8/examples/custom_widget
+/// [`geometry`]: https://github.com/iced-rs/iced/tree/0.8/examples/geometry
 /// [`lyon`]: https://github.com/nical/lyon
-/// [`iced_wgpu`]: https://github.com/iced-rs/iced/tree/0.7/wgpu
+/// [`iced_wgpu`]: https://github.com/iced-rs/iced/tree/0.8/wgpu
 pub trait Widget<Message, Renderer>
 where
     Renderer: crate::Renderer,

native/src/widget/button.rs

@@ -76,20 +76,20 @@ where
             on_press: None,
             width: Length::Shrink,
             height: Length::Shrink,
-            padding: Padding::new(5),
+            padding: Padding::new(5.0),
             style: <Renderer::Theme as StyleSheet>::Style::default(),
         }
     }
 
     /// Sets the width of the [`Button`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the height of the [`Button`].
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = height.into();
         self
     }
 
@@ -434,7 +434,7 @@ pub fn layout<Renderer>(
     let padding = padding.fit(content.size(), limits.max());
     let size = limits.pad(padding).resolve(content.size()).pad(padding);
 
-    content.move_to(Point::new(padding.left.into(), padding.top.into()));
+    content.move_to(Point::new(padding.left, padding.top));
 
     layout::Node::with_children(size, vec![content])
 }

native/src/widget/checkbox.rs

@@ -8,12 +8,23 @@ use crate::text;
 use crate::touch;
 use crate::widget::{self, Row, Text, Tree};
 use crate::{
-    Alignment, Clipboard, Element, Layout, Length, Point, Rectangle, Shell,
-    Widget,
+    Alignment, Clipboard, Element, Layout, Length, Pixels, Point, Rectangle,
+    Shell, Widget,
 };
 
 pub use iced_style::checkbox::{Appearance, StyleSheet};
 
+/// The icon in a [`Checkbox`].
+#[derive(Debug, Clone, PartialEq)]
+pub struct Icon<Font> {
+    /// Font that will be used to display the `code_point`,
+    pub font: Font,
+    /// The unicode code point that will be used as the icon.
+    pub code_point: char,
+    /// Font size of the content.
+    pub size: Option<f32>,
+}
+
 /// A box that can be checked.
 ///
 /// # Example
@@ -41,10 +52,11 @@ where
     on_toggle: Box<dyn Fn(bool) -> Message + 'a>,
     label: String,
     width: Length,
-    size: u16,
-    spacing: u16,
-    text_size: Option<u16>,
+    size: f32,
+    spacing: f32,
+    text_size: Option<f32>,
     font: Renderer::Font,
+    icon: Icon<Renderer::Font>,
     style: <Renderer::Theme as StyleSheet>::Style,
 }
 
@@ -54,10 +66,10 @@ where
     Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     /// The default size of a [`Checkbox`].
-    const DEFAULT_SIZE: u16 = 20;
+    const DEFAULT_SIZE: f32 = 20.0;
 
     /// The default spacing of a [`Checkbox`].
-    const DEFAULT_SPACING: u16 = 15;
+    const DEFAULT_SPACING: f32 = 15.0;
 
     /// Creates a new [`Checkbox`].
     ///
@@ -80,31 +92,36 @@ where
             spacing: Self::DEFAULT_SPACING,
             text_size: None,
             font: Renderer::Font::default(),
+            icon: Icon {
+                font: Renderer::ICON_FONT,
+                code_point: Renderer::CHECKMARK_ICON,
+                size: None,
+            },
             style: Default::default(),
         }
     }
 
     /// Sets the size of the [`Checkbox`].
-    pub fn size(mut self, size: u16) -> Self {
-        self.size = size;
+    pub fn size(mut self, size: impl Into<Pixels>) -> Self {
+        self.size = size.into().0;
         self
     }
 
     /// Sets the width of the [`Checkbox`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the spacing between the [`Checkbox`] and the text.
-    pub fn spacing(mut self, spacing: u16) -> Self {
-        self.spacing = spacing;
+    pub fn spacing(mut self, spacing: impl Into<Pixels>) -> Self {
+        self.spacing = spacing.into().0;
         self
     }
 
     /// Sets the text size of the [`Checkbox`].
-    pub fn text_size(mut self, text_size: u16) -> Self {
-        self.text_size = Some(text_size);
+    pub fn text_size(mut self, text_size: impl Into<Pixels>) -> Self {
+        self.text_size = Some(text_size.into().0);
         self
     }
 
@@ -116,6 +133,12 @@ where
         self
     }
 
+    /// Sets the [`Icon`] of the [`Checkbox`].
+    pub fn icon(mut self, icon: Icon<Renderer::Font>) -> Self {
+        self.icon = icon;
+        self
+    }
+
     /// Sets the style of the [`Checkbox`].
     pub fn style(
         mut self,
@@ -149,11 +172,7 @@ where
             .width(self.width)
             .spacing(self.spacing)
             .align_items(Alignment::Center)
-            .push(
-                Row::new()
-                    .width(Length::Units(self.size))
-                    .height(Length::Units(self.size)),
-            )
+            .push(Row::new().width(self.size).height(self.size))
             .push(
                 Text::new(&self.label)
                     .font(self.font.clone())
@@ -243,17 +262,24 @@ where
                 custom_style.background,
             );
 
+            let Icon {
+                font,
+                code_point,
+                size,
+            } = &self.icon;
+            let size = size.map(f32::from).unwrap_or(bounds.height * 0.7);
+
             if self.is_checked {
                 renderer.fill_text(text::Text {
-                    content: &Renderer::CHECKMARK_ICON.to_string(),
-                    font: Renderer::ICON_FONT,
-                    size: bounds.height * 0.7,
+                    content: &code_point.to_string(),
+                    font: font.clone(),
+                    size,
                     bounds: Rectangle {
                         x: bounds.center_x(),
                         y: bounds.center_y(),
                         ..bounds
                     },
-                    color: custom_style.checkmark_color,
+                    color: custom_style.icon_color,
                     horizontal_alignment: alignment::Horizontal::Center,
                     vertical_alignment: alignment::Vertical::Center,
                 });

native/src/widget/column.rs

@@ -6,18 +6,18 @@ use crate::overlay;
 use crate::renderer;
 use crate::widget::{Operation, Tree};
 use crate::{
-    Alignment, Clipboard, Element, Layout, Length, Padding, Point, Rectangle,
-    Shell, Widget,
+    Alignment, Clipboard, Element, Layout, Length, Padding, Pixels, Point,
+    Rectangle, Shell, Widget,
 };
 
 /// A container that distributes its contents vertically.
 #[allow(missing_debug_implementations)]
 pub struct Column<'a, Message, Renderer> {
-    spacing: u16,
+    spacing: f32,
     padding: Padding,
     width: Length,
     height: Length,
-    max_width: u32,
+    max_width: f32,
     align_items: Alignment,
     children: Vec<Element<'a, Message, Renderer>>,
 }
@@ -33,11 +33,11 @@ impl<'a, Message, Renderer> Column<'a, Message, Renderer> {
         children: Vec<Element<'a, Message, Renderer>>,
     ) -> Self {
         Column {
-            spacing: 0,
+            spacing: 0.0,
             padding: Padding::ZERO,
             width: Length::Shrink,
             height: Length::Shrink,
-            max_width: u32::MAX,
+            max_width: f32::INFINITY,
             align_items: Alignment::Start,
             children,
         }
@@ -48,8 +48,8 @@ impl<'a, Message, Renderer> Column<'a, Message, Renderer> {
     /// Custom margins per element do not exist in iced. You should use this
     /// method instead! While less flexible, it helps you keep spacing between
     /// elements consistent.
-    pub fn spacing(mut self, units: u16) -> Self {
-        self.spacing = units;
+    pub fn spacing(mut self, amount: impl Into<Pixels>) -> Self {
+        self.spacing = amount.into().0;
         self
     }
 
@@ -60,20 +60,20 @@ impl<'a, Message, Renderer> Column<'a, Message, Renderer> {
     }
 
     /// Sets the width of the [`Column`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the height of the [`Column`].
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = height.into();
         self
     }
 
     /// Sets the maximum width of the [`Column`].
-    pub fn max_width(mut self, max_width: u32) -> Self {
-        self.max_width = max_width;
+    pub fn max_width(mut self, max_width: impl Into<Pixels>) -> Self {
+        self.max_width = max_width.into().0;
         self
     }
 
@@ -135,7 +135,7 @@ where
             renderer,
             &limits,
             self.padding,
-            self.spacing as f32,
+            self.spacing,
             self.align_items,
             &self.children,
         )

native/src/widget/container.rs

@@ -5,14 +5,12 @@ use crate::layout;
 use crate::mouse;
 use crate::overlay;
 use crate::renderer;
-use crate::widget::{Operation, Tree};
+use crate::widget::{self, Operation, Tree};
 use crate::{
-    Background, Clipboard, Color, Element, Layout, Length, Padding, Point,
-    Rectangle, Shell, Widget,
+    Background, Clipboard, Color, Element, Layout, Length, Padding, Pixels,
+    Point, Rectangle, Shell, Widget,
 };
 
-use std::u32;
-
 pub use iced_style::container::{Appearance, StyleSheet};
 
 /// An element decorating some content.
@@ -24,11 +22,12 @@ where
     Renderer: crate::Renderer,
     Renderer::Theme: StyleSheet,
 {
+    id: Option<Id>,
     padding: Padding,
     width: Length,
     height: Length,
-    max_width: u32,
-    max_height: u32,
+    max_width: f32,
+    max_height: f32,
     horizontal_alignment: alignment::Horizontal,
     vertical_alignment: alignment::Vertical,
     style: <Renderer::Theme as StyleSheet>::Style,
@@ -46,11 +45,12 @@ where
         T: Into<Element<'a, Message, Renderer>>,
     {
         Container {
+            id: None,
             padding: Padding::ZERO,
             width: Length::Shrink,
             height: Length::Shrink,
-            max_width: u32::MAX,
-            max_height: u32::MAX,
+            max_width: f32::INFINITY,
+            max_height: f32::INFINITY,
             horizontal_alignment: alignment::Horizontal::Left,
             vertical_alignment: alignment::Vertical::Top,
             style: Default::default(),
@@ -58,6 +58,12 @@ where
         }
     }
 
+    /// Sets the [`Id`] of the [`Container`].
+    pub fn id(mut self, id: Id) -> Self {
+        self.id = Some(id);
+        self
+    }
+
     /// Sets the [`Padding`] of the [`Container`].
     pub fn padding<P: Into<Padding>>(mut self, padding: P) -> Self {
         self.padding = padding.into();
@@ -65,26 +71,26 @@ where
     }
 
     /// Sets the width of the [`Container`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the height of the [`Container`].
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = height.into();
         self
     }
 
     /// Sets the maximum width of the [`Container`].
-    pub fn max_width(mut self, max_width: u32) -> Self {
-        self.max_width = max_width;
+    pub fn max_width(mut self, max_width: impl Into<Pixels>) -> Self {
+        self.max_width = max_width.into().0;
         self
     }
 
-    /// Sets the maximum height of the [`Container`] in pixels.
-    pub fn max_height(mut self, max_height: u32) -> Self {
-        self.max_height = max_height;
+    /// Sets the maximum height of the [`Container`].
+    pub fn max_height(mut self, max_height: impl Into<Pixels>) -> Self {
+        self.max_height = max_height.into().0;
         self
     }
 
@@ -172,14 +178,17 @@ where
         renderer: &Renderer,
         operation: &mut dyn Operation<Message>,
     ) {
-        operation.container(None, &mut |operation| {
-            self.content.as_widget().operate(
-                &mut tree.children[0],
-                layout.children().next().unwrap(),
-                renderer,
-                operation,
-            );
-        });
+        operation.container(
+            self.id.as_ref().map(|id| &id.0),
+            &mut |operation| {
+                self.content.as_widget().operate(
+                    &mut tree.children[0],
+                    layout.children().next().unwrap(),
+                    renderer,
+                    operation,
+                );
+            },
+        );
     }
 
     fn on_event(
@@ -283,8 +292,8 @@ pub fn layout<Renderer>(
     limits: &layout::Limits,
     width: Length,
     height: Length,
-    max_width: u32,
-    max_height: u32,
+    max_width: f32,
+    max_height: f32,
     padding: Padding,
     horizontal_alignment: alignment::Horizontal,
     vertical_alignment: alignment::Vertical,
@@ -301,7 +310,7 @@ pub fn layout<Renderer>(
     let padding = padding.fit(content.size(), limits.max());
     let size = limits.pad(padding).resolve(content.size());
 
-    content.move_to(Point::new(padding.left.into(), padding.top.into()));
+    content.move_to(Point::new(padding.left, padding.top));
     content.align(
         Alignment::from(horizontal_alignment),
         Alignment::from(vertical_alignment),
@@ -333,3 +342,27 @@ pub fn draw_background<Renderer>(
         );
     }
 }
+
+/// The identifier of a [`Container`].
+#[derive(Debug, Clone, PartialEq, Eq, Hash)]
+pub struct Id(widget::Id);
+
+impl Id {
+    /// Creates a custom [`Id`].
+    pub fn new(id: impl Into<std::borrow::Cow<'static, str>>) -> Self {
+        Self(widget::Id::new(id))
+    }
+
+    /// Creates a unique [`Id`].
+    ///
+    /// This function produces a different [`Id`] every time it is called.
+    pub fn unique() -> Self {
+        Self(widget::Id::unique())
+    }
+}
+
+impl From<Id> for widget::Id {
+    fn from(id: Id) -> Self {
+        id.0
+    }
+}

native/src/widget/helpers.rs

@@ -1,7 +1,7 @@
 //! Helper functions to create pure widgets.
 use crate::overlay;
 use crate::widget;
-use crate::{Element, Length};
+use crate::{Element, Length, Pixels};
 
 use std::borrow::Cow;
 use std::ops::RangeInclusive;
@@ -247,21 +247,23 @@ pub fn image<Handle>(handle: impl Into<Handle>) -> widget::Image<Handle> {
 /// Creates a new horizontal [`Space`] with the given [`Length`].
 ///
 /// [`Space`]: widget::Space
-pub fn horizontal_space(width: Length) -> widget::Space {
+pub fn horizontal_space(width: impl Into<Length>) -> widget::Space {
     widget::Space::with_width(width)
 }
 
 /// Creates a new vertical [`Space`] with the given [`Length`].
 ///
 /// [`Space`]: widget::Space
-pub fn vertical_space(height: Length) -> widget::Space {
+pub fn vertical_space(height: impl Into<Length>) -> widget::Space {
     widget::Space::with_height(height)
 }
 
 /// Creates a horizontal [`Rule`] with the given height.
 ///
 /// [`Rule`]: widget::Rule
-pub fn horizontal_rule<Renderer>(height: u16) -> widget::Rule<Renderer>
+pub fn horizontal_rule<Renderer>(
+    height: impl Into<Pixels>,
+) -> widget::Rule<Renderer>
 where
     Renderer: crate::Renderer,
     Renderer::Theme: widget::rule::StyleSheet,
@@ -272,7 +274,9 @@ where
 /// Creates a vertical [`Rule`] with the given width.
 ///
 /// [`Rule`]: widget::Rule
-pub fn vertical_rule<Renderer>(width: u16) -> widget::Rule<Renderer>
+pub fn vertical_rule<Renderer>(
+    width: impl Into<Pixels>,
+) -> widget::Rule<Renderer>
 where
     Renderer: crate::Renderer,
     Renderer::Theme: widget::rule::StyleSheet,

native/src/widget/image.rs

@@ -29,7 +29,7 @@ pub fn viewer<Handle>(handle: Handle) -> Viewer<Handle> {
 /// ```
 ///
 /// <img src="https://github.com/iced-rs/iced/blob/9712b319bb7a32848001b96bd84977430f14b623/examples/resources/ferris.png?raw=true" width="300">
-#[derive(Debug, Hash)]
+#[derive(Debug)]
 pub struct Image<Handle> {
     handle: Handle,
     width: Length,
@@ -49,14 +49,14 @@ impl<Handle> Image<Handle> {
     }
 
     /// Sets the width of the [`Image`] boundaries.
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the height of the [`Image`] boundaries.
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = height.into();
         self
     }
 

native/src/widget/image/viewer.rs

@@ -6,8 +6,8 @@ use crate::mouse;
 use crate::renderer;
 use crate::widget::tree::{self, Tree};
 use crate::{
-    Clipboard, Element, Layout, Length, Point, Rectangle, Shell, Size, Vector,
-    Widget,
+    Clipboard, Element, Layout, Length, Pixels, Point, Rectangle, Shell, Size,
+    Vector, Widget,
 };
 
 use std::hash::Hash;
@@ -15,7 +15,7 @@ use std::hash::Hash;
 /// A frame that displays an image with the ability to zoom in/out and pan.
 #[allow(missing_debug_implementations)]
 pub struct Viewer<Handle> {
-    padding: u16,
+    padding: f32,
     width: Length,
     height: Length,
     min_scale: f32,
@@ -28,7 +28,7 @@ impl<Handle> Viewer<Handle> {
     /// Creates a new [`Viewer`] with the given [`State`].
     pub fn new(handle: Handle) -> Self {
         Viewer {
-            padding: 0,
+            padding: 0.0,
             width: Length::Shrink,
             height: Length::Shrink,
             min_scale: 0.25,
@@ -39,20 +39,20 @@ impl<Handle> Viewer<Handle> {
     }
 
     /// Sets the padding of the [`Viewer`].
-    pub fn padding(mut self, units: u16) -> Self {
-        self.padding = units;
+    pub fn padding(mut self, padding: impl Into<Pixels>) -> Self {
+        self.padding = padding.into().0;
         self
     }
 
     /// Sets the width of the [`Viewer`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the height of the [`Viewer`].
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = height.into();
         self
     }
 
@@ -124,7 +124,7 @@ where
         // Only calculate viewport sizes if the images are constrained to a limited space.
         // If they are Fill|Portion let them expand within their alotted space.
         match expansion_size {
-            Length::Shrink | Length::Units(_) => {
+            Length::Shrink | Length::Fixed(_) => {
                 let aspect_ratio = width as f32 / height as f32;
                 let viewport_aspect_ratio = size.width / size.height;
                 if viewport_aspect_ratio > aspect_ratio {

native/src/widget/pane_grid.rs

@@ -6,7 +6,7 @@
 //! The [`pane_grid` example] showcases how to use a [`PaneGrid`] with resizing,
 //! drag and drop, and hotkey support.
 //!
-//! [`pane_grid` example]: https://github.com/iced-rs/iced/tree/0.7/examples/pane_grid
+//! [`pane_grid` example]: https://github.com/iced-rs/iced/tree/0.8/examples/pane_grid
 mod axis;
 mod configuration;
 mod content;
@@ -42,8 +42,8 @@ use crate::widget;
 use crate::widget::container;
 use crate::widget::tree::{self, Tree};
 use crate::{
-    Clipboard, Color, Element, Layout, Length, Point, Rectangle, Shell, Size,
-    Vector, Widget,
+    Clipboard, Color, Element, Layout, Length, Pixels, Point, Rectangle, Shell,
+    Size, Vector, Widget,
 };
 
 /// A collection of panes distributed using either vertical or horizontal splits
@@ -104,10 +104,10 @@ where
     contents: Contents<'a, Content<'a, Message, Renderer>>,
     width: Length,
     height: Length,
-    spacing: u16,
+    spacing: f32,
     on_click: Option<Box<dyn Fn(Pane) -> Message + 'a>>,
     on_drag: Option<Box<dyn Fn(DragEvent) -> Message + 'a>>,
-    on_resize: Option<(u16, Box<dyn Fn(ResizeEvent) -> Message + 'a>)>,
+    on_resize: Option<(f32, Box<dyn Fn(ResizeEvent) -> Message + 'a>)>,
     style: <Renderer::Theme as StyleSheet>::Style,
 }
 
@@ -150,7 +150,7 @@ where
             contents,
             width: Length::Fill,
             height: Length::Fill,
-            spacing: 0,
+            spacing: 0.0,
             on_click: None,
             on_drag: None,
             on_resize: None,
@@ -159,20 +159,20 @@ where
     }
 
     /// Sets the width of the [`PaneGrid`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the height of the [`PaneGrid`].
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = height.into();
         self
     }
 
     /// Sets the spacing _between_ the panes of the [`PaneGrid`].
-    pub fn spacing(mut self, units: u16) -> Self {
-        self.spacing = units;
+    pub fn spacing(mut self, amount: impl Into<Pixels>) -> Self {
+        self.spacing = amount.into().0;
         self
     }
 
@@ -205,11 +205,11 @@ where
     /// The grabbable area of a split will have a length of `spacing + leeway`,
     /// properly centered. In other words, a length of
     /// `(spacing + leeway) / 2.0` on either side of the split line.
-    pub fn on_resize<F>(mut self, leeway: u16, f: F) -> Self
+    pub fn on_resize<F>(mut self, leeway: impl Into<Pixels>, f: F) -> Self
     where
         F: 'a + Fn(ResizeEvent) -> Message,
     {
-        self.on_resize = Some((leeway, Box::new(f)));
+        self.on_resize = Some((leeway.into().0, Box::new(f)));
         self
     }
 
@@ -485,14 +485,14 @@ pub fn layout<Renderer, T>(
     node: &Node,
     width: Length,
     height: Length,
-    spacing: u16,
+    spacing: f32,
     contents: impl Iterator<Item = (Pane, T)>,
     layout_content: impl Fn(T, &Renderer, &layout::Limits) -> layout::Node,
 ) -> layout::Node {
     let limits = limits.width(width).height(height);
     let size = limits.resolve(Size::ZERO);
 
-    let regions = node.pane_regions(f32::from(spacing), size);
+    let regions = node.pane_regions(spacing, size);
     let children = contents
         .filter_map(|(pane, content)| {
             let region = regions.get(&pane)?;
@@ -522,11 +522,11 @@ pub fn update<'a, Message, T: Draggable>(
     layout: Layout<'_>,
     cursor_position: Point,
     shell: &mut Shell<'_, Message>,
-    spacing: u16,
+    spacing: f32,
     contents: impl Iterator<Item = (Pane, T)>,
     on_click: &Option<Box<dyn Fn(Pane) -> Message + 'a>>,
     on_drag: &Option<Box<dyn Fn(DragEvent) -> Message + 'a>>,
-    on_resize: &Option<(u16, Box<dyn Fn(ResizeEvent) -> Message + 'a>)>,
+    on_resize: &Option<(f32, Box<dyn Fn(ResizeEvent) -> Message + 'a>)>,
 ) -> event::Status {
     let mut event_status = event::Status::Ignored;
 
@@ -546,13 +546,13 @@ pub fn update<'a, Message, T: Draggable>(
                         );
 
                         let splits = node.split_regions(
-                            f32::from(spacing),
+                            spacing,
                             Size::new(bounds.width, bounds.height),
                         );
 
                         let clicked_split = hovered_split(
                             splits.iter(),
-                            f32::from(spacing + leeway),
+                            spacing + leeway,
                             relative_cursor,
                         );
 
@@ -624,7 +624,7 @@ pub fn update<'a, Message, T: Draggable>(
                     let bounds = layout.bounds();
 
                     let splits = node.split_regions(
-                        f32::from(spacing),
+                        spacing,
                         Size::new(bounds.width, bounds.height),
                     );
 
@@ -698,8 +698,8 @@ pub fn mouse_interaction(
     node: &Node,
     layout: Layout<'_>,
     cursor_position: Point,
-    spacing: u16,
-    resize_leeway: Option<u16>,
+    spacing: f32,
+    resize_leeway: Option<f32>,
 ) -> Option<mouse::Interaction> {
     if action.picked_pane().is_some() {
         return Some(mouse::Interaction::Grabbing);
@@ -710,20 +710,15 @@ pub fn mouse_interaction(
             resize_leeway.and_then(|leeway| {
                 let bounds = layout.bounds();
 
-                let splits =
-                    node.split_regions(f32::from(spacing), bounds.size());
+                let splits = node.split_regions(spacing, bounds.size());
 
                 let relative_cursor = Point::new(
                     cursor_position.x - bounds.x,
                     cursor_position.y - bounds.y,
                 );
 
-                hovered_split(
-                    splits.iter(),
-                    f32::from(spacing + leeway),
-                    relative_cursor,
-                )
-                .map(|(_, axis, _)| axis)
+                hovered_split(splits.iter(), spacing + leeway, relative_cursor)
+                    .map(|(_, axis, _)| axis)
             })
         });
 
@@ -747,8 +742,8 @@ pub fn draw<Renderer, T>(
     theme: &Renderer::Theme,
     default_style: &renderer::Style,
     viewport: &Rectangle,
-    spacing: u16,
-    resize_leeway: Option<u16>,
+    spacing: f32,
+    resize_leeway: Option<f32>,
     style: &<Renderer::Theme as StyleSheet>::Style,
     contents: impl Iterator<Item = (Pane, T)>,
     draw_pane: impl Fn(
@@ -770,12 +765,11 @@ pub fn draw<Renderer, T>(
         .and_then(|(split, axis)| {
             let bounds = layout.bounds();
 
-            let splits = node.split_regions(f32::from(spacing), bounds.size());
+            let splits = node.split_regions(spacing, bounds.size());
 
             let (_axis, region, ratio) = splits.get(&split)?;
 
-            let region =
-                axis.split_line_bounds(*region, *ratio, f32::from(spacing));
+            let region = axis.split_line_bounds(*region, *ratio, spacing);
 
             Some((axis, region + Vector::new(bounds.x, bounds.y), true))
         })
@@ -788,12 +782,11 @@ pub fn draw<Renderer, T>(
                     cursor_position.y - bounds.y,
                 );
 
-                let splits =
-                    node.split_regions(f32::from(spacing), bounds.size());
+                let splits = node.split_regions(spacing, bounds.size());
 
                 let (_split, axis, region) = hovered_split(
                     splits.iter(),
-                    f32::from(spacing + leeway),
+                    spacing + leeway,
                     relative_cursor,
                 )?;
 

native/src/widget/pane_grid/title_bar.rs

@@ -249,10 +249,7 @@ where
             )
         };
 
-        node.move_to(Point::new(
-            self.padding.left.into(),
-            self.padding.top.into(),
-        ));
+        node.move_to(Point::new(self.padding.left, self.padding.top));
 
         layout::Node::with_children(node.size().pad(self.padding), vec![node])
     }

native/src/widget/pick_list.rs

@@ -13,67 +13,13 @@ use crate::widget::container;
 use crate::widget::scrollable;
 use crate::widget::tree::{self, Tree};
 use crate::{
-    Clipboard, Element, Layout, Length, Padding, Point, Rectangle, Shell, Size,
-    Widget,
+    Clipboard, Element, Layout, Length, Padding, Pixels, Point, Rectangle,
+    Shell, Size, Widget,
 };
 use std::borrow::Cow;
 
 pub use iced_style::pick_list::{Appearance, StyleSheet};
 
-/// The handle to the right side of the [`PickList`].
-#[derive(Debug, Clone, PartialEq, Eq)]
-pub enum Handle<Renderer>
-where
-    Renderer: text::Renderer,
-{
-    /// Displays an arrow icon (▼).
-    ///
-    /// This is the default.
-    Arrow {
-        /// Font size of the content.
-        size: Option<u16>,
-    },
-    /// A custom handle.
-    Custom {
-        /// Font that will be used to display the `text`,
-        font: Renderer::Font,
-        /// Text that will be shown.
-        text: String,
-        /// Font size of the content.
-        size: Option<u16>,
-    },
-    /// No handle will be shown.
-    None,
-}
-
-impl<Renderer> Default for Handle<Renderer>
-where
-    Renderer: text::Renderer,
-{
-    fn default() -> Self {
-        Self::Arrow { size: None }
-    }
-}
-
-impl<Renderer> Handle<Renderer>
-where
-    Renderer: text::Renderer,
-{
-    fn content(&self) -> Option<(Renderer::Font, String, Option<u16>)> {
-        match self {
-            Self::Arrow { size } => Some((
-                Renderer::ICON_FONT,
-                Renderer::ARROW_DOWN_ICON.to_string(),
-                *size,
-            )),
-            Self::Custom { font, text, size } => {
-                Some((font.clone(), text.clone(), *size))
-            }
-            Self::None => None,
-        }
-    }
-}
-
 /// A widget for selecting a single value from a list of options.
 #[allow(missing_debug_implementations)]
 pub struct PickList<'a, T, Message, Renderer>
@@ -88,9 +34,9 @@ where
     selected: Option<T>,
     width: Length,
     padding: Padding,
-    text_size: Option<u16>,
+    text_size: Option<f32>,
     font: Renderer::Font,
-    handle: Handle<Renderer>,
+    handle: Handle<Renderer::Font>,
     style: <Renderer::Theme as StyleSheet>::Style,
 }
 
@@ -107,7 +53,7 @@ where
         From<<Renderer::Theme as StyleSheet>::Style>,
 {
     /// The default padding of a [`PickList`].
-    pub const DEFAULT_PADDING: Padding = Padding::new(5);
+    pub const DEFAULT_PADDING: Padding = Padding::new(5.0);
 
     /// Creates a new [`PickList`] with the given list of options, the current
     /// selected value, and the message to produce when an option is selected.
@@ -137,8 +83,8 @@ where
     }
 
     /// Sets the width of the [`PickList`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
@@ -149,8 +95,8 @@ where
     }
 
     /// Sets the text size of the [`PickList`].
-    pub fn text_size(mut self, size: u16) -> Self {
-        self.text_size = Some(size);
+    pub fn text_size(mut self, size: impl Into<Pixels>) -> Self {
+        self.text_size = Some(size.into().0);
         self
     }
 
@@ -161,7 +107,7 @@ where
     }
 
     /// Sets the [`Handle`] of the [`PickList`].
-    pub fn handle(mut self, handle: Handle<Renderer>) -> Self {
+    pub fn handle(mut self, handle: Handle<Renderer::Font>) -> Self {
         self.handle = handle;
         self
     }
@@ -258,7 +204,7 @@ where
 
     fn draw(
         &self,
-        _tree: &Tree,
+        tree: &Tree,
         renderer: &mut Renderer,
         theme: &Renderer::Theme,
         _style: &renderer::Style,
@@ -278,6 +224,7 @@ where
             self.selected.as_ref(),
             &self.handle,
             &self.style,
+            || tree.state.downcast_ref::<State<T>>(),
         )
     }
 
@@ -349,13 +296,53 @@ impl<T> Default for State<T> {
     }
 }
 
+/// The handle to the right side of the [`PickList`].
+#[derive(Debug, Clone, PartialEq)]
+pub enum Handle<Font> {
+    /// Displays an arrow icon (▼).
+    ///
+    /// This is the default.
+    Arrow {
+        /// Font size of the content.
+        size: Option<f32>,
+    },
+    /// A custom static handle.
+    Static(Icon<Font>),
+    /// A custom dynamic handle.
+    Dynamic {
+        /// The [`Icon`] used when [`PickList`] is closed.
+        closed: Icon<Font>,
+        /// The [`Icon`] used when [`PickList`] is open.
+        open: Icon<Font>,
+    },
+    /// No handle will be shown.
+    None,
+}
+
+impl<Font> Default for Handle<Font> {
+    fn default() -> Self {
+        Self::Arrow { size: None }
+    }
+}
+
+/// The icon of a [`Handle`].
+#[derive(Debug, Clone, PartialEq)]
+pub struct Icon<Font> {
+    /// Font that will be used to display the `code_point`,
+    pub font: Font,
+    /// The unicode code point that will be used as the icon.
+    pub code_point: char,
+    /// Font size of the content.
+    pub size: Option<f32>,
+}
+
 /// Computes the layout of a [`PickList`].
 pub fn layout<Renderer, T>(
     renderer: &Renderer,
     limits: &layout::Limits,
     width: Length,
     padding: Padding,
-    text_size: Option<u16>,
+    text_size: Option<f32>,
     font: &Renderer::Font,
     placeholder: Option<&str>,
     options: &[T],
@@ -367,12 +354,11 @@ where
     use std::f32;
 
     let limits = limits.width(width).height(Length::Shrink).pad(padding);
-
     let text_size = text_size.unwrap_or_else(|| renderer.default_size());
 
     let max_width = match width {
         Length::Shrink => {
-            let measure = |label: &str| -> u32 {
+            let measure = |label: &str| -> f32 {
                 let (width, _) = renderer.measure(
                     label,
                     text_size,
@@ -380,26 +366,25 @@ where
                     Size::new(f32::INFINITY, f32::INFINITY),
                 );
 
-                width.round() as u32
+                width.round()
             };
 
             let labels = options.iter().map(ToString::to_string);
 
-            let labels_width =
-                labels.map(|label| measure(&label)).max().unwrap_or(100);
+            let labels_width = labels
+                .map(|label| measure(&label))
+                .fold(100.0, |candidate, current| current.max(candidate));
 
-            let placeholder_width = placeholder.map(measure).unwrap_or(100);
+            let placeholder_width = placeholder.map(measure).unwrap_or(100.0);
 
             labels_width.max(placeholder_width)
         }
-        _ => 0,
+        _ => 0.0,
     };
 
     let size = {
-        let intrinsic = Size::new(
-            max_width as f32 + f32::from(text_size) + f32::from(padding.left),
-            f32::from(text_size),
-        );
+        let intrinsic =
+            Size::new(max_width + text_size + padding.left, text_size);
 
         limits.resolve(intrinsic).pad(padding)
     };
@@ -527,7 +512,7 @@ pub fn overlay<'a, T, Message, Renderer>(
     layout: Layout<'_>,
     state: &'a mut State<T>,
     padding: Padding,
-    text_size: Option<u16>,
+    text_size: Option<f32>,
     font: Renderer::Font,
     options: &'a [T],
     style: <Renderer::Theme as StyleSheet>::Style,
@@ -552,7 +537,7 @@ where
             &mut state.hovered_option,
             &mut state.last_selection,
         )
-        .width(bounds.width.round() as u16)
+        .width(bounds.width)
         .padding(padding)
         .font(font)
         .style(style);
@@ -568,22 +553,23 @@ where
 }
 
 /// Draws a [`PickList`].
-pub fn draw<T, Renderer>(
+pub fn draw<'a, T, Renderer>(
     renderer: &mut Renderer,
     theme: &Renderer::Theme,
     layout: Layout<'_>,
     cursor_position: Point,
     padding: Padding,
-    text_size: Option<u16>,
+    text_size: Option<f32>,
     font: &Renderer::Font,
     placeholder: Option<&str>,
     selected: Option<&T>,
-    handle: &Handle<Renderer>,
+    handle: &Handle<Renderer::Font>,
     style: &<Renderer::Theme as StyleSheet>::Style,
+    state: impl FnOnce() -> &'a State<T>,
 ) where
     Renderer: text::Renderer,
     Renderer::Theme: StyleSheet,
-    T: ToString,
+    T: ToString + 'a,
 {
     let bounds = layout.bounds();
     let is_mouse_over = bounds.contains(cursor_position);
@@ -605,16 +591,35 @@ pub fn draw<T, Renderer>(
         style.background,
     );
 
-    if let Some((font, text, size)) = handle.content() {
-        let size = f32::from(size.unwrap_or_else(|| renderer.default_size()));
+    let handle = match handle {
+        Handle::Arrow { size } => {
+            Some((Renderer::ICON_FONT, Renderer::ARROW_DOWN_ICON, *size))
+        }
+        Handle::Static(Icon {
+            font,
+            code_point,
+            size,
+        }) => Some((font.clone(), *code_point, *size)),
+        Handle::Dynamic { open, closed } => {
+            if state().is_open {
+                Some((open.font.clone(), open.code_point, open.size))
+            } else {
+                Some((closed.font.clone(), closed.code_point, closed.size))
+            }
+        }
+        Handle::None => None,
+    };
+
+    if let Some((font, code_point, size)) = handle {
+        let size = size.unwrap_or_else(|| renderer.default_size());
 
         renderer.fill_text(Text {
-            content: &text,
+            content: &code_point.to_string(),
             size,
             font,
             color: style.handle_color,
             bounds: Rectangle {
-                x: bounds.x + bounds.width - f32::from(padding.horizontal()),
+                x: bounds.x + bounds.width - padding.horizontal(),
                 y: bounds.center_y() - size / 2.0,
                 height: size,
                 ..bounds
@@ -627,8 +632,7 @@ pub fn draw<T, Renderer>(
     let label = selected.map(ToString::to_string);
 
     if let Some(label) = label.as_deref().or(placeholder) {
-        let text_size =
-            f32::from(text_size.unwrap_or_else(|| renderer.default_size()));
+        let text_size = text_size.unwrap_or_else(|| renderer.default_size());
 
         renderer.fill_text(Text {
             content: label,
@@ -640,9 +644,9 @@ pub fn draw<T, Renderer>(
                 style.placeholder_color
             },
             bounds: Rectangle {
-                x: bounds.x + f32::from(padding.left),
+                x: bounds.x + padding.left,
                 y: bounds.center_y() - text_size / 2.0,
-                width: bounds.width - f32::from(padding.horizontal()),
+                width: bounds.width - padding.horizontal(),
                 height: text_size,
             },
             horizontal_alignment: alignment::Horizontal::Left,

native/src/widget/progress_bar.rs

@@ -38,7 +38,7 @@ where
     Renderer::Theme: StyleSheet,
 {
     /// The default height of a [`ProgressBar`].
-    pub const DEFAULT_HEIGHT: u16 = 30;
+    pub const DEFAULT_HEIGHT: f32 = 30.0;
 
     /// Creates a new [`ProgressBar`].
     ///
@@ -56,14 +56,14 @@ where
     }
 
     /// Sets the width of the [`ProgressBar`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the height of the [`ProgressBar`].
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = Some(height);
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = Some(height.into());
         self
     }
 
@@ -87,7 +87,7 @@ where
     }
 
     fn height(&self) -> Length {
-        self.height.unwrap_or(Length::Units(Self::DEFAULT_HEIGHT))
+        self.height.unwrap_or(Length::Fixed(Self::DEFAULT_HEIGHT))
     }
 
     fn layout(
@@ -97,7 +97,7 @@ where
     ) -> layout::Node {
         let limits = limits
             .width(self.width)
-            .height(self.height.unwrap_or(Length::Units(Self::DEFAULT_HEIGHT)));
+            .height(self.height.unwrap_or(Length::Fixed(Self::DEFAULT_HEIGHT)));
 
         let size = limits.resolve(Size::ZERO);
 

native/src/widget/radio.rs

@@ -8,8 +8,8 @@ use crate::text;
 use crate::touch;
 use crate::widget::{self, Row, Text, Tree};
 use crate::{
-    Alignment, Clipboard, Color, Element, Layout, Length, Point, Rectangle,
-    Shell, Widget,
+    Alignment, Clipboard, Color, Element, Layout, Length, Pixels, Point,
+    Rectangle, Shell, Widget,
 };
 
 pub use iced_style::radio::{Appearance, StyleSheet};
@@ -50,9 +50,9 @@ where
     on_click: Message,
     label: String,
     width: Length,
-    size: u16,
-    spacing: u16,
-    text_size: Option<u16>,
+    size: f32,
+    spacing: f32,
+    text_size: Option<f32>,
     font: Renderer::Font,
     style: <Renderer::Theme as StyleSheet>::Style,
 }
@@ -64,10 +64,10 @@ where
     Renderer::Theme: StyleSheet,
 {
     /// The default size of a [`Radio`] button.
-    pub const DEFAULT_SIZE: u16 = 28;
+    pub const DEFAULT_SIZE: f32 = 28.0;
 
     /// The default spacing of a [`Radio`] button.
-    pub const DEFAULT_SPACING: u16 = 15;
+    pub const DEFAULT_SPACING: f32 = 15.0;
 
     /// Creates a new [`Radio`] button.
     ///
@@ -101,26 +101,26 @@ where
     }
 
     /// Sets the size of the [`Radio`] button.
-    pub fn size(mut self, size: u16) -> Self {
-        self.size = size;
+    pub fn size(mut self, size: impl Into<Pixels>) -> Self {
+        self.size = size.into().0;
         self
     }
 
     /// Sets the width of the [`Radio`] button.
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the spacing between the [`Radio`] button and the text.
-    pub fn spacing(mut self, spacing: u16) -> Self {
-        self.spacing = spacing;
+    pub fn spacing(mut self, spacing: impl Into<Pixels>) -> Self {
+        self.spacing = spacing.into().0;
         self
     }
 
     /// Sets the text size of the [`Radio`] button.
-    pub fn text_size(mut self, text_size: u16) -> Self {
-        self.text_size = Some(text_size);
+    pub fn text_size(mut self, text_size: impl Into<Pixels>) -> Self {
+        self.text_size = Some(text_size.into().0);
         self
     }
 
@@ -163,11 +163,7 @@ where
             .width(self.width)
             .spacing(self.spacing)
             .align_items(Alignment::Center)
-            .push(
-                Row::new()
-                    .width(Length::Units(self.size))
-                    .height(Length::Units(self.size)),
-            )
+            .push(Row::new().width(self.size).height(self.size))
             .push(Text::new(&self.label).width(self.width).size(
                 self.text_size.unwrap_or_else(|| renderer.default_size()),
             ))

native/src/widget/row.rs

@@ -6,14 +6,14 @@ use crate::overlay;
 use crate::renderer;
 use crate::widget::{Operation, Tree};
 use crate::{
-    Alignment, Clipboard, Element, Length, Padding, Point, Rectangle, Shell,
-    Widget,
+    Alignment, Clipboard, Element, Length, Padding, Pixels, Point, Rectangle,
+    Shell, Widget,
 };
 
 /// A container that distributes its contents horizontally.
 #[allow(missing_debug_implementations)]
 pub struct Row<'a, Message, Renderer> {
-    spacing: u16,
+    spacing: f32,
     padding: Padding,
     width: Length,
     height: Length,
@@ -32,7 +32,7 @@ impl<'a, Message, Renderer> Row<'a, Message, Renderer> {
         children: Vec<Element<'a, Message, Renderer>>,
     ) -> Self {
         Row {
-            spacing: 0,
+            spacing: 0.0,
             padding: Padding::ZERO,
             width: Length::Shrink,
             height: Length::Shrink,
@@ -46,8 +46,8 @@ impl<'a, Message, Renderer> Row<'a, Message, Renderer> {
     /// Custom margins per element do not exist in iced. You should use this
     /// method instead! While less flexible, it helps you keep spacing between
     /// elements consistent.
-    pub fn spacing(mut self, units: u16) -> Self {
-        self.spacing = units;
+    pub fn spacing(mut self, amount: impl Into<Pixels>) -> Self {
+        self.spacing = amount.into().0;
         self
     }
 
@@ -58,14 +58,14 @@ impl<'a, Message, Renderer> Row<'a, Message, Renderer> {
     }
 
     /// Sets the width of the [`Row`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the height of the [`Row`].
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = height.into();
         self
     }
 
@@ -124,7 +124,7 @@ where
             renderer,
             &limits,
             self.padding,
-            self.spacing as f32,
+            self.spacing,
             self.align_items,
             &self.children,
         )

native/src/widget/rule.rs

@@ -2,7 +2,9 @@
 use crate::layout;
 use crate::renderer;
 use crate::widget::Tree;
-use crate::{Color, Element, Layout, Length, Point, Rectangle, Size, Widget};
+use crate::{
+    Color, Element, Layout, Length, Pixels, Point, Rectangle, Size, Widget,
+};
 
 pub use iced_style::rule::{Appearance, FillMode, StyleSheet};
 
@@ -25,19 +27,19 @@ where
     Renderer::Theme: StyleSheet,
 {
     /// Creates a horizontal [`Rule`] with the given height.
-    pub fn horizontal(height: u16) -> Self {
+    pub fn horizontal(height: impl Into<Pixels>) -> Self {
         Rule {
             width: Length::Fill,
-            height: Length::Units(height),
+            height: Length::Fixed(height.into().0),
             is_horizontal: true,
             style: Default::default(),
         }
     }
 
     /// Creates a vertical [`Rule`] with the given width.
-    pub fn vertical(width: u16) -> Self {
+    pub fn vertical(width: impl Into<Pixels>) -> Self {
         Rule {
-            width: Length::Units(width),
+            width: Length::Fixed(width.into().0),
             height: Length::Fill,
             is_horizontal: false,
             style: Default::default(),

native/src/widget/scrollable.rs

@@ -10,8 +10,8 @@ use crate::widget;
 use crate::widget::operation::{self, Operation};
 use crate::widget::tree::{self, Tree};
 use crate::{
-    Background, Clipboard, Color, Command, Element, Layout, Length, Point,
-    Rectangle, Shell, Size, Vector, Widget,
+    Background, Clipboard, Color, Command, Element, Layout, Length, Pixels,
+    Point, Rectangle, Shell, Size, Vector, Widget,
 };
 
 pub use iced_style::scrollable::StyleSheet;
@@ -66,8 +66,8 @@ where
     }
 
     /// Sets the height of the [`Scrollable`].
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = height.into();
         self
     }
 
@@ -108,17 +108,17 @@ where
 /// Properties of a scrollbar within a [`Scrollable`].
 #[derive(Debug)]
 pub struct Properties {
-    width: u16,
-    margin: u16,
-    scroller_width: u16,
+    width: f32,
+    margin: f32,
+    scroller_width: f32,
 }
 
 impl Default for Properties {
     fn default() -> Self {
         Self {
-            width: 10,
-            margin: 0,
-            scroller_width: 10,
+            width: 10.0,
+            margin: 0.0,
+            scroller_width: 10.0,
         }
     }
 }
@@ -131,21 +131,21 @@ impl Properties {
 
     /// Sets the scrollbar width of the [`Scrollable`] .
     /// Silently enforces a minimum width of 1.
-    pub fn width(mut self, width: u16) -> Self {
-        self.width = width.max(1);
+    pub fn width(mut self, width: impl Into<Pixels>) -> Self {
+        self.width = width.into().0.max(1.0);
         self
     }
 
     /// Sets the scrollbar margin of the [`Scrollable`] .
-    pub fn margin(mut self, margin: u16) -> Self {
-        self.margin = margin;
+    pub fn margin(mut self, margin: impl Into<Pixels>) -> Self {
+        self.margin = margin.into().0;
         self
     }
 
     /// Sets the scroller width of the [`Scrollable`] .
     /// Silently enforces a minimum width of 1.
-    pub fn scroller_width(mut self, scroller_width: u16) -> Self {
-        self.scroller_width = scroller_width.max(1);
+    pub fn scroller_width(mut self, scroller_width: impl Into<Pixels>) -> Self {
+        self.scroller_width = scroller_width.into().0.max(1.0);
         self
     }
 }
@@ -208,14 +208,17 @@ where
 
         operation.scrollable(state, self.id.as_ref().map(|id| &id.0));
 
-        operation.container(None, &mut |operation| {
-            self.content.as_widget().operate(
-                &mut tree.children[0],
-                layout.children().next().unwrap(),
-                renderer,
-                operation,
-            );
-        });
+        operation.container(
+            self.id.as_ref().map(|id| &id.0),
+            &mut |operation| {
+                self.content.as_widget().operate(
+                    &mut tree.children[0],
+                    layout.children().next().unwrap(),
+                    renderer,
+                    operation,
+                );
+            },
+        );
     }
 
     fn on_event(
@@ -395,11 +398,11 @@ pub fn layout<Renderer>(
     layout_content: impl FnOnce(&Renderer, &layout::Limits) -> layout::Node,
 ) -> layout::Node {
     let limits = limits
-        .max_height(u32::MAX)
+        .max_height(f32::INFINITY)
         .max_width(if horizontal_enabled {
-            u32::MAX
+            f32::INFINITY
         } else {
-            limits.max().width as u32
+            limits.max().width
         })
         .width(width)
         .height(height);
@@ -1101,26 +1104,27 @@ impl Scrollbars {
 
             // Adjust the height of the vertical scrollbar if the horizontal scrollbar
             // is present
-            let x_scrollbar_height = show_scrollbar_x.map_or(0.0, |h| {
-                (h.width.max(h.scroller_width) + h.margin) as f32
-            });
+            let x_scrollbar_height = show_scrollbar_x
+                .map_or(0.0, |h| h.width.max(h.scroller_width) + h.margin);
 
-            let total_scrollbar_width = width.max(scroller_width) + 2 * margin;
+            let total_scrollbar_width =
+                width.max(scroller_width) + 2.0 * margin;
 
             // Total bounds of the scrollbar + margin + scroller width
             let total_scrollbar_bounds = Rectangle {
-                x: bounds.x + bounds.width - total_scrollbar_width as f32,
+                x: bounds.x + bounds.width - total_scrollbar_width,
                 y: bounds.y,
-                width: total_scrollbar_width as f32,
+                width: total_scrollbar_width,
                 height: (bounds.height - x_scrollbar_height).max(0.0),
             };
 
             // Bounds of just the scrollbar
             let scrollbar_bounds = Rectangle {
                 x: bounds.x + bounds.width
-                    - f32::from(total_scrollbar_width / 2 + width / 2),
+                    - total_scrollbar_width / 2.0
+                    - width / 2.0,
                 y: bounds.y,
-                width: width as f32,
+                width,
                 height: (bounds.height - x_scrollbar_height).max(0.0),
             };
 
@@ -1131,10 +1135,11 @@ impl Scrollbars {
 
             let scroller_bounds = Rectangle {
                 x: bounds.x + bounds.width
-                    - f32::from(total_scrollbar_width / 2 + scroller_width / 2),
+                    - total_scrollbar_width / 2.0
+                    - scroller_width / 2.0,
                 y: (scrollbar_bounds.y + scroller_offset - x_scrollbar_height)
                     .max(0.0),
-                width: scroller_width as f32,
+                width: scroller_width,
                 height: scroller_height,
             };
 
@@ -1159,27 +1164,28 @@ impl Scrollbars {
             // Need to adjust the width of the horizontal scrollbar if the vertical scrollbar
             // is present
             let scrollbar_y_width = y_scrollbar.map_or(0.0, |_| {
-                (vertical.width.max(vertical.scroller_width) + vertical.margin)
-                    as f32
+                vertical.width.max(vertical.scroller_width) + vertical.margin
             });
 
-            let total_scrollbar_height = width.max(scroller_width) + 2 * margin;
+            let total_scrollbar_height =
+                width.max(scroller_width) + 2.0 * margin;
 
             // Total bounds of the scrollbar + margin + scroller width
             let total_scrollbar_bounds = Rectangle {
                 x: bounds.x,
-                y: bounds.y + bounds.height - total_scrollbar_height as f32,
+                y: bounds.y + bounds.height - total_scrollbar_height,
                 width: (bounds.width - scrollbar_y_width).max(0.0),
-                height: total_scrollbar_height as f32,
+                height: total_scrollbar_height,
             };
 
             // Bounds of just the scrollbar
             let scrollbar_bounds = Rectangle {
                 x: bounds.x,
                 y: bounds.y + bounds.height
-                    - f32::from(total_scrollbar_height / 2 + width / 2),
+                    - total_scrollbar_height / 2.0
+                    - width / 2.0,
                 width: (bounds.width - scrollbar_y_width).max(0.0),
-                height: width as f32,
+                height: width,
             };
 
             let ratio = bounds.width / content_bounds.width;
@@ -1191,11 +1197,10 @@ impl Scrollbars {
                 x: (scrollbar_bounds.x + scroller_offset - scrollbar_y_width)
                     .max(0.0),
                 y: bounds.y + bounds.height
-                    - f32::from(
-                        total_scrollbar_height / 2 + scroller_width / 2,
-                    ),
+                    - total_scrollbar_height / 2.0
+                    - scroller_width / 2.0,
                 width: scroller_length,
-                height: scroller_width as f32,
+                height: scroller_width,
             };
 
             Some(Scrollbar {

native/src/widget/slider.rs

@@ -8,8 +8,8 @@ use crate::renderer;
 use crate::touch;
 use crate::widget::tree::{self, Tree};
 use crate::{
-    Background, Clipboard, Color, Element, Layout, Length, Point, Rectangle,
-    Shell, Size, Widget,
+    Background, Clipboard, Color, Element, Layout, Length, Pixels, Point,
+    Rectangle, Shell, Size, Widget,
 };
 
 use std::ops::RangeInclusive;
@@ -54,7 +54,7 @@ where
     on_change: Box<dyn Fn(T) -> Message + 'a>,
     on_release: Option<Message>,
     width: Length,
-    height: u16,
+    height: f32,
     style: <Renderer::Theme as StyleSheet>::Style,
 }
 
@@ -66,7 +66,7 @@ where
     Renderer::Theme: StyleSheet,
 {
     /// The default height of a [`Slider`].
-    pub const DEFAULT_HEIGHT: u16 = 22;
+    pub const DEFAULT_HEIGHT: f32 = 22.0;
 
     /// Creates a new [`Slider`].
     ///
@@ -116,14 +116,14 @@ where
     }
 
     /// Sets the width of the [`Slider`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the height of the [`Slider`].
-    pub fn height(mut self, height: u16) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Pixels>) -> Self {
+        self.height = height.into().0;
         self
     }
 
@@ -172,9 +172,7 @@ where
         _renderer: &Renderer,
         limits: &layout::Limits,
     ) -> layout::Node {
-        let limits =
-            limits.width(self.width).height(Length::Units(self.height));
-
+        let limits = limits.width(self.width).height(self.height);
         let size = limits.resolve(Size::ZERO);
 
         layout::Node::new(size)
@@ -423,8 +421,8 @@ pub fn draw<T, R>(
     let handle_offset = if range_start >= range_end {
         0.0
     } else {
-        bounds.width * (value - range_start) / (range_end - range_start)
-            - handle_width / 2.0
+        (bounds.width - handle_width) * (value - range_start)
+            / (range_end - range_start)
     };
 
     renderer.fill_quad(

native/src/widget/space.rs

@@ -15,23 +15,26 @@ pub struct Space {
 
 impl Space {
     /// Creates an amount of empty [`Space`] with the given width and height.
-    pub fn new(width: Length, height: Length) -> Self {
-        Space { width, height }
+    pub fn new(width: impl Into<Length>, height: impl Into<Length>) -> Self {
+        Space {
+            width: width.into(),
+            height: height.into(),
+        }
     }
 
     /// Creates an amount of horizontal [`Space`].
-    pub fn with_width(width: Length) -> Self {
+    pub fn with_width(width: impl Into<Length>) -> Self {
         Space {
-            width,
+            width: width.into(),
             height: Length::Shrink,
         }
     }
 
     /// Creates an amount of vertical [`Space`].
-    pub fn with_height(height: Length) -> Self {
+    pub fn with_height(height: impl Into<Length>) -> Self {
         Space {
             width: Length::Shrink,
-            height,
+            height: height.into(),
         }
     }
 }

native/src/widget/svg.rs

@@ -56,15 +56,15 @@ where
 
     /// Sets the width of the [`Svg`].
     #[must_use]
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the height of the [`Svg`].
     #[must_use]
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = height.into();
         self
     }
 

native/src/widget/text.rs

@@ -4,7 +4,7 @@ use crate::layout;
 use crate::renderer;
 use crate::text;
 use crate::widget::Tree;
-use crate::{Element, Layout, Length, Point, Rectangle, Size, Widget};
+use crate::{Element, Layout, Length, Pixels, Point, Rectangle, Size, Widget};
 
 use std::borrow::Cow;
 
@@ -32,7 +32,7 @@ where
     Renderer::Theme: StyleSheet,
 {
     content: Cow<'a, str>,
-    size: Option<u16>,
+    size: Option<f32>,
     width: Length,
     height: Length,
     horizontal_alignment: alignment::Horizontal,
@@ -61,8 +61,8 @@ where
     }
 
     /// Sets the size of the [`Text`].
-    pub fn size(mut self, size: u16) -> Self {
-        self.size = Some(size);
+    pub fn size(mut self, size: impl Into<Pixels>) -> Self {
+        self.size = Some(size.into().0);
         self
     }
 
@@ -84,14 +84,14 @@ where
     }
 
     /// Sets the width of the [`Text`] boundaries.
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the height of the [`Text`] boundaries.
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = height.into();
         self
     }
 
@@ -185,7 +185,7 @@ pub fn draw<Renderer>(
     style: &renderer::Style,
     layout: Layout<'_>,
     content: &str,
-    size: Option<u16>,
+    size: Option<f32>,
     font: Renderer::Font,
     appearance: Appearance,
     horizontal_alignment: alignment::Horizontal,
@@ -209,7 +209,7 @@ pub fn draw<Renderer>(
 
     renderer.fill_text(crate::text::Text {
         content,
-        size: f32::from(size.unwrap_or_else(|| renderer.default_size())),
+        size: size.unwrap_or_else(|| renderer.default_size()),
         bounds: Rectangle { x, y, ..bounds },
         color: appearance.color.unwrap_or(style.text_color),
         font,

native/src/widget/text_input.rs

@@ -25,7 +25,7 @@ use crate::widget::operation::{self, Operation};
 use crate::widget::tree::{self, Tree};
 use crate::window;
 use crate::{
-    Clipboard, Color, Command, Element, Layout, Length, Padding, Point,
+    Clipboard, Color, Command, Element, Layout, Length, Padding, Pixels, Point,
     Rectangle, Shell, Size, Vector, Widget,
 };
 
@@ -64,7 +64,7 @@ where
     font: Renderer::Font,
     width: Length,
     padding: Padding,
-    size: Option<u16>,
+    size: Option<f32>,
     on_change: Box<dyn Fn(String) -> Message + 'a>,
     on_paste: Option<Box<dyn Fn(String) -> Message + 'a>>,
     on_submit: Option<Message>,
@@ -94,7 +94,7 @@ where
             is_secure: false,
             font: Default::default(),
             width: Length::Fill,
-            padding: Padding::new(5),
+            padding: Padding::new(5.0),
             size: None,
             on_change: Box::new(on_change),
             on_paste: None,
@@ -133,8 +133,8 @@ where
         self
     }
     /// Sets the width of the [`TextInput`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
@@ -145,8 +145,8 @@ where
     }
 
     /// Sets the text size of the [`TextInput`].
-    pub fn size(mut self, size: u16) -> Self {
-        self.size = Some(size);
+    pub fn size(mut self, size: impl Into<Pixels>) -> Self {
+        self.size = Some(size.into().0);
         self
     }
 
@@ -379,7 +379,7 @@ pub fn layout<Renderer>(
     limits: &layout::Limits,
     width: Length,
     padding: Padding,
-    size: Option<u16>,
+    size: Option<f32>,
 ) -> layout::Node
 where
     Renderer: text::Renderer,
@@ -387,14 +387,10 @@ where
     let text_size = size.unwrap_or_else(|| renderer.default_size());
 
     let padding = padding.fit(Size::ZERO, limits.max());
-
-    let limits = limits
-        .pad(padding)
-        .width(width)
-        .height(Length::Units(text_size));
+    let limits = limits.width(width).pad(padding).height(text_size);
 
     let mut text = layout::Node::new(limits.resolve(Size::ZERO));
-    text.move_to(Point::new(padding.left.into(), padding.top.into()));
+    text.move_to(Point::new(padding.left, padding.top));
 
     layout::Node::with_children(text.size().pad(padding), vec![text])
 }
@@ -409,7 +405,7 @@ pub fn update<'a, Message, Renderer>(
     clipboard: &mut dyn Clipboard,
     shell: &mut Shell<'_, Message>,
     value: &mut Value,
-    size: Option<u16>,
+    size: Option<f32>,
     font: &Renderer::Font,
     is_secure: bool,
     on_change: &dyn Fn(String) -> Message,
@@ -815,7 +811,7 @@ pub fn draw<Renderer>(
     state: &State,
     value: &Value,
     placeholder: &str,
-    size: Option<u16>,
+    size: Option<f32>,
     font: &Renderer::Font,
     is_secure: bool,
     style: &<Renderer::Theme as StyleSheet>::Style,
@@ -969,7 +965,7 @@ pub fn draw<Renderer>(
                 width: f32::INFINITY,
                 ..text_bounds
             },
-            size: f32::from(size),
+            size,
             horizontal_alignment: alignment::Horizontal::Left,
             vertical_alignment: alignment::Vertical::Center,
         });
@@ -1128,7 +1124,7 @@ fn offset<Renderer>(
     renderer: &Renderer,
     text_bounds: Rectangle,
     font: Renderer::Font,
-    size: u16,
+    size: f32,
     value: &Value,
     state: &State,
 ) -> f32
@@ -1162,7 +1158,7 @@ fn measure_cursor_and_scroll_offset<Renderer>(
     renderer: &Renderer,
     text_bounds: Rectangle,
     value: &Value,
-    size: u16,
+    size: f32,
     cursor_index: usize,
     font: Renderer::Font,
 ) -> (f32, f32)
@@ -1185,7 +1181,7 @@ fn find_cursor_position<Renderer>(
     renderer: &Renderer,
     text_bounds: Rectangle,
     font: Renderer::Font,
-    size: Option<u16>,
+    size: Option<f32>,
     value: &Value,
     state: &State,
     x: f32,
@@ -1201,7 +1197,7 @@ where
     renderer
         .hit_test(
             &value.to_string(),
-            size.into(),
+            size,
             font,
             Size::INFINITY,
             Point::new(x + offset, text_bounds.height / 2.0),

native/src/widget/toggler.rs

@@ -7,8 +7,8 @@ use crate::renderer;
 use crate::text;
 use crate::widget::{self, Row, Text, Tree};
 use crate::{
-    Alignment, Clipboard, Element, Event, Layout, Length, Point, Rectangle,
-    Shell, Widget,
+    Alignment, Clipboard, Element, Event, Layout, Length, Pixels, Point,
+    Rectangle, Shell, Widget,
 };
 
 pub use iced_style::toggler::{Appearance, StyleSheet};
@@ -38,10 +38,10 @@ where
     on_toggle: Box<dyn Fn(bool) -> Message + 'a>,
     label: Option<String>,
     width: Length,
-    size: u16,
-    text_size: Option<u16>,
+    size: f32,
+    text_size: Option<f32>,
     text_alignment: alignment::Horizontal,
-    spacing: u16,
+    spacing: f32,
     font: Renderer::Font,
     style: <Renderer::Theme as StyleSheet>::Style,
 }
@@ -52,7 +52,7 @@ where
     Renderer::Theme: StyleSheet,
 {
     /// The default size of a [`Toggler`].
-    pub const DEFAULT_SIZE: u16 = 20;
+    pub const DEFAULT_SIZE: f32 = 20.0;
 
     /// Creates a new [`Toggler`].
     ///
@@ -78,27 +78,27 @@ where
             size: Self::DEFAULT_SIZE,
             text_size: None,
             text_alignment: alignment::Horizontal::Left,
-            spacing: 0,
+            spacing: 0.0,
             font: Renderer::Font::default(),
             style: Default::default(),
         }
     }
 
     /// Sets the size of the [`Toggler`].
-    pub fn size(mut self, size: u16) -> Self {
-        self.size = size;
+    pub fn size(mut self, size: impl Into<Pixels>) -> Self {
+        self.size = size.into().0;
         self
     }
 
     /// Sets the width of the [`Toggler`].
-    pub fn width(mut self, width: Length) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Length>) -> Self {
+        self.width = width.into();
         self
     }
 
     /// Sets the text size o the [`Toggler`].
-    pub fn text_size(mut self, text_size: u16) -> Self {
-        self.text_size = Some(text_size);
+    pub fn text_size(mut self, text_size: impl Into<Pixels>) -> Self {
+        self.text_size = Some(text_size.into().0);
         self
     }
 
@@ -109,8 +109,8 @@ where
     }
 
     /// Sets the spacing between the [`Toggler`] and the text.
-    pub fn spacing(mut self, spacing: u16) -> Self {
-        self.spacing = spacing;
+    pub fn spacing(mut self, spacing: impl Into<Pixels>) -> Self {
+        self.spacing = spacing.into().0;
         self
     }
 
@@ -169,11 +169,7 @@ where
             );
         }
 
-        row = row.push(
-            Row::new()
-                .width(Length::Units(2 * self.size))
-                .height(Length::Units(self.size)),
-        );
+        row = row.push(Row::new().width(2.0 * self.size).height(self.size));
 
         row.layout(renderer, limits)
     }

native/src/widget/tooltip.rs

@@ -9,8 +9,8 @@ use crate::widget::container;
 use crate::widget::overlay;
 use crate::widget::{Text, Tree};
 use crate::{
-    Clipboard, Element, Event, Layout, Length, Padding, Point, Rectangle,
-    Shell, Size, Vector, Widget,
+    Clipboard, Element, Event, Layout, Length, Padding, Pixels, Point,
+    Rectangle, Shell, Size, Vector, Widget,
 };
 
 use std::borrow::Cow;
@@ -25,8 +25,8 @@ where
     content: Element<'a, Message, Renderer>,
     tooltip: Text<'a, Renderer>,
     position: Position,
-    gap: u16,
-    padding: u16,
+    gap: f32,
+    padding: f32,
     snap_within_viewport: bool,
     style: <Renderer::Theme as container::StyleSheet>::Style,
 }
@@ -37,7 +37,7 @@ where
     Renderer::Theme: container::StyleSheet + widget::text::StyleSheet,
 {
     /// The default padding of a [`Tooltip`] drawn by this renderer.
-    const DEFAULT_PADDING: u16 = 5;
+    const DEFAULT_PADDING: f32 = 5.0;
 
     /// Creates a new [`Tooltip`].
     ///
@@ -51,7 +51,7 @@ where
             content: content.into(),
             tooltip: Text::new(tooltip),
             position,
-            gap: 0,
+            gap: 0.0,
             padding: Self::DEFAULT_PADDING,
             snap_within_viewport: true,
             style: Default::default(),
@@ -59,7 +59,7 @@ where
     }
 
     /// Sets the size of the text of the [`Tooltip`].
-    pub fn size(mut self, size: u16) -> Self {
+    pub fn size(mut self, size: impl Into<Pixels>) -> Self {
         self.tooltip = self.tooltip.size(size);
         self
     }
@@ -73,14 +73,14 @@ where
     }
 
     /// Sets the gap between the content and its [`Tooltip`].
-    pub fn gap(mut self, gap: u16) -> Self {
-        self.gap = gap;
+    pub fn gap(mut self, gap: impl Into<Pixels>) -> Self {
+        self.gap = gap.into().0;
         self
     }
 
     /// Sets the padding of the [`Tooltip`].
-    pub fn padding(mut self, padding: u16) -> Self {
-        self.padding = padding;
+    pub fn padding(mut self, padding: impl Into<Pixels>) -> Self {
+        self.padding = padding.into().0;
         self
     }
 
@@ -272,8 +272,8 @@ pub fn draw<Renderer>(
     cursor_position: Point,
     viewport: &Rectangle,
     position: Position,
-    gap: u16,
-    padding: u16,
+    gap: f32,
+    padding: f32,
     snap_within_viewport: bool,
     style: &<Renderer::Theme as container::StyleSheet>::Style,
     layout_text: impl FnOnce(&Renderer, &layout::Limits) -> layout::Node,
@@ -293,7 +293,6 @@ pub fn draw<Renderer>(
     let bounds = layout.bounds();
 
     if bounds.contains(cursor_position) {
-        let gap = f32::from(gap);
         let style = theme.appearance(style);
 
         let defaults = renderer::Style {
@@ -311,7 +310,6 @@ pub fn draw<Renderer>(
             .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 = bounds.y + (bounds.height - text_bounds.height) / 2.0;

native/src/widget/vertical_slider.rs

@@ -9,7 +9,7 @@ use crate::event::{self, Event};
 use crate::widget::tree::{self, Tree};
 use crate::{
     layout, mouse, renderer, touch, Background, Clipboard, Color, Element,
-    Layout, Length, Point, Rectangle, Shell, Size, Widget,
+    Layout, Length, Pixels, Point, Rectangle, Shell, Size, Widget,
 };
 
 /// An vertical bar and a handle that selects a single value from a range of
@@ -47,7 +47,7 @@ where
     value: T,
     on_change: Box<dyn Fn(T) -> Message + 'a>,
     on_release: Option<Message>,
-    width: u16,
+    width: f32,
     height: Length,
     style: <Renderer::Theme as StyleSheet>::Style,
 }
@@ -60,7 +60,7 @@ where
     Renderer::Theme: StyleSheet,
 {
     /// The default width of a [`VerticalSlider`].
-    pub const DEFAULT_WIDTH: u16 = 22;
+    pub const DEFAULT_WIDTH: f32 = 22.0;
 
     /// Creates a new [`VerticalSlider`].
     ///
@@ -110,14 +110,14 @@ where
     }
 
     /// Sets the width of the [`VerticalSlider`].
-    pub fn width(mut self, width: u16) -> Self {
-        self.width = width;
+    pub fn width(mut self, width: impl Into<Pixels>) -> Self {
+        self.width = width.into().0;
         self
     }
 
     /// Sets the height of the [`VerticalSlider`].
-    pub fn height(mut self, height: Length) -> Self {
-        self.height = height;
+    pub fn height(mut self, height: impl Into<Length>) -> Self {
+        self.height = height.into();
         self
     }
 
@@ -166,9 +166,7 @@ where
         _renderer: &Renderer,
         limits: &layout::Limits,
     ) -> layout::Node {
-        let limits =
-            limits.width(Length::Units(self.width)).height(self.height);
-
+        let limits = limits.width(self.width).height(self.height);
         let size = limits.resolve(Size::ZERO);
 
         layout::Node::new(size)
@@ -418,8 +416,8 @@ pub fn draw<T, R>(
     let handle_offset = if range_start >= range_end {
         0.0
     } else {
-        bounds.height * (value - range_end) / (range_start - range_end)
-            - handle_width / 2.0
+        (bounds.height - handle_width) * (value - range_end)
+            / (range_start - range_end)
     };
 
     renderer.fill_quad(

native/src/window/action.rs

@@ -70,6 +70,14 @@ pub enum Action<T> {
     ///
     /// - **Web / Wayland:** Unsupported.
     GainFocus,
+    /// Change whether or not the window will always be on top of other windows.
+    ///
+    /// ## Platform-specific
+    ///
+    /// - **Web / Wayland:** Unsupported.
+    ChangeAlwaysOnTop(bool),
+    /// Fetch an identifier unique to the window.
+    FetchId(Box<dyn FnOnce(u64) -> T + 'static>),
 }
 
 impl<T> Action<T> {
@@ -85,8 +93,8 @@ impl<T> Action<T> {
             Self::Close => Action::Close,
             Self::Drag => Action::Drag,
             Self::Resize { width, height } => Action::Resize { width, height },
-            Self::Maximize(bool) => Action::Maximize(bool),
-            Self::Minimize(bool) => Action::Minimize(bool),
+            Self::Maximize(maximized) => Action::Maximize(maximized),
+            Self::Minimize(minimized) => Action::Minimize(minimized),
             Self::Move { x, y } => Action::Move { x, y },
             Self::ChangeMode(mode) => Action::ChangeMode(mode),
             Self::FetchMode(o) => Action::FetchMode(Box::new(move |s| f(o(s)))),
@@ -96,6 +104,10 @@ impl<T> Action<T> {
                 Action::RequestUserAttention(attention_type)
             }
             Self::GainFocus => Action::GainFocus,
+            Self::ChangeAlwaysOnTop(on_top) => {
+                Action::ChangeAlwaysOnTop(on_top)
+            }
+            Self::FetchId(o) => Action::FetchId(Box::new(move |s| f(o(s)))),
         }
     }
 }
@@ -109,8 +121,12 @@ impl<T> fmt::Debug for Action<T> {
                 f,
                 "Action::Resize {{ widget: {width}, height: {height} }}"
             ),
-            Self::Maximize(value) => write!(f, "Action::Maximize({value})"),
-            Self::Minimize(value) => write!(f, "Action::Minimize({value}"),
+            Self::Maximize(maximized) => {
+                write!(f, "Action::Maximize({maximized})")
+            }
+            Self::Minimize(minimized) => {
+                write!(f, "Action::Minimize({minimized}")
+            }
             Self::Move { x, y } => {
                 write!(f, "Action::Move {{ x: {x}, y: {y} }}")
             }
@@ -122,6 +138,10 @@ impl<T> fmt::Debug for Action<T> {
                 write!(f, "Action::RequestUserAttention")
             }
             Self::GainFocus => write!(f, "Action::GainFocus"),
+            Self::ChangeAlwaysOnTop(on_top) => {
+                write!(f, "Action::AlwaysOnTop({on_top})")
+            }
+            Self::FetchId(_) => write!(f, "Action::FetchId"),
         }
     }
 }