Implement Geometry2D primitive

core/src/geometry.rs

@@ -1,18 +1,20 @@
-/// Hai
+/// A two-dimensional vertex which has a color
 #[repr(C)]
 #[derive(Copy, Clone, Debug)]
 pub struct Vertex2D {
-    /// Hai
+    /// The vertex position
     pub position: [f32; 2],
-    /// Hai
+    /// The vertex color in rgba
     pub color: [f32; 4],
 }
 
-/// Hai
+/// A set of [`Vertex2D`] and indices for drawing some 2D geometry on the GPU.
+///
+/// [`Vertex2D`]: struct.Vertex2D.html
 #[derive(Clone, Debug)]
 pub struct Geometry2D {
-    /// Hai
+    /// The vertices for this geometry
     pub vertices: Vec<Vertex2D>,
-    /// Hai
+    /// The indices for this geometry
     pub indices: Vec<u16>,
 }

examples/custom_widget.rs

@@ -10,8 +10,8 @@ mod circle {
     // if you wish to, by creating your own `Renderer` trait, which could be
     // implemented by `iced_wgpu` and other renderers.
     use iced_native::{
-        layout, Background, Color, Element, Geometry2D, Hasher, Layout, Length,
-        MouseCursor, Point, Size, Vertex2D, Widget,
+        layout, Background, Color, Element, Hasher, Layout, Length,
+        MouseCursor, Point, Size, Widget,
     };
     use iced_wgpu::{Primitive, Renderer};
 
@@ -57,34 +57,11 @@ mod circle {
             layout: Layout<'_>,
             _cursor_position: Point,
         ) -> (Primitive, MouseCursor) {
-            let bounds = layout.bounds();
-
-            dbg!(bounds);
-
             (
-                Primitive::Geometry2D {
-                    bounds,
-                    geometry: Geometry2D {
-                        vertices: vec![
-                            Vertex2D {
-                                position: [bounds.x, bounds.y],
-                                color: [1.0, 0.0, 0.0, 1.0],
-                            },
-                            Vertex2D {
-                                position: [bounds.x + bounds.width, bounds.y + bounds.height],
-                                color: [0.0, 1.0, 0.0, 1.0],
-                            },
-                            Vertex2D {
-                                position: [bounds.x, bounds.y + bounds.height],
-                                color: [0.0, 0.0, 1.0, 1.0],
-                            },
-                            Vertex2D {
-                                position: [bounds.x + bounds.width, bounds.y],
-                                color: [0.0, 1.0, 1.0, 1.0],
-                            },
-                        ],
-                        indices: vec![0, 1, 2, 0, 1, 3],
-                    },
+                Primitive::Quad {
+                    bounds: layout.bounds(),
+                    background: Background::Color(Color::BLACK),
+                    border_radius: self.radius,
                 },
                 MouseCursor::OutOfBounds,
             )

examples/geometry.rs

@@ -0,0 +1,227 @@
+//! This example showcases a simple native custom widget that renders using
+//! arbitrary low-level geometry.
+mod rainbow {
+    // For now, to implement a custom native widget you will need to add
+    // `iced_native` and `iced_wgpu` to your dependencies.
+    //
+    // Then, you simply need to define your widget type and implement the
+    // `iced_native::Widget` trait with the `iced_wgpu::Renderer`.
+    //
+    // Of course, you can choose to make the implementation renderer-agnostic,
+    // if you wish to, by creating your own `Renderer` trait, which could be
+    // implemented by `iced_wgpu` and other renderers.
+    use iced_native::{
+        layout,  Element, Geometry2D, Hasher, Layout, Length,
+        MouseCursor, Point, Size, Vertex2D, Widget,
+    };
+    use iced_wgpu::{Primitive, Renderer};
+
+    pub struct Rainbow {
+        dimen: u16,
+    }
+
+    impl Rainbow {
+        pub fn new(dimen: u16) -> Self {
+            Self { dimen }
+        }
+    }
+
+    impl<Message> Widget<Message, Renderer> for Rainbow {
+        fn width(&self) -> Length {
+            Length::Shrink
+        }
+
+        fn height(&self) -> Length {
+            Length::Shrink
+        }
+
+        fn layout(
+            &self,
+            _renderer: &Renderer,
+            _limits: &layout::Limits,
+        ) -> layout::Node {
+            layout::Node::new(Size::new(
+                f32::from(self.dimen),
+                f32::from(self.dimen),
+            ))
+        }
+
+        fn hash_layout(&self, state: &mut Hasher) {
+            use std::hash::Hash;
+
+            self.dimen.hash(state);
+        }
+
+        fn draw(
+            &self,
+            _renderer: &mut Renderer,
+            layout: Layout<'_>,
+            cursor_position: Point,
+        ) -> (Primitive, MouseCursor) {
+            let b = layout.bounds();
+
+            // R O Y G B I V
+            let color_r = [1.0, 0.0, 0.0, 1.0];
+            let color_o = [1.0, 0.5, 0.0, 1.0];
+            let color_y = [1.0, 1.0, 0.0, 1.0];
+            let color_g = [0.0, 1.0, 0.0, 1.0];
+            let color_gb = [0.0, 1.0, 0.5, 1.0];
+            let color_b = [0.0, 0.2, 1.0, 1.0];
+            let color_i = [0.5, 0.0, 1.0, 1.0];
+            let color_v = [0.75, 0.0, 0.5, 1.0];
+
+            let posn_center = {
+                if b.contains(cursor_position) {
+                    [cursor_position.x, cursor_position.y]
+                } else {
+                    [b.x + (b.width / 2.0), b.y + (b.height / 2.0)]
+                }
+            };
+
+            let posn_tl = [b.x, b.y];
+            let posn_t = [b.x + (b.width / 2.0), b.y];
+            let posn_tr = [b.x + b.width, b.y];
+            let posn_r = [b.x + b.width, b.y + (b.height / 2.0)];
+            let posn_br = [b.x + b.width, b.y + b.height];
+            let posn_b = [b.x + (b.width / 2.0), b.y + b.height];
+            let posn_bl = [b.x, b.y + b.height];
+            let posn_l = [b.x, b.y + (b.height / 2.0)];
+
+            (
+                Primitive::Geometry2D {
+                    geometry: Geometry2D {
+                        vertices: vec![
+                            Vertex2D {
+                                position: posn_center,
+                                color: [1.0, 1.0, 1.0, 1.0],
+                            },
+                            Vertex2D {
+                                position: posn_tl,
+                                color: color_r,
+                            },
+                            Vertex2D {
+                                position: posn_t,
+                                color: color_o,
+                            },
+                            Vertex2D {
+                                position: posn_tr,
+                                color: color_y,
+                            },
+                            Vertex2D {
+                                position: posn_r,
+                                color: color_g,
+                            },
+                            Vertex2D {
+                                position: posn_br,
+                                color: color_gb,
+                            },
+                            Vertex2D {
+                                position: posn_b,
+                                color: color_b,
+                            },
+                            Vertex2D {
+                                position: posn_bl,
+                                color: color_i,
+                            },
+                            Vertex2D {
+                                position: posn_l,
+                                color: color_v,
+                            },
+                        ],
+                        indices: vec![
+                            0, 1, 2, // TL
+                            0, 2, 3, // T
+                            0, 3, 4, // TR
+                            0, 4, 5, // R
+                            0, 5, 6, // BR
+                            0, 6, 7, // B
+                            0, 7, 8, // BL
+                            0, 8, 1, // L
+                        ],
+                    },
+                },
+                MouseCursor::OutOfBounds,
+            )
+        }
+    }
+
+    impl<'a, Message> Into<Element<'a, Message, Renderer>> for Rainbow {
+        fn into(self) -> Element<'a, Message, Renderer> {
+            Element::new(self)
+        }
+    }
+}
+
+use iced::{
+    scrollable, settings::Window,  Align, Column, Container, Element,
+    Length, Sandbox, Scrollable, Settings,  Text,
+};
+use rainbow::Rainbow;
+
+pub fn main() {
+    Example::run(Settings {
+        window: Window {
+            size: (660, 660),
+            resizable: true,
+            decorations: true,
+        },
+    })
+}
+
+struct Example {
+    dimen: u16,
+    scroll: scrollable::State,
+}
+
+#[derive(Debug, Clone, Copy)]
+enum Message {}
+
+impl Sandbox for Example {
+    type Message = Message;
+
+    fn new() -> Self {
+        Example {
+            dimen: 500,
+            scroll: scrollable::State::new(),
+        }
+    }
+
+    fn title(&self) -> String {
+        String::from("Custom 2D geometry - Iced")
+    }
+
+    fn update(&mut self, _: Message) {}
+
+    fn view(&mut self) -> Element<Message> {
+        let content = Column::new()
+            .padding(20)
+            .spacing(20)
+            .max_width(500)
+            .align_items(Align::Start)
+            .push(Rainbow::new(self.dimen))
+            .push(
+                Text::new(String::from("In this example we draw a custom widget Rainbow, using the \
+                Geometry2D primitive. This primitive supplies a list of triangles, expressed as vertices and indices."))
+                    .width(Length::Shrink),
+            )
+            .push(
+                Text::new(String::from("Move your cursor over it, and see the center vertex follow you!"))
+                    .width(Length::Shrink),
+            )
+            .push(
+                Text::new(String::from("Every Vertex2D defines its own color. You could use the \
+                Geometry2D primitive to render virtually any two-dimensional geometry for your widget."))
+                    .width(Length::Shrink),
+            );
+
+        let scrollable =
+            Scrollable::new(&mut self.scroll).push(Container::new(content));
+
+        Container::new(scrollable)
+            .width(Length::Fill)
+            .height(Length::Fill)
+            .center_x()
+            .center_y()
+            .into()
+    }
+}

wgpu/src/geometry.rs

@@ -131,8 +131,6 @@ impl Pipeline {
         geometries: &Vec<Geometry2D>,
         bounds: Rectangle<u32>,
     ) {
-        println!("draw 2d geom");
-
         let uniforms = Uniforms {
             transform: transformation.into(),
             scale,
@@ -151,10 +149,6 @@ impl Pipeline {
         );
 
         for geom in geometries {
-
-
-
-
             let vertices_buffer = device
                 .create_buffer_mapped(
                     geom.vertices.len(),
@@ -199,9 +193,6 @@ impl Pipeline {
                 bounds.height,
             );
 
-
-            println!("Drawing indexed geometry2d {:?}", geom.indices.len());
-
             render_pass.draw_indexed(0..geom.indices.len() as u32, 0, 0..1);
         }
     }

wgpu/src/primitive.rs

@@ -65,9 +65,7 @@ pub enum Primitive {
     },
     /// A low-level geometry primitive
     Geometry2D {
-        /// The bounds of the geometry
-        bounds: Rectangle,
-        /// The vertices of the geometry
+        /// The vertices and indices of the geometry
         geometry: Geometry2D,
     },
 }

wgpu/src/renderer.rs

@@ -127,8 +127,6 @@ impl Renderer {
             Vector::new(0, 0),
         ));
 
-        dbg!(width, height);
-
         self.draw_primitive(primitive, &mut layers);
         self.draw_overlay(overlay, &mut layers);
 
@@ -254,7 +252,7 @@ impl Renderer {
                     scale: [bounds.width, bounds.height],
                 });
             }
-            Primitive::Geometry2D { geometry, bounds } => {
+            Primitive::Geometry2D { geometry } => {
                 layer.geometries.push(geometry.clone());
             }
             Primitive::Clip {
@@ -416,11 +414,17 @@ impl Renderer {
         }
 
         if layer.geometries.len() > 0 {
+            let translated = transformation
+                * Transformation::translate(
+                    -(layer.offset.x as f32) * dpi,
+                    -(layer.offset.y as f32) * dpi,
+                );
+
             self.geometry_pipeline.draw(
                 &mut self.device,
                 encoder,
                 target,
-                transformation,
+                translated,
                 dpi,
                 &layer.geometries,
                 bounds,

wgpu/src/shader/geom2d.vert

@@ -12,7 +12,6 @@ layout (set = 0, binding = 0) uniform Globals {
 
 void main() {
     vec2 p_Position = i_Position * u_Scale;
-    gl_Position = u_Transform *  vec4(p_Position, 0.0, 1.0);
+    gl_Position = u_Transform * vec4(p_Position, 0.0, 1.0);
     o_Color = i_Color;
 }
-