Draft first-class Theme support

RFC: iced-rs/rfcs#6

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>) {

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)

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())

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,

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>) {

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>) {

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()
     }

examples/game_of_life/src/style.rs

@@ -1,17 +1,11 @@
-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,
     0x89 as f32 / 255.0,
     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 {

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)
         }
     }

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,
                     );

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,
                     );