diff options
author | 2022-05-26 23:58:56 +0200 | |
---|---|---|
committer | 2022-05-26 23:58:56 +0200 | |
commit | d988d813d77bc23147a179586206048e6cc42157 (patch) | |
tree | 70226d18d1255d2cc0bb342fca6c2362f6652611 | |
parent | d5bc610d0139fb331a59fc904a932d156f637391 (diff) | |
download | iced-d988d813d77bc23147a179586206048e6cc42157.tar.gz iced-d988d813d77bc23147a179586206048e6cc42157.tar.bz2 iced-d988d813d77bc23147a179586206048e6cc42157.zip |
Introduce specific types for each `palette::Extended` field
We will have more control over color calculations for each semantic purpose this way.
-rw-r--r-- | examples/game_of_life/src/main.rs | 17 | ||||
-rw-r--r-- | examples/game_of_life/src/style.rs | 16 | ||||
-rw-r--r-- | style/src/theme.rs | 54 | ||||
-rw-r--r-- | style/src/theme/palette.rs | 139 |
4 files changed, 140 insertions, 86 deletions
diff --git a/examples/game_of_life/src/main.rs b/examples/game_of_life/src/main.rs index 080cbac3..fa97583f 100644 --- a/examples/game_of_life/src/main.rs +++ b/examples/game_of_life/src/main.rs @@ -12,8 +12,8 @@ use iced::theme::{self, Theme}; use iced::time; use iced::window; use iced::{ - Alignment, Application, Checkbox, Column, Command, Container, Element, - Length, Row, Settings, Subscription, Text, + Alignment, Application, Checkbox, Column, Command, Element, Length, Row, + Settings, Subscription, Text, }; use preset::Preset; use std::time::{Duration, Instant}; @@ -143,20 +143,19 @@ impl Application for GameOfLife { self.grid.preset(), ); - let content = Column::new() + Column::new() .push( self.grid .view() .map(move |message| Message::Grid(message, version)), ) - .push(controls); - - Container::new(content) - .width(Length::Fill) - .height(Length::Fill) - .style(style::Container) + .push(controls) .into() } + + fn theme(&self) -> Theme { + Theme::Dark + } } mod grid { diff --git a/examples/game_of_life/src/style.rs b/examples/game_of_life/src/style.rs index ea215dd8..69889889 100644 --- a/examples/game_of_life/src/style.rs +++ b/examples/game_of_life/src/style.rs @@ -1,4 +1,4 @@ -use iced::{container, pick_list, Background, Color}; +use iced::{pick_list, Color}; const BACKGROUND: Color = Color::from_rgb( 0x2F as f32 / 255.0, @@ -6,20 +6,6 @@ const BACKGROUND: Color = Color::from_rgb( 0x36 as f32 / 255.0, ); -pub struct Container; - -impl container::StyleSheet for Container { - fn style(&self) -> container::Style { - container::Style { - background: Some(Background::Color(Color::from_rgb8( - 0x36, 0x39, 0x3F, - ))), - text_color: Some(Color::WHITE), - ..container::Style::default() - } - } -} - pub struct PickList; impl pick_list::StyleSheet for PickList { diff --git a/style/src/theme.rs b/style/src/theme.rs index df67f594..c9fae3c2 100644 --- a/style/src/theme.rs +++ b/style/src/theme.rs @@ -40,13 +40,13 @@ impl application::StyleSheet for Theme { fn background_color(&self) -> Color { let palette = self.extended_palette(); - palette.background.base + palette.background.base.color } fn text_color(&self) -> Color { let palette = self.extended_palette(); - palette.background.text + palette.background.base.text } } @@ -76,29 +76,19 @@ impl button::StyleSheet for Theme { ..button::Appearance::default() }; + let from_pair = |pair: palette::Pair| button::Appearance { + background: Some(pair.color.into()), + text_color: pair.text, + ..appearance + }; + match style { - Button::Primary => button::Appearance { - background: Some(palette.primary.strong.into()), - text_color: palette.primary.text, - ..appearance - }, - Button::Secondary => button::Appearance { - background: Some(palette.background.weak.into()), - text_color: palette.background.text, - ..appearance - }, - Button::Positive => button::Appearance { - background: Some(palette.success.base.into()), - text_color: palette.success.text, - ..appearance - }, - Button::Destructive => button::Appearance { - background: Some(palette.danger.base.into()), - text_color: palette.danger.text, - ..appearance - }, + Button::Primary => from_pair(palette.primary.strong), + Button::Secondary => from_pair(palette.secondary.base), + Button::Positive => from_pair(palette.success.base), + Button::Destructive => from_pair(palette.danger.base), Button::Text => button::Appearance { - text_color: palette.background.text, + text_color: palette.background.base.text, ..appearance }, } @@ -109,10 +99,10 @@ impl button::StyleSheet for Theme { let palette = self.extended_palette(); let background = match style { - Button::Primary => Some(palette.primary.base), - Button::Secondary => Some(palette.background.strong), - Button::Positive => Some(palette.success.strong), - Button::Destructive => Some(palette.danger.strong), + Button::Primary => Some(palette.primary.base.color), + Button::Secondary => Some(palette.background.strong.color), + Button::Positive => Some(palette.success.strong.color), + Button::Destructive => Some(palette.danger.strong.color), Button::Text => None, }; @@ -140,10 +130,10 @@ impl slider::StyleSheet for Theme { }; slider::Appearance { - rail_colors: (palette.primary.base, palette.background.base), + rail_colors: (palette.primary.base.color, Color::TRANSPARENT), handle: slider::Handle { - color: palette.background.base, - border_color: palette.primary.base, + color: palette.background.base.color, + border_color: palette.primary.base.color, ..handle }, } @@ -155,7 +145,7 @@ impl slider::StyleSheet for Theme { slider::Appearance { handle: slider::Handle { - color: palette.primary.weak, + color: palette.primary.weak.color, ..active.handle }, ..active @@ -168,7 +158,7 @@ impl slider::StyleSheet for Theme { slider::Appearance { handle: slider::Handle { - color: palette.primary.base, + color: palette.primary.base.color, ..active.handle }, ..active diff --git a/style/src/theme/palette.rs b/style/src/theme/palette.rs index acc147ed..3d1ca097 100644 --- a/style/src/theme/palette.rs +++ b/style/src/theme/palette.rs @@ -60,9 +60,10 @@ impl Palette { pub struct Extended { pub background: Background, - pub primary: Group, - pub success: Group, - pub danger: Group, + pub primary: Primary, + pub secondary: Secondary, + pub success: Success, + pub danger: Danger, } lazy_static! { @@ -75,17 +76,18 @@ impl Extended { pub fn generate(palette: Palette) -> Self { Self { background: Background::new(palette.background, palette.text), - primary: Group::new( + primary: Primary::generate( palette.primary, palette.background, palette.text, ), - success: Group::new( + secondary: Secondary::generate(palette.background, palette.text), + success: Success::generate( palette.success, palette.background, palette.text, ), - danger: Group::new( + danger: Danger::generate( palette.danger, palette.background, palette.text, @@ -94,44 +96,113 @@ impl Extended { } } -pub struct Background { - pub base: Color, - pub weak: Color, - pub strong: Color, +#[derive(Debug, Clone, Copy)] +pub struct Pair { + pub color: Color, pub text: Color, } +impl Pair { + pub fn new(color: Color, text: Color) -> Self { + Self { + color, + text: readable(color, text), + } + } +} + +pub struct Background { + pub base: Pair, + pub weak: Pair, + pub strong: Pair, +} + impl Background { pub fn new(base: Color, text: Color) -> Self { + let weak = mix(base, text, 0.15); + let strong = mix(base, text, 0.25); + Self { - base, - weak: mix(base, text, 0.15), - strong: mix(base, text, 0.25), - text, + base: Pair::new(base, text), + weak: Pair::new(weak, text), + strong: Pair::new(strong, text), } } } -pub struct Group { - pub base: Color, - pub weak: Color, - pub strong: Color, - pub text: Color, +pub struct Primary { + pub base: Pair, + pub weak: Pair, + pub strong: Pair, +} + +impl Primary { + pub fn generate(base: Color, background: Color, text: Color) -> Self { + let weak = mix(base, background, 0.4); + let strong = deviate(base, 0.1); + + Self { + base: Pair::new(base, text), + weak: Pair::new(weak, text), + strong: Pair::new(strong, text), + } + } } -impl Group { - pub fn new(base: Color, background: Color, text: Color) -> Self { - let strong = if is_dark(base) { - lighten(base, 0.1) - } else { - darken(base, 0.1) - }; +pub struct Secondary { + pub base: Pair, + pub weak: Pair, + pub strong: Pair, +} + +impl Secondary { + pub fn generate(base: Color, text: Color) -> Self { + let base = mix(base, text, 0.2); + let weak = mix(base, text, 0.1); + let strong = mix(base, text, 0.3); Self { - base, - weak: mix(base, background, 0.4), - strong, - text: readable(strong, text), + base: Pair::new(base, text), + weak: Pair::new(weak, text), + strong: Pair::new(strong, text), + } + } +} + +pub struct Success { + pub base: Pair, + pub weak: Pair, + pub strong: Pair, +} + +impl Success { + pub fn generate(base: Color, background: Color, text: Color) -> Self { + let weak = mix(base, background, 0.4); + let strong = deviate(base, 0.1); + + Self { + base: Pair::new(base, text), + weak: Pair::new(weak, text), + strong: Pair::new(strong, text), + } + } +} + +pub struct Danger { + pub base: Pair, + pub weak: Pair, + pub strong: Pair, +} + +impl Danger { + pub fn generate(base: Color, background: Color, text: Color) -> Self { + let weak = mix(base, background, 0.4); + let strong = deviate(base, 0.1); + + Self { + base: Pair::new(base, text), + weak: Pair::new(weak, text), + strong: Pair::new(strong, text), } } } @@ -174,6 +245,14 @@ fn lighten(color: Color, amount: f32) -> Color { from_hsl(hsl) } +fn deviate(color: Color, amount: f32) -> Color { + if is_dark(color) { + lighten(color, amount) + } else { + darken(color, amount) + } +} + fn mix(a: Color, b: Color, factor: f32) -> Color { let a_lin = Srgb::from(a).into_linear(); let b_lin = Srgb::from(b).into_linear(); |