diff options
| author |  Héctor Ramón Jiménez <hector0193@gmail.com> | 2022-05-14 01:47:55 +0200 |
|---|---|---|
| committer | Héctor Ramón Jiménez <hector0193@gmail.com> | 2022-05-14 01:56:32 +0200 |
| commit | 664251f3f5c7b76f69a97683af1468094bba887f (patch) | |
| tree | f43a495036ed117ce5dbb479c62652d872a6d273 /examples | |
| parent | 5de337f214530faab1d5fe47784afd7006c3f7f0 (diff) | |
| download | iced-664251f3f5c7b76f69a97683af1468094bba887f.tar.gz iced-664251f3f5c7b76f69a97683af1468094bba887f.tar.bz2 iced-664251f3f5c7b76f69a97683af1468094bba887f.zip | |
Draft first-class `Theme` support
RFC: https://github.com/iced-rs/rfcs/pull/6
Diffstat (limited to 'examples')
27 files changed, 166 insertions, 644 deletions
diff --git a/examples/clock/src/main.rs b/examples/clock/src/main.rs index 3b8a1d6a..fa4181a9 100644 --- a/examples/clock/src/main.rs +++ b/examples/clock/src/main.rs @@ -1,7 +1,10 @@ +use iced::canvas::{ + self, Cache, Canvas, Cursor, Geometry, LineCap, Path, Stroke, +}; +use iced::executor; use iced::{ - canvas::{self, Cache, Canvas, Cursor, Geometry, LineCap, Path, Stroke}, - executor, Application, Color, Command, Container, Element, Length, Point, - Rectangle, Settings, Subscription, Vector, + Application, Color, Command, Container, Element, Length, Point, Rectangle, + Settings, Subscription, Theme, Vector, }; pub fn main() -> iced::Result { @@ -22,8 +25,9 @@ enum Message { } impl Application for Clock { - type Executor = executor::Default; type Message = Message; + type Theme = Theme; + type Executor = executor::Default; type Flags = (); fn new(_flags: ()) -> (Self, Command<Message>) { diff --git a/examples/component/src/main.rs b/examples/component/src/main.rs index 39335cf1..d863c58f 100644 --- a/examples/component/src/main.rs +++ b/examples/component/src/main.rs @@ -95,6 +95,8 @@ mod numeric_input { for NumericInput<'a, Message> where Renderer: 'a + text::Renderer, + Renderer::Theme: button::StyleSheet, + <Renderer::Theme as button::StyleSheet>::Variant: Default + Copy, { type Event = Event; @@ -172,6 +174,8 @@ mod numeric_input { where Message: 'a, Renderer: text::Renderer + 'a, + Renderer::Theme: button::StyleSheet, + <Renderer::Theme as button::StyleSheet>::Variant: Default + Copy, { fn from(numeric_input: NumericInput<'a, Message>) -> Self { component::view(numeric_input) diff --git a/examples/counter/src/main.rs b/examples/counter/src/main.rs index 931cf5e1..e92f07f2 100644 --- a/examples/counter/src/main.rs +++ b/examples/counter/src/main.rs @@ -1,6 +1,5 @@ -use iced::{ - button, Alignment, Button, Column, Element, Sandbox, Settings, Text, -}; +use iced::button::{self, Button}; +use iced::{Alignment, Column, Element, Sandbox, Settings, Text}; pub fn main() -> iced::Result { Counter::run(Settings::default()) diff --git a/examples/custom_widget/src/main.rs b/examples/custom_widget/src/main.rs index 28edf256..ce5306ba 100644 --- a/examples/custom_widget/src/main.rs +++ b/examples/custom_widget/src/main.rs @@ -46,6 +46,7 @@ mod circle { fn draw( &self, renderer: &mut Renderer, + _theme: &Renderer::Theme, _style: &renderer::Style, layout: Layout<'_>, _cursor_position: Point, diff --git a/examples/download_progress/src/main.rs b/examples/download_progress/src/main.rs index 21804a0a..4a801ba4 100644 --- a/examples/download_progress/src/main.rs +++ b/examples/download_progress/src/main.rs @@ -1,6 +1,8 @@ +use iced::button; +use iced::executor; use iced::{ - button, executor, Alignment, Application, Button, Column, Command, - Container, Element, Length, ProgressBar, Settings, Subscription, Text, + Alignment, Application, Button, Column, Command, Container, Element, + Length, ProgressBar, Settings, Subscription, Text, Theme, }; mod download; @@ -24,8 +26,9 @@ pub enum Message { } impl Application for Example { - type Executor = executor::Default; type Message = Message; + type Theme = Theme; + type Executor = executor::Default; type Flags = (); fn new(_flags: ()) -> (Example, Command<Message>) { diff --git a/examples/events/src/main.rs b/examples/events/src/main.rs index 7f024c56..c87fbc72 100644 --- a/examples/events/src/main.rs +++ b/examples/events/src/main.rs @@ -1,6 +1,9 @@ +use iced::alignment; +use iced::button; +use iced::executor; use iced::{ - alignment, button, executor, Alignment, Application, Button, Checkbox, - Column, Command, Container, Element, Length, Settings, Subscription, Text, + Alignment, Application, Button, Checkbox, Column, Command, Container, + Element, Length, Settings, Subscription, Text, Theme, }; use iced_native::{window, Event}; @@ -27,8 +30,9 @@ enum Message { } impl Application for Events { - type Executor = executor::Default; type Message = Message; + type Theme = Theme; + type Executor = executor::Default; type Flags = (); fn new(_flags: ()) -> (Events, Command<Message>) { 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 { diff --git a/examples/geometry/src/main.rs b/examples/geometry/src/main.rs index 58dfa3ad..ba4b808e 100644 --- a/examples/geometry/src/main.rs +++ b/examples/geometry/src/main.rs @@ -25,7 +25,7 @@ mod rainbow { } } - impl<Message, B> Widget<Message, Renderer<B>> for Rainbow + impl<Message, B, T> Widget<Message, Renderer<B, T>> for Rainbow where B: Backend, { @@ -39,7 +39,7 @@ mod rainbow { fn layout( &self, - _renderer: &Renderer<B>, + _renderer: &Renderer<B, T>, limits: &layout::Limits, ) -> layout::Node { let size = limits.width(Length::Fill).resolve(Size::ZERO); @@ -49,7 +49,8 @@ mod rainbow { fn draw( &self, - renderer: &mut Renderer<B>, + renderer: &mut Renderer<B, T>, + _theme: &T, _style: &renderer::Style, layout: Layout<'_>, cursor_position: Point, @@ -147,11 +148,11 @@ mod rainbow { } } - impl<'a, Message, B> Into<Element<'a, Message, Renderer<B>>> for Rainbow + impl<'a, Message, B, T> Into<Element<'a, Message, Renderer<B, T>>> for Rainbow where B: Backend, { - fn into(self) -> Element<'a, Message, Renderer<B>> { + fn into(self) -> Element<'a, Message, Renderer<B, T>> { Element::new(self) } } diff --git a/examples/integration_opengl/src/main.rs b/examples/integration_opengl/src/main.rs index 1007b90f..cd46e9fd 100644 --- a/examples/integration_opengl/src/main.rs +++ b/examples/integration_opengl/src/main.rs @@ -125,6 +125,7 @@ pub fn main() { viewport.scale_factor(), ), &mut renderer, + &iced_glow::Theme::Dark, &mut clipboard, &mut debug, ); diff --git a/examples/integration_wgpu/src/main.rs b/examples/integration_wgpu/src/main.rs index 045ee0d3..76f35eef 100644 --- a/examples/integration_wgpu/src/main.rs +++ b/examples/integration_wgpu/src/main.rs @@ -188,6 +188,7 @@ pub fn main() { viewport.scale_factor(), ), &mut renderer, + &iced_wgpu::Theme::Dark, &mut clipboard, &mut debug, ); diff --git a/examples/pane_grid/src/main.rs b/examples/pane_grid/src/main.rs index 2962ca25..4c955b6a 100644 --- a/examples/pane_grid/src/main.rs +++ b/examples/pane_grid/src/main.rs @@ -4,6 +4,7 @@ use iced::executor; use iced::keyboard; use iced::pane_grid::{self, PaneGrid}; use iced::scrollable::{self, Scrollable}; +use iced::theme::{self, Theme}; use iced::{ Application, Color, Column, Command, Container, Element, Length, Row, Settings, Size, Subscription, Text, @@ -36,6 +37,7 @@ enum Message { impl Application for Example { type Message = Message; + type Theme = Theme; type Executor = executor::Default; type Flags = (); @@ -171,7 +173,7 @@ impl Application for Example { let text = if *is_pinned { "Unpin" } else { "Pin" }; let pin_button = Button::new(pin_button, Text::new(text).size(14)) .on_press(Message::TogglePin(id)) - .style(style::Button::Pin) + .style(theme::Button::Secondary) .padding(3); let title = Row::with_children(vec![ @@ -309,7 +311,7 @@ impl Content { .. } = self; - let button = |state, label, message, style| { + let button = |state, label, message| { Button::new( state, Text::new(label) @@ -320,7 +322,6 @@ impl Content { .width(Length::Fill) .padding(8) .on_press(message) - .style(style) }; let mut controls = Column::new() @@ -330,22 +331,18 @@ impl Content { split_horizontally, "Split horizontally", Message::Split(pane_grid::Axis::Horizontal, pane), - style::Button::Primary, )) .push(button( split_vertically, "Split vertically", Message::Split(pane_grid::Axis::Vertical, pane), - style::Button::Primary, )); if total_panes > 1 && !is_pinned { - controls = controls.push(button( - close, - "Close", - Message::Close(pane), - style::Button::Destructive, - )); + controls = controls.push( + button(close, "Close", Message::Close(pane)) + .style(theme::Button::Destructive), + ); } let content = Scrollable::new(scroll) @@ -379,8 +376,9 @@ impl Controls { ) -> Element<Message> { let mut button = Button::new(&mut self.close, Text::new("Close").size(14)) - .style(style::Button::Control) + .style(theme::Button::Destructive) .padding(3); + if total_panes > 1 && !is_pinned { button = button.on_press(Message::Close(pane)); } @@ -389,8 +387,7 @@ impl Controls { } mod style { - use crate::PANE_ID_COLOR_FOCUSED; - use iced::{button, container, Background, Color, Vector}; + use iced::{container, Background, Color}; const SURFACE: Color = Color::from_rgb( 0xF2 as f32 / 255.0, @@ -398,18 +395,6 @@ mod style { 0xF5 as f32 / 255.0, ); - 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, - ); - pub enum TitleBar { Active, Focused, @@ -449,51 +434,4 @@ mod style { } } } - - pub enum Button { - Primary, - Destructive, - Control, - Pin, - } - - impl button::StyleSheet for Button { - fn active(&self) -> button::Style { - let (background, text_color) = match self { - Button::Primary => (Some(ACTIVE), Color::WHITE), - Button::Destructive => { - (None, Color::from_rgb8(0xFF, 0x47, 0x47)) - } - Button::Control => (Some(PANE_ID_COLOR_FOCUSED), Color::WHITE), - Button::Pin => (Some(ACTIVE), Color::WHITE), - }; - - button::Style { - text_color, - background: background.map(Background::Color), - border_radius: 5.0, - shadow_offset: Vector::new(0.0, 0.0), - ..button::Style::default() - } - } - - fn hovered(&self) -> button::Style { - let active = self.active(); - - let background = match self { - Button::Primary => Some(HOVERED), - Button::Destructive => Some(Color { - a: 0.2, - ..active.text_color - }), - Button::Control => Some(PANE_ID_COLOR_FOCUSED), - Button::Pin => Some(HOVERED), - }; - - button::Style { - background: background.map(Background::Color), - ..active - } - } - } } diff --git a/examples/pokedex/src/main.rs b/examples/pokedex/src/main.rs index 85c26987..4b0e913d 100644 --- a/examples/pokedex/src/main.rs +++ b/examples/pokedex/src/main.rs @@ -1,6 +1,9 @@ +use iced::button; +use iced::futures; +use iced::image; use iced::{ - button, futures, image, Alignment, Application, Button, Column, Command, - Container, Element, Length, Row, Settings, Text, + Alignment, Application, Button, Column, Command, Container, Element, + Length, Row, Settings, Text, Theme, }; pub fn main() -> iced::Result { @@ -26,8 +29,9 @@ enum Message { } impl Application for Pokedex { - type Executor = iced::executor::Default; type Message = Message; + type Theme = Theme; + type Executor = iced::executor::Default; type Flags = (); fn new(_flags: ()) -> (Pokedex, Command<Message>) { @@ -238,29 +242,5 @@ impl From<reqwest::Error> for Error { } fn button<'a>(state: &'a mut button::State, text: &str) -> Button<'a, Message> { - Button::new(state, Text::new(text)) - .padding(10) - .style(style::Button::Primary) -} - -mod style { - use iced::{button, Background, Color, Vector}; - - pub enum Button { - Primary, - } - - impl button::StyleSheet for Button { - fn active(&self) -> button::Style { - button::Style { - background: Some(Background::Color(match self { - Button::Primary => Color::from_rgb(0.11, 0.42, 0.87), - })), - border_radius: 12.0, - shadow_offset: Vector::new(1.0, 1.0), - text_color: Color::WHITE, - ..button::Style::default() - } - } - } + Button::new(state, Text::new(text)).padding(10) } diff --git a/examples/pure/component/src/main.rs b/examples/pure/component/src/main.rs index b38d6fca..2f98f768 100644 --- a/examples/pure/component/src/main.rs +++ b/examples/pure/component/src/main.rs @@ -47,12 +47,13 @@ impl Sandbox for Component { } mod numeric_input { - use iced::pure::{button, row, text, text_input}; use iced_lazy::pure::{self, Component}; use iced_native::alignment::{self, Alignment}; use iced_native::text; + use iced_native::widget; use iced_native::Length; use iced_pure::Element; + use iced_pure::{button, row, text, text_input}; pub struct NumericInput<Message> { value: Option<u32>, @@ -88,6 +89,9 @@ mod numeric_input { impl<Message, Renderer> Component<Message, Renderer> for NumericInput<Message> where Renderer: text::Renderer + 'static, + Renderer::Theme: widget::button::StyleSheet, + <Renderer::Theme as widget::button::StyleSheet>::Variant: + Default + Copy, { type State = (); type Event = Event; @@ -158,6 +162,9 @@ mod numeric_input { where Message: 'a, Renderer: 'static + text::Renderer, + Renderer::Theme: widget::button::StyleSheet, + <Renderer::Theme as widget::button::StyleSheet>::Variant: + Default + Copy, { fn from(numeric_input: NumericInput<Message>) -> Self { pure::component(numeric_input) diff --git a/examples/pure/game_of_life/src/main.rs b/examples/pure/game_of_life/src/main.rs index a3164701..a3e46888 100644 --- a/examples/pure/game_of_life/src/main.rs +++ b/examples/pure/game_of_life/src/main.rs @@ -9,6 +9,7 @@ use iced::pure::{ button, checkbox, column, container, pick_list, row, slider, text, }; use iced::pure::{Application, Element}; +use iced::theme::{self, Theme}; use iced::time; use iced::window; use iced::{Alignment, Color, Command, Length, Settings, Subscription}; @@ -52,6 +53,7 @@ enum Message { impl Application for GameOfLife { type Message = Message; + type Theme = Theme; type Executor = executor::Default; type Flags = (); @@ -168,10 +170,13 @@ fn view_controls<'a>( .spacing(10) .push( button(if is_playing { "Pause" } else { "Play" }) - .on_press(Message::TogglePlayback) - .style(style::Button), + .on_press(Message::TogglePlayback), ) - .push(button("Next").on_press(Message::Next).style(style::Button)); + .push( + button("Next") + .on_press(Message::Next) + .style(theme::Button::Secondary), + ); let speed_controls = row() .width(Length::Fill) @@ -201,7 +206,11 @@ fn view_controls<'a>( .text_size(16) .style(style::PickList), ) - .push(button("Clear").on_press(Message::Clear).style(style::Clear)) + .push( + button("Clear") + .on_press(Message::Clear) + .style(theme::Button::Destructive), + ) .into() } diff --git a/examples/pure/game_of_life/src/style.rs b/examples/pure/game_of_life/src/style.rs index 1a64cf4a..dbd70c26 100644 --- a/examples/pure/game_of_life/src/style.rs +++ b/examples/pure/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, 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, @@ -35,67 +29,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 { diff --git a/examples/pure/pane_grid/src/main.rs b/examples/pure/pane_grid/src/main.rs index 65516956..2825a5c2 100644 --- a/examples/pure/pane_grid/src/main.rs +++ b/examples/pure/pane_grid/src/main.rs @@ -4,6 +4,7 @@ use iced::keyboard; use iced::pure::widget::pane_grid::{self, PaneGrid}; use iced::pure::{button, column, container, row, scrollable, text}; use iced::pure::{Application, Element}; +use iced::theme::{self, Theme}; use iced::{Color, Command, Length, Settings, Size, Subscription}; use iced_lazy::pure::responsive; use iced_native::{event, subscription, Event}; @@ -33,6 +34,7 @@ enum Message { impl Application for Example { type Message = Message; + type Theme = Theme; type Executor = executor::Default; type Flags = (); @@ -161,7 +163,6 @@ impl Application for Example { text(if pane.is_pinned { "Unpin" } else { "Pin" }).size(14), ) .on_press(Message::TogglePin(id)) - .style(style::Button::Pin) .padding(3); let title = row() @@ -259,7 +260,7 @@ fn view_content<'a>( is_pinned: bool, size: Size, ) -> Element<'a, Message> { - let button = |label, message, style| { + let button = |label, message| { button( text(label) .width(Length::Fill) @@ -269,7 +270,6 @@ fn view_content<'a>( .width(Length::Fill) .padding(8) .on_press(message) - .style(style) }; let mut controls = column() @@ -278,20 +278,17 @@ fn view_content<'a>( .push(button( "Split horizontally", Message::Split(pane_grid::Axis::Horizontal, pane), - style::Button::Primary, )) .push(button( "Split vertically", Message::Split(pane_grid::Axis::Vertical, pane), - style::Button::Primary, )); if total_panes > 1 && !is_pinned { - controls = controls.push(button( - "Close", - Message::Close(pane), - style::Button::Destructive, - )); + controls = controls.push( + button("Close", Message::Close(pane)) + .style(theme::Button::Destructive), + ); } let content = column() @@ -315,7 +312,7 @@ fn view_controls<'a>( is_pinned: bool, ) -> Element<'a, Message> { let mut button = button(text("Close").size(14)) - .style(style::Button::Control) + .style(theme::Button::Destructive) .padding(3); if total_panes > 1 && !is_pinned { @@ -326,8 +323,7 @@ fn view_controls<'a>( } mod style { - use crate::PANE_ID_COLOR_FOCUSED; - use iced::{button, container, Background, Color, Vector}; + use iced::{container, Background, Color}; const SURFACE: Color = Color::from_rgb( 0xF2 as f32 / 255.0, @@ -335,18 +331,6 @@ mod style { 0xF5 as f32 / 255.0, ); - 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, - ); - pub enum TitleBar { Active, Focused, @@ -386,51 +370,4 @@ mod style { } } } - - pub enum Button { - Primary, - Destructive, - Control, - Pin, - } - - impl button::StyleSheet for Button { - fn active(&self) -> button::Style { - let (background, text_color) = match self { - Button::Primary => (Some(ACTIVE), Color::WHITE), - Button::Destructive => { - (None, Color::from_rgb8(0xFF, 0x47, 0x47)) - } - Button::Control => (Some(PANE_ID_COLOR_FOCUSED), Color::WHITE), - Button::Pin => (Some(ACTIVE), Color::WHITE), - }; - - button::Style { - text_color, - background: background.map(Background::Color), - border_radius: 5.0, - shadow_offset: Vector::new(0.0, 0.0), - ..button::Style::default() - } - } - - fn hovered(&self) -> button::Style { - let active = self.active(); - - let background = match self { - Button::Primary => Some(HOVERED), - Button::Destructive => Some(Color { - a: 0.2, - ..active.text_color - }), - Button::Control => Some(PANE_ID_COLOR_FOCUSED), - Button::Pin => Some(HOVERED), - }; - - button::Style { - background: background.map(Background::Color), - ..active - } - } - } } diff --git a/examples/pure/todos/src/main.rs b/examples/pure/todos/src/main.rs index 6a6c6300..ea772def 100644 --- a/examples/pure/todos/src/main.rs +++ b/examples/pure/todos/src/main.rs @@ -4,6 +4,7 @@ use iced::pure::{ button, checkbox, column, container, row, scrollable, text, text_input, Application, Element, }; +use iced::theme::{self, Theme}; use iced::window; use iced::{Command, Font, Length, Settings}; use serde::{Deserialize, Serialize}; @@ -44,8 +45,9 @@ enum Message { } impl Application for Todos { - type Executor = iced::executor::Default; type Message = Message; + type Theme = Theme; + type Executor = iced::executor::Default; type Flags = (); fn new(_flags: ()) -> (Todos, Command<Message>) { @@ -287,7 +289,7 @@ impl Task { button(edit_icon()) .on_press(TaskMessage::Edit) .padding(10) - .style(style::Button::Icon), + .style(theme::Button::Text), ) .into() } @@ -313,7 +315,7 @@ impl Task { ) .on_press(TaskMessage::Delete) .padding(10) - .style(style::Button::Destructive), + .style(theme::Button::Destructive), ) .into() } @@ -328,9 +330,9 @@ fn view_controls(tasks: &[Task], current_filter: Filter) -> Element<Message> { let label = text(label).size(16); let button = button(label).style(if filter == current_filter { - style::Button::FilterSelected + theme::Button::Primary } else { - style::Button::FilterActive + theme::Button::Text }); button.on_press(Message::FilterChanged(filter)).padding(8) @@ -552,57 +554,3 @@ impl SavedState { Ok(()) } } - -mod style { - use iced::{button, Background, Color, Vector}; - - pub enum Button { - FilterActive, - FilterSelected, - Icon, - Destructive, - } - - impl button::StyleSheet for Button { - fn active(&self) -> button::Style { - match self { - Button::FilterActive => button::Style::default(), - Button::FilterSelected => button::Style { - background: Some(Background::Color(Color::from_rgb( - 0.2, 0.2, 0.7, - ))), - border_radius: 10.0, - text_color: Color::WHITE, - ..button::Style::default() - }, - Button::Icon => button::Style { - text_color: Color::from_rgb(0.5, 0.5, 0.5), - ..button::Style::default() - }, - Button::Destructive => button::Style { - background: Some(Background::Color(Color::from_rgb( - 0.8, 0.2, 0.2, - ))), - border_radius: 5.0, - text_color: Color::WHITE, - shadow_offset: Vector::new(1.0, 1.0), - ..button::Style::default() - }, - } - } - - fn hovered(&self) -> button::Style { - let active = self.active(); - - button::Style { - text_color: match self { - Button::Icon => Color::from_rgb(0.2, 0.2, 0.7), - Button::FilterActive => Color::from_rgb(0.2, 0.2, 0.7), - _ => active.text_color, - }, - shadow_offset: active.shadow_offset + Vector::new(0.0, 1.0), - ..active - } - } - } -} diff --git a/examples/pure/tour/src/main.rs b/examples/pure/tour/src/main.rs index a44d99f3..2002ad98 100644 --- a/examples/pure/tour/src/main.rs +++ b/examples/pure/tour/src/main.rs @@ -5,6 +5,7 @@ use iced::pure::{ scrollable, slider, text, text_input, toggler, vertical_space, }; use iced::pure::{Element, Sandbox}; +use iced::theme; use iced::{Color, Length, Settings}; pub fn main() -> iced::Result { @@ -55,7 +56,7 @@ impl Sandbox for Tour { controls = controls.push( button("Back") .on_press(Message::BackPressed) - .style(style::Button::Secondary), + .style(theme::Button::Secondary), ); } @@ -65,7 +66,7 @@ impl Sandbox for Tour { controls = controls.push( button("Next") .on_press(Message::NextPressed) - .style(style::Button::Primary), + .style(theme::Button::Primary), ); } @@ -669,35 +670,3 @@ pub enum Layout { Row, Column, } - -mod style { - use iced::{button, Background, Color, Vector}; - - pub enum Button { - Primary, - Secondary, - } - - impl button::StyleSheet for Button { - fn active(&self) -> button::Style { - button::Style { - background: Some(Background::Color(match self { - Button::Primary => Color::from_rgb(0.11, 0.42, 0.87), - Button::Secondary => Color::from_rgb(0.5, 0.5, 0.5), - })), - border_radius: 12.0, - shadow_offset: Vector::new(1.0, 1.0), - text_color: Color::from_rgb8(0xEE, 0xEE, 0xEE), - ..button::Style::default() - } - } - - fn hovered(&self) -> button::Style { - button::Style { - text_color: Color::WHITE, - shadow_offset: Vector::new(1.0, 2.0), - ..self.active() - } - } - } -} diff --git a/examples/solar_system/src/main.rs b/examples/solar_system/src/main.rs index 12184dd1..308c8c39 100644 --- a/examples/solar_system/src/main.rs +++ b/examples/solar_system/src/main.rs @@ -6,10 +6,13 @@ //! Inspired by the example found in the MDN docs[1]. //! //! [1]: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations#An_animated_solar_system +use iced::canvas::{self, Cursor, Path, Stroke}; +use iced::executor; +use iced::time; +use iced::window; use iced::{ - canvas::{self, Cursor, Path, Stroke}, - executor, time, window, Application, Canvas, Color, Command, Element, - Length, Point, Rectangle, Settings, Size, Subscription, Vector, + Application, Canvas, Color, Command, Element, Length, Point, Rectangle, + Settings, Size, Subscription, Theme, Vector, }; use std::time::Instant; @@ -31,8 +34,9 @@ enum Message { } impl Application for SolarSystem { - type Executor = executor::Default; type Message = Message; + type Theme = Theme; + type Executor = executor::Default; type Flags = (); fn new(_flags: ()) -> (Self, Command<Message>) { diff --git a/examples/stopwatch/src/main.rs b/examples/stopwatch/src/main.rs index 377d7a2d..b83b92ec 100644 --- a/examples/stopwatch/src/main.rs +++ b/examples/stopwatch/src/main.rs @@ -1,7 +1,13 @@ +use iced::alignment; +use iced::button; +use iced::executor; +use iced::theme::{self, Theme}; +use iced::time; use iced::{ - alignment, button, executor, time, Alignment, Application, Button, Column, - Command, Container, Element, Length, Row, Settings, Subscription, Text, + Alignment, Application, Button, Column, Command, Container, Element, + Length, Row, Settings, Subscription, Text, }; + use std::time::{Duration, Instant}; pub fn main() -> iced::Result { @@ -28,8 +34,9 @@ enum Message { } impl Application for Stopwatch { - type Executor = executor::Default; type Message = Message; + type Theme = Theme; + type Executor = executor::Default; type Flags = (); fn new(_flags: ()) -> (Stopwatch, Command<Message>) { @@ -99,7 +106,7 @@ impl Application for Stopwatch { )) .size(40); - let button = |state, label, style| { + let button = |state, label| { Button::new( state, Text::new(label) @@ -107,21 +114,20 @@ impl Application for Stopwatch { ) .padding(10) .width(Length::Units(80)) - .style(style) }; let toggle_button = { - let (label, color) = match self.state { - State::Idle => ("Start", style::Button::Primary), - State::Ticking { .. } => ("Stop", style::Button::Destructive), + let label = match self.state { + State::Idle => "Start", + State::Ticking { .. } => "Stop", }; - button(&mut self.toggle, label, color).on_press(Message::Toggle) + button(&mut self.toggle, label).on_press(Message::Toggle) }; - let reset_button = - button(&mut self.reset, "Reset", style::Button::Secondary) - .on_press(Message::Reset); + let reset_button = button(&mut self.reset, "Reset") + .style(theme::Button::Destructive) + .on_press(Message::Reset); let controls = Row::new() .spacing(20) @@ -142,29 +148,3 @@ impl Application for Stopwatch { .into() } } - -mod style { - use iced::{button, Background, Color, Vector}; - - pub enum Button { - Primary, - Secondary, - Destructive, - } - - impl button::StyleSheet for Button { - fn active(&self) -> button::Style { - button::Style { - background: Some(Background::Color(match self { - Button::Primary => Color::from_rgb(0.11, 0.42, 0.87), - Button::Secondary => Color::from_rgb(0.5, 0.5, 0.5), - Button::Destructive => Color::from_rgb(0.8, 0.2, 0.2), - })), - border_radius: 12.0, - shadow_offset: Vector::new(1.0, 1.0), - text_color: Color::WHITE, - ..button::Style::default() - } - } - } -} diff --git a/examples/styling/src/main.rs b/examples/styling/src/main.rs index b4ef3e87..e6c4ac37 100644 --- a/examples/styling/src/main.rs +++ b/examples/styling/src/main.rs @@ -1,7 +1,11 @@ +use iced::button; +use iced::scrollable; +use iced::slider; +use iced::text_input; use iced::{ - button, scrollable, slider, text_input, Alignment, Button, Checkbox, - Column, Container, Element, Length, ProgressBar, Radio, Row, Rule, Sandbox, - Scrollable, Settings, Slider, Space, Text, TextInput, Toggler, + Alignment, Button, Checkbox, Column, Container, Element, Length, + ProgressBar, Radio, Row, Rule, Sandbox, Scrollable, Settings, Slider, + Space, Text, TextInput, Toggler, }; pub fn main() -> iced::Result { @@ -81,8 +85,7 @@ impl Sandbox for Styling { let button = Button::new(&mut self.button, Text::new("Submit")) .padding(10) - .on_press(Message::ButtonPressed) - .style(self.theme); + .on_press(Message::ButtonPressed); let slider = Slider::new( &mut self.slider, @@ -156,8 +159,8 @@ impl Sandbox for Styling { mod style { use iced::{ - button, checkbox, container, progress_bar, radio, rule, scrollable, - slider, text_input, toggler, + checkbox, container, progress_bar, radio, rule, scrollable, slider, + text_input, toggler, }; #[derive(Debug, Clone, Copy, PartialEq, Eq)] @@ -203,15 +206,6 @@ mod style { } } - impl<'a> From<Theme> for Box<dyn button::StyleSheet + 'a> { - fn from(theme: Theme) -> Self { - match theme { - Theme::Light => light::Button.into(), - Theme::Dark => dark::Button.into(), - } - } - } - impl<'a> From<Theme> for Box<dyn scrollable::StyleSheet + 'a> { fn from(theme: Theme) -> Self { match theme { @@ -266,36 +260,10 @@ mod style { } } - mod light { - use iced::{button, Color, Vector}; - - pub struct Button; - - impl button::StyleSheet for Button { - fn active(&self) -> button::Style { - button::Style { - background: Color::from_rgb(0.11, 0.42, 0.87).into(), - border_radius: 12.0, - shadow_offset: Vector::new(1.0, 1.0), - text_color: Color::from_rgb8(0xEE, 0xEE, 0xEE), - ..button::Style::default() - } - } - - fn hovered(&self) -> button::Style { - button::Style { - text_color: Color::WHITE, - shadow_offset: Vector::new(1.0, 2.0), - ..self.active() - } - } - } - } - mod dark { use iced::{ - button, checkbox, container, progress_bar, radio, rule, scrollable, - slider, text_input, toggler, Color, + checkbox, container, progress_bar, radio, rule, scrollable, slider, + text_input, toggler, Color, }; const SURFACE: Color = Color::from_rgb( @@ -396,35 +364,6 @@ mod style { } } - pub struct Button; - - impl button::StyleSheet for Button { - fn active(&self) -> button::Style { - button::Style { - background: ACTIVE.into(), - border_radius: 3.0, - text_color: Color::WHITE, - ..button::Style::default() - } - } - - fn hovered(&self) -> button::Style { - button::Style { - background: HOVERED.into(), - 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 Scrollable; impl scrollable::StyleSheet for Scrollable { diff --git a/examples/system_information/src/main.rs b/examples/system_information/src/main.rs index 560220b8..9e6a2f61 100644 --- a/examples/system_information/src/main.rs +++ b/examples/system_information/src/main.rs @@ -1,6 +1,6 @@ use iced::{ button, executor, system, Application, Button, Column, Command, Container, - Element, Length, Settings, Text, + Element, Length, Settings, Text, Theme, }; use bytesize::ByteSize; @@ -25,6 +25,7 @@ enum Message { impl Application for Example { type Message = Message; + type Theme = Theme; type Executor = executor::Default; type Flags = (); diff --git a/examples/todos/src/main.rs b/examples/todos/src/main.rs index 0b889407..453cddc3 100644 --- a/examples/todos/src/main.rs +++ b/examples/todos/src/main.rs @@ -2,6 +2,7 @@ use iced::alignment::{self, Alignment}; use iced::button::{self, Button}; use iced::scrollable::{self, Scrollable}; use iced::text_input::{self, TextInput}; +use iced::theme::{self, Theme}; use iced::{ Application, Checkbox, Column, Command, Container, Element, Font, Length, Row, Settings, Text, @@ -42,6 +43,7 @@ enum Message { impl Application for Todos { type Executor = iced::executor::Default; + type Theme = Theme; type Message = Message; type Flags = (); @@ -304,7 +306,7 @@ impl Task { Button::new(edit_button, edit_icon()) .on_press(TaskMessage::Edit) .padding(10) - .style(style::Button::Icon), + .style(theme::Button::Text), ) .into() } @@ -335,7 +337,7 @@ impl Task { ) .on_press(TaskMessage::Delete) .padding(10) - .style(style::Button::Destructive), + .style(theme::Button::Destructive), ) .into() } @@ -364,9 +366,9 @@ impl Controls { let label = Text::new(label).size(16); let button = Button::new(state, label).style(if filter == current_filter { - style::Button::FilterSelected + theme::Button::Primary } else { - style::Button::FilterActive + theme::Button::Text }); button.on_press(Message::FilterChanged(filter)).padding(8) @@ -599,57 +601,3 @@ impl SavedState { Ok(()) } } - -mod style { - use iced::{button, Background, Color, Vector}; - - pub enum Button { - FilterActive, - FilterSelected, - Icon, - Destructive, - } - - impl button::StyleSheet for Button { - fn active(&self) -> button::Style { - match self { - Button::FilterActive => button::Style::default(), - Button::FilterSelected => button::Style { - background: Some(Background::Color(Color::from_rgb( - 0.2, 0.2, 0.7, - ))), - border_radius: 10.0, - text_color: Color::WHITE, - ..button::Style::default() - }, - Button::Icon => button::Style { - text_color: Color::from_rgb(0.5, 0.5, 0.5), - ..button::Style::default() - }, - Button::Destructive => button::Style { - background: Some(Background::Color(Color::from_rgb( - 0.8, 0.2, 0.2, - ))), - border_radius: 5.0, - text_color: Color::WHITE, - shadow_offset: Vector::new(1.0, 1.0), - ..button::Style::default() - }, - } - } - - fn hovered(&self) -> button::Style { - let active = self.active(); - - button::Style { - text_color: match self { - Button::Icon => Color::from_rgb(0.2, 0.2, 0.7), - Button::FilterActive => Color::from_rgb(0.2, 0.2, 0.7), - _ => active.text_color, - }, - shadow_offset: active.shadow_offset + Vector::new(0.0, 1.0), - ..active - } - } - } -} diff --git a/examples/tour/src/main.rs b/examples/tour/src/main.rs index 2024d25a..8bdc7f1d 100644 --- a/examples/tour/src/main.rs +++ b/examples/tour/src/main.rs @@ -1,7 +1,13 @@ +use iced::alignment; +use iced::button; +use iced::scrollable; +use iced::slider; +use iced::text_input; +use iced::theme; use iced::{ - alignment, button, scrollable, slider, text_input, Button, Checkbox, Color, - Column, Container, ContentFit, Element, Image, Length, Radio, Row, Sandbox, - Scrollable, Settings, Slider, Space, Text, TextInput, Toggler, + Button, Checkbox, Color, Column, Container, ContentFit, Element, Image, + Length, Radio, Row, Sandbox, Scrollable, Settings, Slider, Space, Text, + TextInput, Toggler, }; pub fn main() -> iced::Result { @@ -64,7 +70,7 @@ impl Sandbox for Tour { controls = controls.push( button(back_button, "Back") .on_press(Message::BackPressed) - .style(style::Button::Secondary), + .style(theme::Button::Secondary), ); } @@ -74,7 +80,7 @@ impl Sandbox for Tour { controls = controls.push( button(next_button, "Next") .on_press(Message::NextPressed) - .style(style::Button::Primary), + .style(theme::Button::Primary), ); } @@ -818,36 +824,3 @@ pub enum Layout { Row, Column, } - -mod style { - use iced::button; - use iced::{Background, Color, Vector}; - - pub enum Button { - Primary, - Secondary, - } - - impl button::StyleSheet for Button { - fn active(&self) -> button::Style { - button::Style { - background: Some(Background::Color(match self { - Button::Primary => Color::from_rgb(0.11, 0.42, 0.87), - Button::Secondary => Color::from_rgb(0.5, 0.5, 0.5), - })), - border_radius: 12.0, - shadow_offset: Vector::new(1.0, 1.0), - text_color: Color::from_rgb8(0xEE, 0xEE, 0xEE), - ..button::Style::default() - } - } - - fn hovered(&self) -> button::Style { - button::Style { - text_color: Color::WHITE, - shadow_offset: Vector::new(1.0, 2.0), - ..self.active() - } - } - } -} diff --git a/examples/url_handler/src/main.rs b/examples/url_handler/src/main.rs index ee2d249a..b544c30d 100644 --- a/examples/url_handler/src/main.rs +++ b/examples/url_handler/src/main.rs @@ -1,6 +1,7 @@ +use iced::executor; use iced::{ - executor, Application, Command, Container, Element, Length, Settings, - Subscription, Text, + Application, Command, Container, Element, Length, Settings, Subscription, + Text, Theme, }; use iced_native::{ event::{MacOS, PlatformSpecific}, @@ -22,8 +23,9 @@ enum Message { } impl Application for App { - type Executor = executor::Default; type Message = Message; + type Theme = Theme; + type Executor = executor::Default; type Flags = (); fn new(_flags: ()) -> (App, Command<Message>) { diff --git a/examples/websocket/src/main.rs b/examples/websocket/src/main.rs index c03a9f3a..65120710 100644 --- a/examples/websocket/src/main.rs +++ b/examples/websocket/src/main.rs @@ -7,7 +7,7 @@ use iced::scrollable::{self, Scrollable}; use iced::text_input::{self, TextInput}; use iced::{ Application, Color, Column, Command, Container, Element, Length, Row, - Settings, Subscription, Text, + Settings, Subscription, Text, Theme, }; pub fn main() -> iced::Result { @@ -34,6 +34,7 @@ enum Message { impl Application for WebSocket { type Message = Message; + type Theme = Theme; type Flags = (); type Executor = executor::Default; |