Improve slider widget styling. (#2444)
* Overhaul slider styling * Add `border` attribute to `Rail` * Replace `color` attribute with `background` for handle * Replace `colors` with `backgrounds` for the Rail. * code consistency * remove unused import
This commit is contained in:
parent
ae58a40398
commit
abd323181d
2 changed files with 26 additions and 22 deletions
|
|
@ -9,8 +9,8 @@ use crate::core::renderer;
|
|||
use crate::core::touch;
|
||||
use crate::core::widget::tree::{self, Tree};
|
||||
use crate::core::{
|
||||
self, Clipboard, Color, Element, Layout, Length, Pixels, Point, Rectangle,
|
||||
Shell, Size, Theme, Widget,
|
||||
self, Background, Clipboard, Color, Element, Layout, Length, Pixels, Point,
|
||||
Rectangle, Shell, Size, Theme, Widget,
|
||||
};
|
||||
|
||||
use std::ops::RangeInclusive;
|
||||
|
|
@ -408,10 +408,10 @@ where
|
|||
width: offset + handle_width / 2.0,
|
||||
height: style.rail.width,
|
||||
},
|
||||
border: border::rounded(style.rail.border_radius),
|
||||
border: style.rail.border,
|
||||
..renderer::Quad::default()
|
||||
},
|
||||
style.rail.colors.0,
|
||||
style.rail.backgrounds.0,
|
||||
);
|
||||
|
||||
renderer.fill_quad(
|
||||
|
|
@ -422,10 +422,10 @@ where
|
|||
width: bounds.width - offset - handle_width / 2.0,
|
||||
height: style.rail.width,
|
||||
},
|
||||
border: border::rounded(style.rail.border_radius),
|
||||
border: style.rail.border,
|
||||
..renderer::Quad::default()
|
||||
},
|
||||
style.rail.colors.1,
|
||||
style.rail.backgrounds.1,
|
||||
);
|
||||
|
||||
renderer.fill_quad(
|
||||
|
|
@ -443,7 +443,7 @@ where
|
|||
},
|
||||
..renderer::Quad::default()
|
||||
},
|
||||
style.handle.color,
|
||||
style.handle.background,
|
||||
);
|
||||
}
|
||||
|
||||
|
|
@ -524,12 +524,12 @@ impl Style {
|
|||
/// The appearance of a slider rail
|
||||
#[derive(Debug, Clone, Copy)]
|
||||
pub struct Rail {
|
||||
/// The colors of the rail of the slider.
|
||||
pub colors: (Color, Color),
|
||||
/// The backgrounds of the rail of the slider.
|
||||
pub backgrounds: (Background, Background),
|
||||
/// The width of the stroke of a slider rail.
|
||||
pub width: f32,
|
||||
/// The border radius of the corners of the rail.
|
||||
pub border_radius: border::Radius,
|
||||
/// The border of the rail.
|
||||
pub border: Border,
|
||||
}
|
||||
|
||||
/// The appearance of the handle of a slider.
|
||||
|
|
@ -537,8 +537,8 @@ pub struct Rail {
|
|||
pub struct Handle {
|
||||
/// The shape of the handle.
|
||||
pub shape: HandleShape,
|
||||
/// The [`Color`] of the handle.
|
||||
pub color: Color,
|
||||
/// The [`Background`] of the handle.
|
||||
pub background: Background,
|
||||
/// The border width of the handle.
|
||||
pub border_width: f32,
|
||||
/// The border [`Color`] of the handle.
|
||||
|
|
@ -601,13 +601,17 @@ pub fn default(theme: &Theme, status: Status) -> Style {
|
|||
|
||||
Style {
|
||||
rail: Rail {
|
||||
colors: (color, palette.secondary.base.color),
|
||||
backgrounds: (color.into(), palette.secondary.base.color.into()),
|
||||
width: 4.0,
|
||||
border_radius: 2.0.into(),
|
||||
border: Border {
|
||||
radius: 2.0.into(),
|
||||
width: 0.0,
|
||||
color: Color::TRANSPARENT,
|
||||
},
|
||||
},
|
||||
handle: Handle {
|
||||
shape: HandleShape::Circle { radius: 7.0 },
|
||||
color,
|
||||
background: color.into(),
|
||||
border_color: Color::TRANSPARENT,
|
||||
border_width: 0.0,
|
||||
},
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ pub use crate::slider::{
|
|||
default, Catalog, Handle, HandleShape, Status, Style, StyleFn,
|
||||
};
|
||||
|
||||
use crate::core::border::{self, Border};
|
||||
use crate::core::border::Border;
|
||||
use crate::core::event::{self, Event};
|
||||
use crate::core::keyboard;
|
||||
use crate::core::keyboard::key::{self, Key};
|
||||
|
|
@ -413,10 +413,10 @@ where
|
|||
width: style.rail.width,
|
||||
height: offset + handle_width / 2.0,
|
||||
},
|
||||
border: border::rounded(style.rail.border_radius),
|
||||
border: style.rail.border,
|
||||
..renderer::Quad::default()
|
||||
},
|
||||
style.rail.colors.1,
|
||||
style.rail.backgrounds.1,
|
||||
);
|
||||
|
||||
renderer.fill_quad(
|
||||
|
|
@ -427,10 +427,10 @@ where
|
|||
width: style.rail.width,
|
||||
height: bounds.height - offset - handle_width / 2.0,
|
||||
},
|
||||
border: border::rounded(style.rail.border_radius),
|
||||
border: style.rail.border,
|
||||
..renderer::Quad::default()
|
||||
},
|
||||
style.rail.colors.0,
|
||||
style.rail.backgrounds.0,
|
||||
);
|
||||
|
||||
renderer.fill_quad(
|
||||
|
|
@ -448,7 +448,7 @@ where
|
|||
},
|
||||
..renderer::Quad::default()
|
||||
},
|
||||
style.handle.color,
|
||||
style.handle.background,
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue