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 --- examples/game_of_life/src/main.rs | 8 +++-- examples/game_of_life/src/style.rs | 69 +------------------------------------- 2 files changed, 6 insertions(+), 71 deletions(-) (limited to 'examples/game_of_life/src') diff --git a/examples/game_of_life/src/main.rs b/examples/game_of_life/src/main.rs index ab8b80e4..3e9c24a0 100644 --- a/examples/game_of_life/src/main.rs +++ b/examples/game_of_life/src/main.rs @@ -8,6 +8,7 @@ use iced::button::{self, Button}; use iced::executor; use iced::pick_list::{self, PickList}; use iced::slider::{self, Slider}; +use iced::theme::{self, Theme}; use iced::time; use iced::window; use iced::{ @@ -55,6 +56,7 @@ enum Message { impl Application for GameOfLife { type Message = Message; + type Theme = Theme; type Executor = executor::Default; type Flags = (); @@ -836,12 +838,12 @@ impl Controls { Text::new(if is_playing { "Pause" } else { "Play" }), ) .on_press(Message::TogglePlayback) - .style(style::Button), + .style(theme::Button::Primary), ) .push( Button::new(&mut self.next_button, Text::new("Next")) .on_press(Message::Next) - .style(style::Button), + .style(theme::Button::Secondary), ); let speed_controls = Row::new() @@ -885,7 +887,7 @@ impl Controls { .push( Button::new(&mut self.clear_button, Text::new("Clear")) .on_press(Message::Clear) - .style(style::Clear), + .style(theme::Button::Destructive), ) .into() } diff --git a/examples/game_of_life/src/style.rs b/examples/game_of_life/src/style.rs index be9a0e96..688635e0 100644 --- a/examples/game_of_life/src/style.rs +++ b/examples/game_of_life/src/style.rs @@ -1,4 +1,4 @@ -use iced::{button, container, pick_list, slider, Background, Color}; +use iced::{container, pick_list, slider, Background, Color}; const ACTIVE: Color = Color::from_rgb( 0x72 as f32 / 255.0, @@ -6,12 +6,6 @@ const ACTIVE: Color = Color::from_rgb( 0xDA as f32 / 255.0, ); -const DESTRUCTIVE: Color = Color::from_rgb( - 0xC0 as f32 / 255.0, - 0x47 as f32 / 255.0, - 0x47 as f32 / 255.0, -); - const HOVERED: Color = Color::from_rgb( 0x67 as f32 / 255.0, 0x7B as f32 / 255.0, @@ -38,67 +32,6 @@ impl container::StyleSheet for Container { } } -pub struct Button; - -impl button::StyleSheet for Button { - fn active(&self) -> button::Style { - button::Style { - background: Some(Background::Color(ACTIVE)), - border_radius: 3.0, - text_color: Color::WHITE, - ..button::Style::default() - } - } - - fn hovered(&self) -> button::Style { - button::Style { - background: Some(Background::Color(HOVERED)), - text_color: Color::WHITE, - ..self.active() - } - } - - fn pressed(&self) -> button::Style { - button::Style { - border_width: 1.0, - border_color: Color::WHITE, - ..self.hovered() - } - } -} - -pub struct Clear; - -impl button::StyleSheet for Clear { - fn active(&self) -> button::Style { - button::Style { - background: Some(Background::Color(DESTRUCTIVE)), - border_radius: 3.0, - text_color: Color::WHITE, - ..button::Style::default() - } - } - - fn hovered(&self) -> button::Style { - button::Style { - background: Some(Background::Color(Color { - a: 0.5, - ..DESTRUCTIVE - })), - text_color: Color::WHITE, - ..self.active() - } - } - - fn pressed(&self) -> button::Style { - button::Style { - border_width: 1.0, - border_color: Color::WHITE, - ..self.hovered() - } - } -} - pub struct Slider; impl slider::StyleSheet for Slider { -- cgit From d5bc610d0139fb331a59fc904a932d156f637391 Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Thu, 26 May 2022 23:12:11 +0200 Subject: Fix examples and doc-tests --- examples/game_of_life/src/main.rs | 15 +++++------ examples/game_of_life/src/style.rs | 54 +------------------------------------- 2 files changed, 7 insertions(+), 62 deletions(-) (limited to 'examples/game_of_life/src') diff --git a/examples/game_of_life/src/main.rs b/examples/game_of_life/src/main.rs index 3e9c24a0..080cbac3 100644 --- a/examples/game_of_life/src/main.rs +++ b/examples/game_of_life/src/main.rs @@ -850,15 +850,12 @@ impl Controls { .width(Length::Fill) .align_items(Alignment::Center) .spacing(10) - .push( - Slider::new( - &mut self.speed_slider, - 1.0..=1000.0, - speed as f32, - Message::SpeedChanged, - ) - .style(style::Slider), - ) + .push(Slider::new( + &mut self.speed_slider, + 1.0..=1000.0, + speed as f32, + Message::SpeedChanged, + )) .push(Text::new(format!("x{}", speed)).size(16)); Row::new() diff --git a/examples/game_of_life/src/style.rs b/examples/game_of_life/src/style.rs index 688635e0..ea215dd8 100644 --- a/examples/game_of_life/src/style.rs +++ b/examples/game_of_life/src/style.rs @@ -1,16 +1,4 @@ -use iced::{container, pick_list, slider, Background, Color}; - -const ACTIVE: Color = Color::from_rgb( - 0x72 as f32 / 255.0, - 0x89 as f32 / 255.0, - 0xDA as f32 / 255.0, -); - -const HOVERED: Color = Color::from_rgb( - 0x67 as f32 / 255.0, - 0x7B as f32 / 255.0, - 0xC4 as f32 / 255.0, -); +use iced::{container, pick_list, Background, Color}; const BACKGROUND: Color = Color::from_rgb( 0x2F as f32 / 255.0, @@ -32,46 +20,6 @@ impl container::StyleSheet for Container { } } -pub struct Slider; - -impl slider::StyleSheet for Slider { - fn active(&self) -> slider::Style { - slider::Style { - rail_colors: (ACTIVE, Color { a: 0.1, ..ACTIVE }), - handle: slider::Handle { - shape: slider::HandleShape::Circle { radius: 9.0 }, - color: ACTIVE, - border_width: 0.0, - border_color: Color::TRANSPARENT, - }, - } - } - - fn hovered(&self) -> slider::Style { - let active = self.active(); - - slider::Style { - handle: slider::Handle { - color: HOVERED, - ..active.handle - }, - ..active - } - } - - fn dragging(&self) -> slider::Style { - let active = self.active(); - - slider::Style { - handle: slider::Handle { - color: Color::from_rgb(0.85, 0.85, 0.85), - ..active.handle - }, - ..active - } - } -} - pub struct PickList; impl pick_list::StyleSheet for PickList { -- cgit From d988d813d77bc23147a179586206048e6cc42157 Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Thu, 26 May 2022 23:58:56 +0200 Subject: Introduce specific types for each `palette::Extended` field We will have more control over color calculations for each semantic purpose this way. --- examples/game_of_life/src/main.rs | 17 ++++++++--------- examples/game_of_life/src/style.rs | 16 +--------------- 2 files changed, 9 insertions(+), 24 deletions(-) (limited to 'examples/game_of_life/src') 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 { -- cgit From 396735b682433928f52ba777891e14f2fbc703c7 Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Tue, 7 Jun 2022 04:51:44 +0200 Subject: Implement theme styling for `PickList` and `Menu` --- examples/game_of_life/src/main.rs | 4 +-- examples/game_of_life/src/style.rs | 56 -------------------------------------- 2 files changed, 1 insertion(+), 59 deletions(-) delete mode 100644 examples/game_of_life/src/style.rs (limited to 'examples/game_of_life/src') diff --git a/examples/game_of_life/src/main.rs b/examples/game_of_life/src/main.rs index fa97583f..b2ae6953 100644 --- a/examples/game_of_life/src/main.rs +++ b/examples/game_of_life/src/main.rs @@ -1,7 +1,6 @@ //! This example showcases an interactive version of the Game of Life, invented //! by John Conway. It leverages a `Canvas` together with other widgets. mod preset; -mod style; use grid::Grid; use iced::button::{self, Button}; @@ -877,8 +876,7 @@ impl Controls { Message::PresetPicked, ) .padding(8) - .text_size(16) - .style(style::PickList), + .text_size(16), ) .push( Button::new(&mut self.clear_button, Text::new("Clear")) diff --git a/examples/game_of_life/src/style.rs b/examples/game_of_life/src/style.rs deleted file mode 100644 index 69889889..00000000 --- a/examples/game_of_life/src/style.rs +++ /dev/null @@ -1,56 +0,0 @@ -use iced::{pick_list, Color}; - -const BACKGROUND: Color = Color::from_rgb( - 0x2F as f32 / 255.0, - 0x31 as f32 / 255.0, - 0x36 as f32 / 255.0, -); - -pub struct PickList; - -impl pick_list::StyleSheet for PickList { - fn menu(&self) -> pick_list::Menu { - pick_list::Menu { - text_color: Color::WHITE, - background: BACKGROUND.into(), - border_width: 1.0, - border_color: Color { - a: 0.7, - ..Color::BLACK - }, - selected_background: Color { - a: 0.5, - ..Color::BLACK - } - .into(), - selected_text_color: Color::WHITE, - } - } - - fn active(&self) -> pick_list::Style { - pick_list::Style { - text_color: Color::WHITE, - background: BACKGROUND.into(), - border_width: 1.0, - border_color: Color { - a: 0.6, - ..Color::BLACK - }, - border_radius: 2.0, - icon_size: 0.5, - ..pick_list::Style::default() - } - } - - fn hovered(&self) -> pick_list::Style { - let active = self.active(); - - pick_list::Style { - border_color: Color { - a: 0.9, - ..Color::BLACK - }, - ..active - } - } -} -- cgit From fc13bb3d65c85cfad9f231c0776d3a45f4fbf480 Mon Sep 17 00:00:00 2001 From: Héctor Ramón Jiménez Date: Tue, 7 Jun 2022 05:24:43 +0200 Subject: Implement theme styling for `Canvas` --- examples/game_of_life/src/main.rs | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) (limited to 'examples/game_of_life/src') diff --git a/examples/game_of_life/src/main.rs b/examples/game_of_life/src/main.rs index b2ae6953..35399584 100644 --- a/examples/game_of_life/src/main.rs +++ b/examples/game_of_life/src/main.rs @@ -163,7 +163,7 @@ mod grid { alignment, canvas::event::{self, Event}, canvas::{self, Cache, Canvas, Cursor, Frame, Geometry, Path, Text}, - mouse, Color, Element, Length, Point, Rectangle, Size, Vector, + mouse, Color, Element, Length, Point, Rectangle, Size, Theme, Vector, }; use rustc_hash::{FxHashMap, FxHashSet}; use std::future::Future; @@ -445,7 +445,12 @@ mod grid { } } - fn draw(&self, bounds: Rectangle, cursor: Cursor) -> Vec { + fn draw( + &self, + _theme: &Theme, + bounds: Rectangle, + cursor: Cursor, + ) -> Vec { let center = Vector::new(bounds.width / 2.0, bounds.height / 2.0); let life = self.life_cache.draw(bounds.size(), |frame| { -- cgit