From 664251f3f5c7b76f69a97683af1468094bba887f Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Sat, 14 May 2022 01:47:55 +0200 Subject: Draft first-class `Theme` support RFC: https://github.com/iced-rs/rfcs/pull/6 --- native/src/widget/button.rs | 40 +++++++++++++++++++++----------- native/src/widget/checkbox.rs | 1 + native/src/widget/column.rs | 10 +++++++- native/src/widget/container.rs | 2 ++ native/src/widget/image.rs | 1 + native/src/widget/image/viewer.rs | 1 + native/src/widget/pane_grid.rs | 10 +++++++- native/src/widget/pane_grid/content.rs | 13 +++++++++-- native/src/widget/pane_grid/title_bar.rs | 3 +++ native/src/widget/pick_list.rs | 1 + native/src/widget/progress_bar.rs | 1 + native/src/widget/radio.rs | 1 + native/src/widget/row.rs | 10 +++++++- native/src/widget/rule.rs | 1 + native/src/widget/scrollable.rs | 2 ++ native/src/widget/slider.rs | 1 + native/src/widget/space.rs | 1 + native/src/widget/svg.rs | 1 + native/src/widget/text.rs | 1 + native/src/widget/text_input.rs | 1 + native/src/widget/toggler.rs | 1 + native/src/widget/tooltip.rs | 3 +++ 22 files changed, 88 insertions(+), 18 deletions(-) (limited to 'native/src/widget') diff --git a/native/src/widget/button.rs b/native/src/widget/button.rs index b03d9f27..09c59cbe 100644 --- a/native/src/widget/button.rs +++ b/native/src/widget/button.rs @@ -55,20 +55,26 @@ pub use iced_style::button::{Style, StyleSheet}; /// } /// ``` #[allow(missing_debug_implementations)] -pub struct Button<'a, Message, Renderer> { +pub struct Button<'a, Message, Renderer> +where + Renderer: crate::Renderer, + Renderer::Theme: StyleSheet, +{ state: &'a mut State, content: Element<'a, Message, Renderer>, on_press: Option, width: Length, height: Length, padding: Padding, - style_sheet: Box, + variant: ::Variant, } impl<'a, Message, Renderer> Button<'a, Message, Renderer> where Message: Clone, Renderer: crate::Renderer, + Renderer::Theme: StyleSheet, + ::Variant: Default, { /// Creates a new [`Button`] with some local [`State`] and the given /// content. @@ -83,7 +89,7 @@ where width: Length::Shrink, height: Length::Shrink, padding: Padding::new(5), - style_sheet: Default::default(), + variant: ::Variant::default(), } } @@ -112,12 +118,12 @@ where self } - /// Sets the style of the [`Button`]. + /// Sets the style variant of this [`Button`]. pub fn style( mut self, - style_sheet: impl Into>, + variant: ::Variant, ) -> Self { - self.style_sheet = style_sheet.into(); + self.variant = variant; self } } @@ -190,28 +196,29 @@ pub fn update<'a, Message: Clone>( } /// Draws a [`Button`]. -pub fn draw<'a, Renderer: crate::Renderer>( +pub fn draw<'a, Renderer: crate::Renderer, Variant>( renderer: &mut Renderer, bounds: Rectangle, cursor_position: Point, is_enabled: bool, - style_sheet: &dyn StyleSheet, + style_sheet: &dyn StyleSheet, + variation: Variant, state: impl FnOnce() -> &'a State, ) -> Style { let is_mouse_over = bounds.contains(cursor_position); let styling = if !is_enabled { - style_sheet.disabled() + style_sheet.disabled(variation) } else if is_mouse_over { let state = state(); if state.is_pressed { - style_sheet.pressed() + style_sheet.pressed(variation) } else { - style_sheet.hovered() + style_sheet.hovered(variation) } } else { - style_sheet.active() + style_sheet.active(variation) }; if styling.background.is_some() || styling.border_width > 0.0 { @@ -287,6 +294,8 @@ impl<'a, Message, Renderer> Widget where Message: Clone, Renderer: crate::Renderer, + Renderer::Theme: StyleSheet, + ::Variant: Copy, { fn width(&self) -> Length { self.width @@ -354,6 +363,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, _style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, @@ -367,12 +377,14 @@ where bounds, cursor_position, self.on_press.is_some(), - self.style_sheet.as_ref(), + theme, + self.variant, || &self.state, ); self.content.draw( renderer, + theme, &renderer::Style { text_color: styling.text_color, }, @@ -397,6 +409,8 @@ impl<'a, Message, Renderer> From> where Message: 'a + Clone, Renderer: 'a + crate::Renderer, + Renderer::Theme: StyleSheet, + ::Variant: Copy, { fn from( button: Button<'a, Message, Renderer>, diff --git a/native/src/widget/checkbox.rs b/native/src/widget/checkbox.rs index b6d920df..290cb114 100644 --- a/native/src/widget/checkbox.rs +++ b/native/src/widget/checkbox.rs @@ -197,6 +197,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, diff --git a/native/src/widget/column.rs b/native/src/widget/column.rs index 268218b1..01ddd9f1 100644 --- a/native/src/widget/column.rs +++ b/native/src/widget/column.rs @@ -187,13 +187,21 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, viewport: &Rectangle, ) { for (child, layout) in self.children.iter().zip(layout.children()) { - child.draw(renderer, style, layout, cursor_position, viewport); + child.draw( + renderer, + theme, + style, + layout, + cursor_position, + viewport, + ); } } diff --git a/native/src/widget/container.rs b/native/src/widget/container.rs index 0e7c301e..efcecb1e 100644 --- a/native/src/widget/container.rs +++ b/native/src/widget/container.rs @@ -209,6 +209,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, renderer_style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, @@ -220,6 +221,7 @@ where self.content.draw( renderer, + theme, &renderer::Style { text_color: style .text_color diff --git a/native/src/widget/image.rs b/native/src/widget/image.rs index 8e7a28e5..1e753219 100644 --- a/native/src/widget/image.rs +++ b/native/src/widget/image.rs @@ -136,6 +136,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, _style: &renderer::Style, layout: Layout<'_>, _cursor_position: Point, diff --git a/native/src/widget/image/viewer.rs b/native/src/widget/image/viewer.rs index 840b88e5..1aa75aa0 100644 --- a/native/src/widget/image/viewer.rs +++ b/native/src/widget/image/viewer.rs @@ -303,6 +303,7 @@ where fn draw( &self, renderer: &mut Renderer, + _theme: &Renderer::Theme, _style: &renderer::Style, layout: Layout<'_>, _cursor_position: Point, diff --git a/native/src/widget/pane_grid.rs b/native/src/widget/pane_grid.rs index 0ceec83e..fb056f79 100644 --- a/native/src/widget/pane_grid.rs +++ b/native/src/widget/pane_grid.rs @@ -754,6 +754,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, @@ -772,7 +773,14 @@ where self.style_sheet.as_ref(), self.elements.iter().map(|(pane, content)| (*pane, content)), |pane, renderer, style, layout, cursor_position, rectangle| { - pane.draw(renderer, style, layout, cursor_position, rectangle); + pane.draw( + renderer, + theme, + style, + layout, + cursor_position, + rectangle, + ); }, ) } diff --git a/native/src/widget/pane_grid/content.rs b/native/src/widget/pane_grid/content.rs index 407f5458..6b3ff680 100644 --- a/native/src/widget/pane_grid/content.rs +++ b/native/src/widget/pane_grid/content.rs @@ -59,6 +59,7 @@ where pub fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, @@ -81,6 +82,7 @@ where title_bar.draw( renderer, + theme, style, title_bar_layout, cursor_position, @@ -90,14 +92,21 @@ where self.body.draw( renderer, + theme, style, body_layout, cursor_position, viewport, ); } else { - self.body - .draw(renderer, style, layout, cursor_position, viewport); + self.body.draw( + renderer, + theme, + style, + layout, + cursor_position, + viewport, + ); } } diff --git a/native/src/widget/pane_grid/title_bar.rs b/native/src/widget/pane_grid/title_bar.rs index a10181af..1392d505 100644 --- a/native/src/widget/pane_grid/title_bar.rs +++ b/native/src/widget/pane_grid/title_bar.rs @@ -86,6 +86,7 @@ where pub fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, inherited_style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, @@ -108,6 +109,7 @@ where self.content.draw( renderer, + theme, &inherited_style, title_layout, cursor_position, @@ -120,6 +122,7 @@ where if show_controls || self.always_show_controls { controls.draw( renderer, + theme, &inherited_style, controls_layout, cursor_position, diff --git a/native/src/widget/pick_list.rs b/native/src/widget/pick_list.rs index 0374aef7..64a236e7 100644 --- a/native/src/widget/pick_list.rs +++ b/native/src/widget/pick_list.rs @@ -490,6 +490,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, _style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, diff --git a/native/src/widget/progress_bar.rs b/native/src/widget/progress_bar.rs index c26c38fa..2963451c 100644 --- a/native/src/widget/progress_bar.rs +++ b/native/src/widget/progress_bar.rs @@ -97,6 +97,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, _style: &renderer::Style, layout: Layout<'_>, _cursor_position: Point, diff --git a/native/src/widget/radio.rs b/native/src/widget/radio.rs index 657ae786..5d936eaf 100644 --- a/native/src/widget/radio.rs +++ b/native/src/widget/radio.rs @@ -211,6 +211,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, diff --git a/native/src/widget/row.rs b/native/src/widget/row.rs index 7a7c70c6..9cff74c6 100644 --- a/native/src/widget/row.rs +++ b/native/src/widget/row.rs @@ -187,13 +187,21 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, viewport: &Rectangle, ) { for (child, layout) in self.children.iter().zip(layout.children()) { - child.draw(renderer, style, layout, cursor_position, viewport); + child.draw( + renderer, + theme, + style, + layout, + cursor_position, + viewport, + ); } } diff --git a/native/src/widget/rule.rs b/native/src/widget/rule.rs index 69619583..fc3b0202 100644 --- a/native/src/widget/rule.rs +++ b/native/src/widget/rule.rs @@ -70,6 +70,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, _style: &renderer::Style, layout: Layout<'_>, _cursor_position: Point, diff --git a/native/src/widget/scrollable.rs b/native/src/widget/scrollable.rs index 8958f6da..5c59b8b2 100644 --- a/native/src/widget/scrollable.rs +++ b/native/src/widget/scrollable.rs @@ -702,6 +702,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, @@ -719,6 +720,7 @@ where |renderer, layout, cursor_position, viewport| { self.content.draw( renderer, + theme, style, layout, cursor_position, diff --git a/native/src/widget/slider.rs b/native/src/widget/slider.rs index f2e84ea9..3143aed9 100644 --- a/native/src/widget/slider.rs +++ b/native/src/widget/slider.rs @@ -410,6 +410,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, _style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, diff --git a/native/src/widget/space.rs b/native/src/widget/space.rs index 4135d1b8..81338306 100644 --- a/native/src/widget/space.rs +++ b/native/src/widget/space.rs @@ -60,6 +60,7 @@ where fn draw( &self, _renderer: &mut Renderer, + _theme: &Renderer::Theme, _style: &renderer::Style, _layout: Layout<'_>, _cursor_position: Point, diff --git a/native/src/widget/svg.rs b/native/src/widget/svg.rs index 008ab356..76b3eb8b 100644 --- a/native/src/widget/svg.rs +++ b/native/src/widget/svg.rs @@ -110,6 +110,7 @@ where fn draw( &self, renderer: &mut Renderer, + _theme: &Renderer::Theme, _style: &renderer::Style, layout: Layout<'_>, _cursor_position: Point, diff --git a/native/src/widget/text.rs b/native/src/widget/text.rs index a7855c30..5f7e9159 100644 --- a/native/src/widget/text.rs +++ b/native/src/widget/text.rs @@ -130,6 +130,7 @@ where fn draw( &self, renderer: &mut Renderer, + _theme: &Renderer::Theme, style: &renderer::Style, layout: Layout<'_>, _cursor_position: Point, diff --git a/native/src/widget/text_input.rs b/native/src/widget/text_input.rs index 5ecd68e9..8230398c 100644 --- a/native/src/widget/text_input.rs +++ b/native/src/widget/text_input.rs @@ -812,6 +812,7 @@ where fn draw( &self, renderer: &mut Renderer, + _theme: &Renderer::Theme, _style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, diff --git a/native/src/widget/toggler.rs b/native/src/widget/toggler.rs index 6d7592f3..c19b9a32 100644 --- a/native/src/widget/toggler.rs +++ b/native/src/widget/toggler.rs @@ -208,6 +208,7 @@ where fn draw( &self, renderer: &mut Renderer, + _theme: &Renderer::Theme, style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, diff --git a/native/src/widget/tooltip.rs b/native/src/widget/tooltip.rs index c929395f..141aa5c8 100644 --- a/native/src/widget/tooltip.rs +++ b/native/src/widget/tooltip.rs @@ -267,6 +267,7 @@ where fn draw( &self, renderer: &mut Renderer, + theme: &Renderer::Theme, inherited_style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, @@ -274,6 +275,7 @@ where ) { self.content.draw( renderer, + theme, inherited_style, layout, cursor_position, @@ -299,6 +301,7 @@ where Widget::<(), Renderer>::draw( tooltip, renderer, + theme, defaults, layout, cursor_position, -- cgit From 3a820b45f336398c48f8bedf7b8c4b8af876efff Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Thu, 26 May 2022 00:40:27 +0200 Subject: Implement theme styling for `Slider` --- native/src/widget/slider.rs | 46 +++++++++++++++++++++++++++++---------------- 1 file changed, 30 insertions(+), 16 deletions(-) (limited to 'native/src/widget') diff --git a/native/src/widget/slider.rs b/native/src/widget/slider.rs index 3143aed9..f42bca28 100644 --- a/native/src/widget/slider.rs +++ b/native/src/widget/slider.rs @@ -40,7 +40,11 @@ pub use iced_style::slider::{Handle, HandleShape, Style, StyleSheet}; /// /// ![Slider drawn by Coffee's renderer](https://github.com/hecrj/coffee/blob/bda9818f823dfcb8a7ad0ff4940b4d4b387b5208/images/ui/slider.png?raw=true) #[allow(missing_debug_implementations)] -pub struct Slider<'a, T, Message> { +pub struct Slider<'a, T, Message, Renderer> +where + Renderer: crate::Renderer, + Renderer::Theme: StyleSheet, +{ state: &'a mut State, range: RangeInclusive, step: T, @@ -49,13 +53,15 @@ pub struct Slider<'a, T, Message> { on_release: Option, width: Length, height: u16, - style_sheet: Box, + variant: ::Variant, } -impl<'a, T, Message> Slider<'a, T, Message> +impl<'a, T, Message, Renderer> Slider<'a, T, Message, Renderer> where T: Copy + From + std::cmp::PartialOrd, Message: Clone, + Renderer: crate::Renderer, + Renderer::Theme: StyleSheet, { /// The default height of a [`Slider`]. pub const DEFAULT_HEIGHT: u16 = 22; @@ -99,7 +105,7 @@ where on_release: None, width: Length::Fill, height: Self::DEFAULT_HEIGHT, - style_sheet: Default::default(), + variant: Default::default(), } } @@ -129,9 +135,9 @@ where /// Sets the style of the [`Slider`]. pub fn style( mut self, - style_sheet: impl Into>, + variant: impl Into<::Variant>, ) -> Self { - self.style_sheet = style_sheet.into(); + self.variant = variant.into(); self } @@ -230,26 +236,29 @@ where } /// Draws a [`Slider`]. -pub fn draw( - renderer: &mut impl crate::Renderer, +pub fn draw( + renderer: &mut R, layout: Layout<'_>, cursor_position: Point, state: &State, value: T, range: &RangeInclusive, - style_sheet: &dyn StyleSheet, + style_sheet: &dyn StyleSheet::Variant>, + variant: ::Variant, ) where T: Into + Copy, + R: crate::Renderer, + R::Theme: StyleSheet, { let bounds = layout.bounds(); let is_mouse_over = bounds.contains(cursor_position); let style = if state.is_dragging { - style_sheet.dragging() + style_sheet.dragging(variant) } else if is_mouse_over { - style_sheet.hovered() + style_sheet.hovered(variant) } else { - style_sheet.active() + style_sheet.active(variant) }; let rail_y = bounds.y + (bounds.height / 2.0).round(); @@ -357,11 +366,12 @@ impl State { } impl<'a, T, Message, Renderer> Widget - for Slider<'a, T, Message> + for Slider<'a, T, Message, Renderer> where T: Copy + Into + num_traits::FromPrimitive, Message: Clone, Renderer: crate::Renderer, + Renderer::Theme: StyleSheet, { fn width(&self) -> Length { self.width @@ -423,7 +433,8 @@ where &self.state, self.value, &self.range, - self.style_sheet.as_ref(), + theme, + self.variant, ) } @@ -438,14 +449,17 @@ where } } -impl<'a, T, Message, Renderer> From> +impl<'a, T, Message, Renderer> From> for Element<'a, Message, Renderer> where T: 'a + Copy + Into + num_traits::FromPrimitive, Message: 'a + Clone, Renderer: 'a + crate::Renderer, + Renderer::Theme: StyleSheet, { - fn from(slider: Slider<'a, T, Message>) -> Element<'a, Message, Renderer> { + fn from( + slider: Slider<'a, T, Message, Renderer>, + ) -> Element<'a, Message, Renderer> { Element::new(slider) } } -- cgit From cf0230072c01ea9523f4d98a3656f5c975b3f347 Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Thu, 26 May 2022 23:07:34 +0200 Subject: Rename `Variant` to `Style` and `Style` to `Appearance` --- native/src/widget/button.rs | 38 ++++++++++++++++++++------------------ native/src/widget/slider.rs | 22 +++++++++++----------- 2 files changed, 31 insertions(+), 29 deletions(-) (limited to 'native/src/widget') diff --git a/native/src/widget/button.rs b/native/src/widget/button.rs index 09c59cbe..d4e88424 100644 --- a/native/src/widget/button.rs +++ b/native/src/widget/button.rs @@ -12,7 +12,7 @@ use crate::{ Rectangle, Shell, Vector, Widget, }; -pub use iced_style::button::{Style, StyleSheet}; +pub use iced_style::button::{Appearance, StyleSheet}; /// A generic widget that produces a message when pressed. /// @@ -66,7 +66,7 @@ where width: Length, height: Length, padding: Padding, - variant: ::Variant, + style: ::Style, } impl<'a, Message, Renderer> Button<'a, Message, Renderer> @@ -74,7 +74,6 @@ where Message: Clone, Renderer: crate::Renderer, Renderer::Theme: StyleSheet, - ::Variant: Default, { /// Creates a new [`Button`] with some local [`State`] and the given /// content. @@ -89,7 +88,7 @@ where width: Length::Shrink, height: Length::Shrink, padding: Padding::new(5), - variant: ::Variant::default(), + style: Default::default(), } } @@ -118,12 +117,12 @@ where self } - /// Sets the style variant of this [`Button`]. + /// Sets the style of this [`Button`]. pub fn style( mut self, - variant: ::Variant, + style: ::Style, ) -> Self { - self.variant = variant; + self.style = style; self } } @@ -196,29 +195,34 @@ pub fn update<'a, Message: Clone>( } /// Draws a [`Button`]. -pub fn draw<'a, Renderer: crate::Renderer, Variant>( +pub fn draw<'a, Renderer: crate::Renderer>( renderer: &mut Renderer, bounds: Rectangle, cursor_position: Point, is_enabled: bool, - style_sheet: &dyn StyleSheet, - variation: Variant, + style_sheet: &dyn StyleSheet< + Style = ::Style, + >, + style: ::Style, state: impl FnOnce() -> &'a State, -) -> Style { +) -> Appearance +where + Renderer::Theme: StyleSheet, +{ let is_mouse_over = bounds.contains(cursor_position); let styling = if !is_enabled { - style_sheet.disabled(variation) + style_sheet.disabled(style) } else if is_mouse_over { let state = state(); if state.is_pressed { - style_sheet.pressed(variation) + style_sheet.pressed(style) } else { - style_sheet.hovered(variation) + style_sheet.hovered(style) } } else { - style_sheet.active(variation) + style_sheet.active(style) }; if styling.background.is_some() || styling.border_width > 0.0 { @@ -295,7 +299,6 @@ where Message: Clone, Renderer: crate::Renderer, Renderer::Theme: StyleSheet, - ::Variant: Copy, { fn width(&self) -> Length { self.width @@ -378,7 +381,7 @@ where cursor_position, self.on_press.is_some(), theme, - self.variant, + self.style, || &self.state, ); @@ -410,7 +413,6 @@ where Message: 'a + Clone, Renderer: 'a + crate::Renderer, Renderer::Theme: StyleSheet, - ::Variant: Copy, { fn from( button: Button<'a, Message, Renderer>, diff --git a/native/src/widget/slider.rs b/native/src/widget/slider.rs index f42bca28..7042e0ad 100644 --- a/native/src/widget/slider.rs +++ b/native/src/widget/slider.rs @@ -13,7 +13,7 @@ use crate::{ use std::ops::RangeInclusive; -pub use iced_style::slider::{Handle, HandleShape, Style, StyleSheet}; +pub use iced_style::slider::{Appearance, Handle, HandleShape, StyleSheet}; /// An horizontal bar and a handle that selects a single value from a range of /// values. @@ -53,7 +53,7 @@ where on_release: Option, width: Length, height: u16, - variant: ::Variant, + style: ::Style, } impl<'a, T, Message, Renderer> Slider<'a, T, Message, Renderer> @@ -105,7 +105,7 @@ where on_release: None, width: Length::Fill, height: Self::DEFAULT_HEIGHT, - variant: Default::default(), + style: Default::default(), } } @@ -135,9 +135,9 @@ where /// Sets the style of the [`Slider`]. pub fn style( mut self, - variant: impl Into<::Variant>, + style: impl Into<::Style>, ) -> Self { - self.variant = variant.into(); + self.style = style.into(); self } @@ -243,8 +243,8 @@ pub fn draw( state: &State, value: T, range: &RangeInclusive, - style_sheet: &dyn StyleSheet::Variant>, - variant: ::Variant, + style_sheet: &dyn StyleSheet