Draft Style and StyleSheet for Button

wgpu/src/lib.rs

@@ -19,11 +19,13 @@
 //! [`wgpu`]: https://github.com/gfx-rs/wgpu-rs
 //! [WebGPU API]: https://gpuweb.github.io/gpuweb/
 //! [`wgpu_glyph`]: https://github.com/hecrj/wgpu_glyph
-#![deny(missing_docs)]
+//#![deny(missing_docs)]
 #![deny(missing_debug_implementations)]
 #![deny(unused_results)]
 #![deny(unsafe_code)]
 #![deny(rust_2018_idioms)]
+pub mod widget;
+
 mod image;
 mod primitive;
 mod quad;
@@ -31,9 +33,11 @@ mod renderer;
 mod text;
 mod transformation;
 
-pub(crate) use crate::image::Image;
-pub(crate) use quad::Quad;
-pub(crate) use transformation::Transformation;
-
 pub use primitive::Primitive;
 pub use renderer::{Renderer, Target};
+#[doc(no_inline)]
+pub use widget::*;
+
+pub(crate) use self::image::Image;
+pub(crate) use quad::Quad;
+pub(crate) use transformation::Transformation;

wgpu/src/renderer.rs

@@ -22,7 +22,7 @@ pub struct Renderer {
     device: Device,
     queue: Queue,
     quad_pipeline: quad::Pipeline,
-    image_pipeline: crate::image::Pipeline,
+    image_pipeline: image::Pipeline,
     text_pipeline: text::Pipeline,
 }
 
@@ -63,7 +63,7 @@ impl Renderer {
 
         let text_pipeline = text::Pipeline::new(&mut device);
         let quad_pipeline = quad::Pipeline::new(&mut device);
-        let image_pipeline = crate::image::Pipeline::new(&mut device);
+        let image_pipeline = image::Pipeline::new(&mut device);
 
         Self {
             device,

wgpu/src/renderer/widget/button.rs

@@ -1,50 +1,50 @@
-use crate::{Primitive, Renderer};
-use iced_native::{button, Background, MouseCursor, Point, Rectangle};
+use crate::{button::StyleSheet, Primitive, Renderer};
+use iced_native::{Background, MouseCursor, Point, Rectangle};
+
+impl iced_native::button::Renderer for Renderer {
+    type Style = Box<dyn StyleSheet>;
 
-impl button::Renderer for Renderer {
     fn draw(
         &mut self,
         bounds: Rectangle,
         cursor_position: Point,
         is_pressed: bool,
-        background: Option<Background>,
-        border_radius: u16,
+        style: &Box<dyn StyleSheet>,
         (content, _): Self::Output,
     ) -> Self::Output {
         let is_mouse_over = bounds.contains(cursor_position);
 
         // TODO: Render proper shadows
-        // TODO: Make hovering and pressed styles configurable
-        let shadow_offset = if is_mouse_over {
+        let styling = if is_mouse_over {
             if is_pressed {
-                0.0
+                style.pressed()
             } else {
-                2.0
+                style.hovered()
             }
         } else {
-            1.0
+            style.active()
         };
 
         (
-            match background {
+            match styling.background {
                 None => content,
                 Some(background) => Primitive::Group {
                     primitives: vec![
                         Primitive::Quad {
                             bounds: Rectangle {
                                 x: bounds.x + 1.0,
-                                y: bounds.y + shadow_offset,
+                                y: bounds.y + styling.shadow_offset,
                                 ..bounds
                             },
                             background: Background::Color(
                                 [0.0, 0.0, 0.0, 0.5].into(),
                             ),
-                            border_radius,
+                            border_radius: styling.border_radius,
                         },
                         Primitive::Quad {
                             bounds,
                             background,
-                            border_radius,
+                            border_radius: styling.border_radius,
                         },
                         content,
                     ],

wgpu/src/renderer/widget/button/style.rs

@@ -0,0 +1 @@
+

wgpu/src/widget.rs

@@ -0,0 +1 @@
+pub mod button;

wgpu/src/widget/button.rs

@@ -0,0 +1,97 @@
+//! Allow your users to perform actions by pressing a button.
+//!
+//! A [`Button`] has some local [`State`].
+//!
+//! [`Button`]: type.Button.html
+//! [`State`]: struct.State.html
+use crate::Renderer;
+use iced_native::Background;
+
+pub use iced_native::button::State;
+
+/// A widget that produces a message when clicked.
+///
+/// This is an alias of an `iced_native` button with an `iced_wgpu::Renderer`.
+pub type Button<'a, Message> = iced_native::Button<'a, Message, Renderer>;
+
+#[derive(Debug)]
+pub struct Style {
+    pub shadow_offset: f32,
+    pub background: Option<Background>,
+    pub border_radius: u16,
+}
+
+pub trait StyleSheet {
+    fn active(&self) -> Style;
+
+    fn hovered(&self) -> Style {
+        let active = self.active();
+
+        Style {
+            shadow_offset: active.shadow_offset + 1.0,
+            ..active
+        }
+    }
+
+    fn pressed(&self) -> Style {
+        Style {
+            shadow_offset: 0.0,
+            ..self.active()
+        }
+    }
+
+    fn disabled(&self) -> Style {
+        self.active()
+    }
+}
+
+struct Default;
+
+impl StyleSheet for Default {
+    fn active(&self) -> Style {
+        Style {
+            shadow_offset: 1.0,
+            background: Some(Background::Color([0.5, 0.5, 0.5].into())),
+            border_radius: 5,
+        }
+    }
+
+    fn hovered(&self) -> Style {
+        Style {
+            shadow_offset: 2.0,
+            background: Some(Background::Color([0.5, 0.5, 0.5].into())),
+            border_radius: 5,
+        }
+    }
+
+    fn pressed(&self) -> Style {
+        Style {
+            shadow_offset: 0.0,
+            background: Some(Background::Color([0.5, 0.5, 0.5].into())),
+            border_radius: 5,
+        }
+    }
+
+    fn disabled(&self) -> Style {
+        Style {
+            shadow_offset: 0.0,
+            background: Some(Background::Color([0.7, 0.7, 0.7].into())),
+            border_radius: 5,
+        }
+    }
+}
+
+impl std::default::Default for Box<dyn StyleSheet> {
+    fn default() -> Self {
+        Box::new(Default)
+    }
+}
+
+impl<T> From<T> for Box<dyn StyleSheet>
+where
+    T: 'static + StyleSheet,
+{
+    fn from(style: T) -> Self {
+        Box::new(style)
+    }
+}