From 9902e778167af8d4b108102619ee1ed8d0de0be5 Mon Sep 17 00:00:00 2001 From: Casper Storm Date: Thu, 1 Jun 2023 10:46:33 +0200 Subject: Add border_radius to slider rail --- style/src/slider.rs | 2 ++ style/src/theme.rs | 3 ++- widget/src/slider.rs | 4 ++-- widget/src/vertical_slider.rs | 4 ++-- 4 files changed, 8 insertions(+), 5 deletions(-) diff --git a/style/src/slider.rs b/style/src/slider.rs index ca115f46..f0068558 100644 --- a/style/src/slider.rs +++ b/style/src/slider.rs @@ -17,6 +17,8 @@ pub struct Rail { pub colors: (Color, Color), /// The width of the stroke of a slider rail. pub width: f32, + /// The border radius of the corners of the rail. + pub border_radius: BorderRadius, } /// The appearance of the handle of a slider. diff --git a/style/src/theme.rs b/style/src/theme.rs index 4a8ee749..4fef8554 100644 --- a/style/src/theme.rs +++ b/style/src/theme.rs @@ -433,9 +433,10 @@ impl slider::StyleSheet for Theme { rail: slider::Rail { colors: ( palette.primary.base.color, - palette.primary.base.color, + palette.secondary.base.color, ), width: 2.0, + border_radius: Default::default(), }, handle: slider::Handle { color: palette.background.base.color, diff --git a/widget/src/slider.rs b/widget/src/slider.rs index 2851d8c3..c2498b87 100644 --- a/widget/src/slider.rs +++ b/widget/src/slider.rs @@ -403,7 +403,7 @@ pub fn draw( width: offset + handle_width / 2.0, height: style.rail.width, }, - border_radius: Default::default(), + border_radius: style.rail.border_radius, border_width: 0.0, border_color: Color::TRANSPARENT, }, @@ -418,7 +418,7 @@ pub fn draw( width: bounds.width - offset - handle_width / 2.0, height: style.rail.width, }, - border_radius: Default::default(), + border_radius: style.rail.border_radius, border_width: 0.0, border_color: Color::TRANSPARENT, }, diff --git a/widget/src/vertical_slider.rs b/widget/src/vertical_slider.rs index 3b2430c4..b14e5401 100644 --- a/widget/src/vertical_slider.rs +++ b/widget/src/vertical_slider.rs @@ -401,7 +401,7 @@ pub fn draw( width: style.rail.width, height: offset + handle_width / 2.0, }, - border_radius: Default::default(), + border_radius: style.rail.border_radius, border_width: 0.0, border_color: Color::TRANSPARENT, }, @@ -416,7 +416,7 @@ pub fn draw( width: style.rail.width, height: bounds.height - offset - handle_width / 2.0, }, - border_radius: Default::default(), + border_radius: style.rail.border_radius, border_width: 0.0, border_color: Color::TRANSPARENT, }, -- cgit From 1e2965d5423fc35943388aa32a6cae2c6b0f2336 Mon Sep 17 00:00:00 2001 From: Casper Storm Date: Thu, 1 Jun 2023 13:30:48 +0200 Subject: only add border radius to the visible part --- widget/src/slider.rs | 7 +++++-- widget/src/vertical_slider.rs | 7 +++++-- 2 files changed, 10 insertions(+), 4 deletions(-) diff --git a/widget/src/slider.rs b/widget/src/slider.rs index c2498b87..af6a824f 100644 --- a/widget/src/slider.rs +++ b/widget/src/slider.rs @@ -367,6 +367,7 @@ pub fn draw( } else { style_sheet.active(style) }; + let border_radius: [f32; 4] = style.rail.border_radius.into(); let (handle_width, handle_height, handle_border_radius) = match style.handle.shape { @@ -403,7 +404,8 @@ pub fn draw( width: offset + handle_width / 2.0, height: style.rail.width, }, - border_radius: style.rail.border_radius, + border_radius: [border_radius[0], 0.0, 0.0, border_radius[3]] + .into(), border_width: 0.0, border_color: Color::TRANSPARENT, }, @@ -418,7 +420,8 @@ pub fn draw( width: bounds.width - offset - handle_width / 2.0, height: style.rail.width, }, - border_radius: style.rail.border_radius, + border_radius: [0.0, border_radius[1], border_radius[2], 0.0] + .into(), border_width: 0.0, border_color: Color::TRANSPARENT, }, diff --git a/widget/src/vertical_slider.rs b/widget/src/vertical_slider.rs index b14e5401..c6569c13 100644 --- a/widget/src/vertical_slider.rs +++ b/widget/src/vertical_slider.rs @@ -365,6 +365,7 @@ pub fn draw( } else { style_sheet.active(style) }; + let border_radius: [f32; 4] = style.rail.border_radius.into(); let (handle_width, handle_height, handle_border_radius) = match style.handle.shape { @@ -401,7 +402,8 @@ pub fn draw( width: style.rail.width, height: offset + handle_width / 2.0, }, - border_radius: style.rail.border_radius, + border_radius: [border_radius[0], border_radius[1], 0.0, 0.0] + .into(), border_width: 0.0, border_color: Color::TRANSPARENT, }, @@ -416,7 +418,8 @@ pub fn draw( width: style.rail.width, height: bounds.height - offset - handle_width / 2.0, }, - border_radius: style.rail.border_radius, + border_radius: [0.0, 0.0, border_radius[2], border_radius[3]] + .into(), border_width: 0.0, border_color: Color::TRANSPARENT, }, -- cgit From ee0dd4c623f579635ae74db3d22256090c17a1eb Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Thu, 1 Jun 2023 17:25:56 +0200 Subject: Change default styling of `Slider` to leverage rounded borders --- style/src/theme.rs | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/style/src/theme.rs b/style/src/theme.rs index 4fef8554..64497181 100644 --- a/style/src/theme.rs +++ b/style/src/theme.rs @@ -435,8 +435,8 @@ impl slider::StyleSheet for Theme { palette.primary.base.color, palette.secondary.base.color, ), - width: 2.0, - border_radius: Default::default(), + width: 4.0, + border_radius: 2.0.into(), }, handle: slider::Handle { color: palette.background.base.color, -- cgit From 66d4decc0c5c6ea787ec482ff6841829dfc7ffba Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Thu, 1 Jun 2023 17:27:52 +0200 Subject: Fix `quad` glitch when rounding borders of a `Slider` rail --- widget/src/slider.rs | 7 ++----- widget/src/vertical_slider.rs | 7 ++----- 2 files changed, 4 insertions(+), 10 deletions(-) diff --git a/widget/src/slider.rs b/widget/src/slider.rs index af6a824f..c2498b87 100644 --- a/widget/src/slider.rs +++ b/widget/src/slider.rs @@ -367,7 +367,6 @@ pub fn draw( } else { style_sheet.active(style) }; - let border_radius: [f32; 4] = style.rail.border_radius.into(); let (handle_width, handle_height, handle_border_radius) = match style.handle.shape { @@ -404,8 +403,7 @@ pub fn draw( width: offset + handle_width / 2.0, height: style.rail.width, }, - border_radius: [border_radius[0], 0.0, 0.0, border_radius[3]] - .into(), + border_radius: style.rail.border_radius, border_width: 0.0, border_color: Color::TRANSPARENT, }, @@ -420,8 +418,7 @@ pub fn draw( width: bounds.width - offset - handle_width / 2.0, height: style.rail.width, }, - border_radius: [0.0, border_radius[1], border_radius[2], 0.0] - .into(), + border_radius: style.rail.border_radius, border_width: 0.0, border_color: Color::TRANSPARENT, }, diff --git a/widget/src/vertical_slider.rs b/widget/src/vertical_slider.rs index c6569c13..b14e5401 100644 --- a/widget/src/vertical_slider.rs +++ b/widget/src/vertical_slider.rs @@ -365,7 +365,6 @@ pub fn draw( } else { style_sheet.active(style) }; - let border_radius: [f32; 4] = style.rail.border_radius.into(); let (handle_width, handle_height, handle_border_radius) = match style.handle.shape { @@ -402,8 +401,7 @@ pub fn draw( width: style.rail.width, height: offset + handle_width / 2.0, }, - border_radius: [border_radius[0], border_radius[1], 0.0, 0.0] - .into(), + border_radius: style.rail.border_radius, border_width: 0.0, border_color: Color::TRANSPARENT, }, @@ -418,8 +416,7 @@ pub fn draw( width: style.rail.width, height: bounds.height - offset - handle_width / 2.0, }, - border_radius: [0.0, 0.0, border_radius[2], border_radius[3]] - .into(), + border_radius: style.rail.border_radius, border_width: 0.0, border_color: Color::TRANSPARENT, }, -- cgit