From 7d2d813343baae10c2667590463385d50abb784c Mon Sep 17 00:00:00 2001 From: Giuliano Bellini s294739 Date: Mon, 23 Jan 2023 16:57:24 +0100 Subject: [PATCH 1/6] added new style for scrollable, to be applied when mouse is over the scrollable area --- native/src/widget/scrollable.rs | 4 ++++ style/src/scrollable.rs | 10 ++++++++++ 2 files changed, 14 insertions(+) diff --git a/native/src/widget/scrollable.rs b/native/src/widget/scrollable.rs index 822860364d..de6eacb551 100644 --- a/native/src/widget/scrollable.rs +++ b/native/src/widget/scrollable.rs @@ -856,6 +856,8 @@ pub fn draw( theme.dragging(style) } else if mouse_over_y_scrollbar { theme.hovered(style) + } else if mouse_over_scrollable { + theme.focused(style) } else { theme.active(style) }; @@ -869,6 +871,8 @@ pub fn draw( theme.dragging_horizontal(style) } else if mouse_over_x_scrollbar { theme.hovered_horizontal(style) + } else if mouse_over_scrollable { + theme.focused_horizontal(style) } else { theme.active_horizontal(style) }; diff --git a/style/src/scrollable.rs b/style/src/scrollable.rs index 64ed8462f4..a3f3db209f 100644 --- a/style/src/scrollable.rs +++ b/style/src/scrollable.rs @@ -45,6 +45,11 @@ pub trait StyleSheet { self.hovered(style) } + /// Produces the style of a scrollbar when mouse is over the scrollable area. + fn focused(&self, style: &Self::Style) -> Scrollbar { + self.active(style) + } + /// Produces the style of an active horizontal scrollbar. fn active_horizontal(&self, style: &Self::Style) -> Scrollbar { self.active(style) @@ -59,4 +64,9 @@ pub trait StyleSheet { fn dragging_horizontal(&self, style: &Self::Style) -> Scrollbar { self.hovered_horizontal(style) } + + /// Produces the style of a horizontal scrollbar when mouse is over the scrollable area. + fn focused_horizontal(&self, style: &Self::Style) -> Scrollbar { + self.active_horizontal(style) + } } From eaa2238600a0d3055b379592c7a3f8e6453b9dc7 Mon Sep 17 00:00:00 2001 From: Giuliano Bellini s294739 Date: Mon, 23 Jan 2023 17:32:08 +0100 Subject: [PATCH 2/6] debugging focused style not working --- native/src/widget/scrollable.rs | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/native/src/widget/scrollable.rs b/native/src/widget/scrollable.rs index de6eacb551..718140347b 100644 --- a/native/src/widget/scrollable.rs +++ b/native/src/widget/scrollable.rs @@ -859,7 +859,7 @@ pub fn draw( } else if mouse_over_scrollable { theme.focused(style) } else { - theme.active(style) + theme.focused(style) }; draw_scrollbar(renderer, style, &scrollbar); @@ -874,7 +874,7 @@ pub fn draw( } else if mouse_over_scrollable { theme.focused_horizontal(style) } else { - theme.active_horizontal(style) + theme.focused_horizontal(style) }; draw_scrollbar(renderer, style, &scrollbar); From 49e9a9a5379c1e9a9469045ca9a51ffb860ee620 Mon Sep 17 00:00:00 2001 From: Giuliano Bellini s294739 Date: Mon, 23 Jan 2023 17:56:39 +0100 Subject: [PATCH 3/6] added function focused and focused_horizontal to theme.rs --- native/src/widget/scrollable.rs | 4 ++-- style/src/theme.rs | 17 +++++++++++++++++ 2 files changed, 19 insertions(+), 2 deletions(-) diff --git a/native/src/widget/scrollable.rs b/native/src/widget/scrollable.rs index 718140347b..de6eacb551 100644 --- a/native/src/widget/scrollable.rs +++ b/native/src/widget/scrollable.rs @@ -859,7 +859,7 @@ pub fn draw( } else if mouse_over_scrollable { theme.focused(style) } else { - theme.focused(style) + theme.active(style) }; draw_scrollbar(renderer, style, &scrollbar); @@ -874,7 +874,7 @@ pub fn draw( } else if mouse_over_scrollable { theme.focused_horizontal(style) } else { - theme.focused_horizontal(style) + theme.active_horizontal(style) }; draw_scrollbar(renderer, style, &scrollbar); diff --git a/style/src/theme.rs b/style/src/theme.rs index 55bfa4cab4..8d40bda113 100644 --- a/style/src/theme.rs +++ b/style/src/theme.rs @@ -935,6 +935,13 @@ impl scrollable::StyleSheet for Theme { } } + fn focused(&self, style: &Self::Style) -> scrollable::Scrollbar { + match style { + Scrollable::Default => self.active(style), + Scrollable::Custom(custom) => custom.focused(self), + } + } + fn active_horizontal(&self, style: &Self::Style) -> scrollable::Scrollbar { match style { Scrollable::Default => self.active(style), @@ -958,6 +965,16 @@ impl scrollable::StyleSheet for Theme { Scrollable::Custom(custom) => custom.dragging_horizontal(self), } } + + fn focused_horizontal( + &self, + style: &Self::Style, + ) -> scrollable::Scrollbar { + match style { + Scrollable::Default => self.active_horizontal(style), + Scrollable::Custom(custom) => custom.focused_horizontal(self), + } + } } /// The style of text. From c337bf297d1836c429cd24964e8b3bdcc13850be Mon Sep 17 00:00:00 2001 From: Giuliano Bellini s294739 Date: Sat, 25 Mar 2023 01:05:56 +0100 Subject: [PATCH 4/6] renamed scrollable styles --- native/src/widget/scrollable.rs | 8 ++++---- style/src/scrollable.rs | 14 +++++++------- style/src/theme.rs | 20 ++++++++++---------- 3 files changed, 21 insertions(+), 21 deletions(-) diff --git a/native/src/widget/scrollable.rs b/native/src/widget/scrollable.rs index b88b77e51d..be81bee13b 100644 --- a/native/src/widget/scrollable.rs +++ b/native/src/widget/scrollable.rs @@ -858,9 +858,9 @@ pub fn draw( let style = if state.y_scroller_grabbed_at.is_some() { theme.dragging(style) } else if mouse_over_y_scrollbar { - theme.hovered(style) + theme.hovered_scrollbar(style) } else if mouse_over_scrollable { - theme.focused(style) + theme.hovered(style) } else { theme.active(style) }; @@ -873,9 +873,9 @@ pub fn draw( let style = if state.x_scroller_grabbed_at.is_some() { theme.dragging_horizontal(style) } else if mouse_over_x_scrollbar { - theme.hovered_horizontal(style) + theme.hovered_scrollbar_horizontal(style) } else if mouse_over_scrollable { - theme.focused_horizontal(style) + theme.hovered_horizontal(style) } else { theme.active_horizontal(style) }; diff --git a/style/src/scrollable.rs b/style/src/scrollable.rs index a3f3db209f..f3c04235bd 100644 --- a/style/src/scrollable.rs +++ b/style/src/scrollable.rs @@ -38,15 +38,15 @@ pub trait StyleSheet { fn active(&self, style: &Self::Style) -> Scrollbar; /// Produces the style of a hovered scrollbar. - fn hovered(&self, style: &Self::Style) -> Scrollbar; + fn hovered_scrollbar(&self, style: &Self::Style) -> Scrollbar; /// Produces the style of a scrollbar that is being dragged. fn dragging(&self, style: &Self::Style) -> Scrollbar { - self.hovered(style) + self.hovered_scrollbar(style) } /// Produces the style of a scrollbar when mouse is over the scrollable area. - fn focused(&self, style: &Self::Style) -> Scrollbar { + fn hovered(&self, style: &Self::Style) -> Scrollbar { self.active(style) } @@ -56,17 +56,17 @@ pub trait StyleSheet { } /// Produces the style of a hovered horizontal scrollbar. - fn hovered_horizontal(&self, style: &Self::Style) -> Scrollbar { - self.hovered(style) + fn hovered_scrollbar_horizontal(&self, style: &Self::Style) -> Scrollbar { + self.hovered_scrollbar(style) } /// Produces the style of a horizontal scrollbar that is being dragged. fn dragging_horizontal(&self, style: &Self::Style) -> Scrollbar { - self.hovered_horizontal(style) + self.hovered_scrollbar_horizontal(style) } /// Produces the style of a horizontal scrollbar when mouse is over the scrollable area. - fn focused_horizontal(&self, style: &Self::Style) -> Scrollbar { + fn hovered_horizontal(&self, style: &Self::Style) -> Scrollbar { self.active_horizontal(style) } } diff --git a/style/src/theme.rs b/style/src/theme.rs index 1d26256272..9a3105b52f 100644 --- a/style/src/theme.rs +++ b/style/src/theme.rs @@ -906,7 +906,7 @@ impl scrollable::StyleSheet for Theme { } } - fn hovered(&self, style: &Self::Style) -> scrollable::Scrollbar { + fn hovered_scrollbar(&self, style: &Self::Style) -> scrollable::Scrollbar { match style { Scrollable::Default => { let palette = self.extended_palette(); @@ -924,21 +924,21 @@ impl scrollable::StyleSheet for Theme { }, } } - Scrollable::Custom(custom) => custom.hovered(self), + Scrollable::Custom(custom) => custom.hovered_scrollbar(self), } } fn dragging(&self, style: &Self::Style) -> scrollable::Scrollbar { match style { - Scrollable::Default => self.hovered(style), + Scrollable::Default => self.hovered_scrollbar(style), Scrollable::Custom(custom) => custom.dragging(self), } } - fn focused(&self, style: &Self::Style) -> scrollable::Scrollbar { + fn hovered(&self, style: &Self::Style) -> scrollable::Scrollbar { match style { Scrollable::Default => self.active(style), - Scrollable::Custom(custom) => custom.focused(self), + Scrollable::Custom(custom) => custom.hovered(self), } } @@ -949,10 +949,10 @@ impl scrollable::StyleSheet for Theme { } } - fn hovered_horizontal(&self, style: &Self::Style) -> scrollable::Scrollbar { + fn hovered_scrollbar_horizontal(&self, style: &Self::Style) -> scrollable::Scrollbar { match style { - Scrollable::Default => self.hovered(style), - Scrollable::Custom(custom) => custom.hovered_horizontal(self), + Scrollable::Default => self.hovered_scrollbar(style), + Scrollable::Custom(custom) => custom.hovered_scrollbar_horizontal(self), } } @@ -966,13 +966,13 @@ impl scrollable::StyleSheet for Theme { } } - fn focused_horizontal( + fn hovered_horizontal( &self, style: &Self::Style, ) -> scrollable::Scrollbar { match style { Scrollable::Default => self.active_horizontal(style), - Scrollable::Custom(custom) => custom.focused_horizontal(self), + Scrollable::Custom(custom) => custom.hovered_horizontal(self), } } } From c407b4504cd5e7dcb04a8fd31ad0400c891fc3e1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A9ctor=20Ram=C3=B3n=20Jim=C3=A9nez?= Date: Mon, 27 Mar 2023 15:51:32 +0200 Subject: [PATCH 5/6] Introduce `is_mouse_over_scrollbar` to `StyleSheet::hovered` for `Scrollable` --- examples/scrollable/src/main.rs | 36 +++++++++++++------ native/src/widget/scrollable.rs | 8 ++--- style/src/scrollable.rs | 32 ++++++++--------- style/src/theme.rs | 63 ++++++++++++++++----------------- 4 files changed, 73 insertions(+), 66 deletions(-) diff --git a/examples/scrollable/src/main.rs b/examples/scrollable/src/main.rs index 7c85896147..f8c5aa742f 100644 --- a/examples/scrollable/src/main.rs +++ b/examples/scrollable/src/main.rs @@ -339,22 +339,36 @@ impl scrollable::StyleSheet for ScrollbarCustomStyle { style.active(&theme::Scrollable::Default) } - fn hovered(&self, style: &Self::Style) -> Scrollbar { - style.hovered(&theme::Scrollable::Default) + fn hovered( + &self, + style: &Self::Style, + is_mouse_over_scrollbar: bool, + ) -> Scrollbar { + style.hovered(&theme::Scrollable::Default, is_mouse_over_scrollbar) } - fn hovered_horizontal(&self, style: &Self::Style) -> Scrollbar { - Scrollbar { - background: style.active(&theme::Scrollable::default()).background, - border_radius: 0.0, - border_width: 0.0, - border_color: Default::default(), - scroller: Scroller { - color: Color::from_rgb8(250, 85, 134), + fn hovered_horizontal( + &self, + style: &Self::Style, + is_mouse_over_scrollbar: bool, + ) -> Scrollbar { + if is_mouse_over_scrollbar { + Scrollbar { + background: style + .active(&theme::Scrollable::default()) + .background, border_radius: 0.0, border_width: 0.0, border_color: Default::default(), - }, + scroller: Scroller { + color: Color::from_rgb8(250, 85, 134), + border_radius: 0.0, + border_width: 0.0, + border_color: Default::default(), + }, + } + } else { + self.active(style) } } } diff --git a/native/src/widget/scrollable.rs b/native/src/widget/scrollable.rs index be81bee13b..d9cdf29618 100644 --- a/native/src/widget/scrollable.rs +++ b/native/src/widget/scrollable.rs @@ -857,10 +857,8 @@ pub fn draw( if let Some(scrollbar) = scrollbars.y { let style = if state.y_scroller_grabbed_at.is_some() { theme.dragging(style) - } else if mouse_over_y_scrollbar { - theme.hovered_scrollbar(style) } else if mouse_over_scrollable { - theme.hovered(style) + theme.hovered(style, mouse_over_y_scrollbar) } else { theme.active(style) }; @@ -872,10 +870,8 @@ pub fn draw( if let Some(scrollbar) = scrollbars.x { let style = if state.x_scroller_grabbed_at.is_some() { theme.dragging_horizontal(style) - } else if mouse_over_x_scrollbar { - theme.hovered_scrollbar_horizontal(style) } else if mouse_over_scrollable { - theme.hovered_horizontal(style) + theme.hovered_horizontal(style, mouse_over_x_scrollbar) } else { theme.active_horizontal(style) }; diff --git a/style/src/scrollable.rs b/style/src/scrollable.rs index f3c04235bd..64a91b694b 100644 --- a/style/src/scrollable.rs +++ b/style/src/scrollable.rs @@ -37,17 +37,16 @@ pub trait StyleSheet { /// Produces the style of an active scrollbar. fn active(&self, style: &Self::Style) -> Scrollbar; - /// Produces the style of a hovered scrollbar. - fn hovered_scrollbar(&self, style: &Self::Style) -> Scrollbar; + /// Produces the style of a scrollbar when the scrollable is being hovered. + fn hovered( + &self, + style: &Self::Style, + is_mouse_over_scrollbar: bool, + ) -> Scrollbar; /// Produces the style of a scrollbar that is being dragged. fn dragging(&self, style: &Self::Style) -> Scrollbar { - self.hovered_scrollbar(style) - } - - /// Produces the style of a scrollbar when mouse is over the scrollable area. - fn hovered(&self, style: &Self::Style) -> Scrollbar { - self.active(style) + self.hovered(style, true) } /// Produces the style of an active horizontal scrollbar. @@ -55,18 +54,17 @@ pub trait StyleSheet { self.active(style) } - /// Produces the style of a hovered horizontal scrollbar. - fn hovered_scrollbar_horizontal(&self, style: &Self::Style) -> Scrollbar { - self.hovered_scrollbar(style) + /// Produces the style of a horizontal scrollbar when the scrollable is being hovered. + fn hovered_horizontal( + &self, + style: &Self::Style, + is_mouse_over_scrollbar: bool, + ) -> Scrollbar { + self.hovered(style, is_mouse_over_scrollbar) } /// Produces the style of a horizontal scrollbar that is being dragged. fn dragging_horizontal(&self, style: &Self::Style) -> Scrollbar { - self.hovered_scrollbar_horizontal(style) - } - - /// Produces the style of a horizontal scrollbar when mouse is over the scrollable area. - fn hovered_horizontal(&self, style: &Self::Style) -> Scrollbar { - self.active_horizontal(style) + self.hovered(style, true) } } diff --git a/style/src/theme.rs b/style/src/theme.rs index 9a3105b52f..0ebd82a45a 100644 --- a/style/src/theme.rs +++ b/style/src/theme.rs @@ -906,42 +906,45 @@ impl scrollable::StyleSheet for Theme { } } - fn hovered_scrollbar(&self, style: &Self::Style) -> scrollable::Scrollbar { + fn hovered( + &self, + style: &Self::Style, + is_mouse_over_scrollbar: bool, + ) -> scrollable::Scrollbar { match style { Scrollable::Default => { - let palette = self.extended_palette(); + if is_mouse_over_scrollbar { + let palette = self.extended_palette(); - scrollable::Scrollbar { - background: palette.background.weak.color.into(), - border_radius: 2.0, - border_width: 0.0, - border_color: Color::TRANSPARENT, - scroller: scrollable::Scroller { - color: palette.primary.strong.color, + scrollable::Scrollbar { + background: palette.background.weak.color.into(), border_radius: 2.0, border_width: 0.0, border_color: Color::TRANSPARENT, - }, + scroller: scrollable::Scroller { + color: palette.primary.strong.color, + border_radius: 2.0, + border_width: 0.0, + border_color: Color::TRANSPARENT, + }, + } + } else { + self.active(style) } } - Scrollable::Custom(custom) => custom.hovered_scrollbar(self), + Scrollable::Custom(custom) => { + custom.hovered(self, is_mouse_over_scrollbar) + } } } fn dragging(&self, style: &Self::Style) -> scrollable::Scrollbar { match style { - Scrollable::Default => self.hovered_scrollbar(style), + Scrollable::Default => self.hovered(style, true), Scrollable::Custom(custom) => custom.dragging(self), } } - fn hovered(&self, style: &Self::Style) -> scrollable::Scrollbar { - match style { - Scrollable::Default => self.active(style), - Scrollable::Custom(custom) => custom.hovered(self), - } - } - fn active_horizontal(&self, style: &Self::Style) -> scrollable::Scrollbar { match style { Scrollable::Default => self.active(style), @@ -949,30 +952,26 @@ impl scrollable::StyleSheet for Theme { } } - fn hovered_scrollbar_horizontal(&self, style: &Self::Style) -> scrollable::Scrollbar { - match style { - Scrollable::Default => self.hovered_scrollbar(style), - Scrollable::Custom(custom) => custom.hovered_scrollbar_horizontal(self), - } - } - - fn dragging_horizontal( + fn hovered_horizontal( &self, style: &Self::Style, + is_mouse_over_scrollbar: bool, ) -> scrollable::Scrollbar { match style { - Scrollable::Default => self.hovered_horizontal(style), - Scrollable::Custom(custom) => custom.dragging_horizontal(self), + Scrollable::Default => self.hovered(style, is_mouse_over_scrollbar), + Scrollable::Custom(custom) => { + custom.hovered_horizontal(self, is_mouse_over_scrollbar) + } } } - fn hovered_horizontal( + fn dragging_horizontal( &self, style: &Self::Style, ) -> scrollable::Scrollbar { match style { - Scrollable::Default => self.active_horizontal(style), - Scrollable::Custom(custom) => custom.hovered_horizontal(self), + Scrollable::Default => self.hovered_horizontal(style, true), + Scrollable::Custom(custom) => custom.dragging_horizontal(self), } } } From dcccf7064d506abb3aab15227e6cdf34d852514d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A9ctor=20Ram=C3=B3n=20Jim=C3=A9nez?= Date: Mon, 27 Mar 2023 15:57:51 +0200 Subject: [PATCH 6/6] Fix inconsistency in default implementation of `scrollable::StyleSheet` --- style/src/scrollable.rs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/style/src/scrollable.rs b/style/src/scrollable.rs index 64a91b694b..b528c4444a 100644 --- a/style/src/scrollable.rs +++ b/style/src/scrollable.rs @@ -65,6 +65,6 @@ pub trait StyleSheet { /// Produces the style of a horizontal scrollbar that is being dragged. fn dragging_horizontal(&self, style: &Self::Style) -> Scrollbar { - self.hovered(style, true) + self.hovered_horizontal(style, true) } }