Draft `Scrollable` widget (no clipping yet!)

2 files changed, 139 insertions, 28 deletions

diff --git a/wgpu/src/renderer.rs b/wgpu/src/renderer.rs
index ab6f744f..bb0e7b27 100644
--- a/wgpu/src/renderer.rs
+++ b/wgpu/src/renderer.rs
@@ -20,6 +20,7 @@ mod column;
 mod image;
 mod radio;
 mod row;
+mod scrollable;
 mod slider;
 mod text;
 
@@ -31,8 +32,6 @@ pub struct Renderer {
     quad_pipeline: quad::Pipeline,
     image_pipeline: crate::image::Pipeline,
 
-    quads: Vec<Quad>,
-    images: Vec<Image>,
     glyph_brush: Rc<RefCell<GlyphBrush<'static, ()>>>,
 }
 
@@ -43,6 +42,24 @@ pub struct Target {
     swap_chain: SwapChain,
 }
 
+pub struct Layer {
+    quads: Vec<Quad>,
+    images: Vec<Image>,
+    layers: Vec<Layer>,
+    y_offset: u32,
+}
+
+impl Layer {
+    pub fn new(y_offset: u32) -> Self {
+        Self {
+            quads: Vec::new(),
+            images: Vec::new(),
+            layers: Vec::new(),
+            y_offset,
+        }
+    }
+}
+
 impl Renderer {
     fn new<W: HasRawWindowHandle>(window: &W) -> Self {
         let adapter = Adapter::request(&RequestAdapterOptions {
@@ -79,8 +96,6 @@ impl Renderer {
             quad_pipeline,
             image_pipeline,
 
-            quads: Vec::new(),
-            images: Vec::new(),
             glyph_brush: Rc::new(RefCell::new(glyph_brush)),
         }
     }
@@ -132,27 +147,10 @@ impl Renderer {
             depth_stencil_attachment: None,
         });
 
-        self.draw_primitive(primitive);
+        let mut layer = Layer::new(0);
 
-        self.quad_pipeline.draw(
-            &mut self.device,
-            &mut encoder,
-            &self.quads,
-            target.transformation,
-            &frame.view,
-        );
-
-        self.quads.clear();
-
-        self.image_pipeline.draw(
-            &mut self.device,
-            &mut encoder,
-            &self.images,
-            target.transformation,
-            &frame.view,
-        );
-
-        self.images.clear();
+        self.draw_primitive(primitive, &mut layer);
+        self.flush(target.transformation, &layer, &mut encoder, &frame.view);
 
         self.glyph_brush
             .borrow_mut()
@@ -170,13 +168,13 @@ impl Renderer {
         *mouse_cursor
     }
 
-    fn draw_primitive(&mut self, primitive: &Primitive) {
+    fn draw_primitive(&mut self, primitive: &Primitive, layer: &mut Layer) {
         match primitive {
             Primitive::None => {}
             Primitive::Group { primitives } => {
                 // TODO: Inspect a bit and regroup (?)
                 for primitive in primitives {
-                    self.draw_primitive(primitive)
+                    self.draw_primitive(primitive, layer)
                 }
             }
             Primitive::Text {
@@ -244,7 +242,7 @@ impl Renderer {
                 background,
                 border_radius,
             } => {
-                self.quads.push(Quad {
+                layer.quads.push(Quad {
                     position: [bounds.x, bounds.y],
                     scale: [bounds.width, bounds.height],
                     color: match background {
@@ -254,12 +252,55 @@ impl Renderer {
                 });
             }
             Primitive::Image { path, bounds } => {
-                self.images.push(Image {
+                layer.images.push(Image {
                     path: path.clone(),
                     position: [bounds.x, bounds.y],
                     scale: [bounds.width, bounds.height],
                 });
             }
+            Primitive::Scrollable {
+                bounds,
+                offset,
+                content,
+            } => {
+                let mut new_layer = Layer::new(layer.y_offset + offset);
+
+                // TODO: Primitive culling
+                self.draw_primitive(content, &mut new_layer);
+
+                layer.layers.push(new_layer);
+            }
+        }
+    }
+
+    fn flush(
+        &mut self,
+        transformation: Transformation,
+        layer: &Layer,
+        encoder: &mut wgpu::CommandEncoder,
+        target: &wgpu::TextureView,
+    ) {
+        let translated = transformation
+            * Transformation::translate(0.0, -(layer.y_offset as f32));
+
+        self.quad_pipeline.draw(
+            &mut self.device,
+            encoder,
+            &layer.quads,
+            transformation,
+            target,
+        );
+
+        self.image_pipeline.draw(
+            &mut self.device,
+            encoder,
+            &layer.images,
+            translated,
+            target,
+        );
+
+        for layer in layer.layers.iter() {
+            self.flush(transformation, layer, encoder, target);
         }
     }
 }
diff --git a/wgpu/src/renderer/scrollable.rs b/wgpu/src/renderer/scrollable.rs
new file mode 100644
index 00000000..14ff9ff4
--- /dev/null
+++ b/wgpu/src/renderer/scrollable.rs
@@ -0,0 +1,70 @@
+use crate::{Primitive, Renderer};
+use iced_native::{
+    scrollable, Background, Color, Layout, Point, Rectangle, Scrollable, Widget,
+};
+
+impl scrollable::Renderer for Renderer {
+    fn draw<Message>(
+        &mut self,
+        scrollable: &Scrollable<'_, Message, Self>,
+        layout: Layout<'_>,
+        cursor_position: Point,
+    ) -> Self::Output {
+        let bounds = layout.bounds();
+        let is_mouse_over = bounds.contains(cursor_position);
+
+        let content = layout.children().next().unwrap();
+        let content_bounds = content.bounds();
+
+        let cursor_position = if bounds.contains(cursor_position) {
+            Point::new(
+                cursor_position.x,
+                cursor_position.y + scrollable.state.offset as f32,
+            )
+        } else {
+            Point::new(cursor_position.x, -1.0)
+        };
+
+        let (content, mouse_cursor) =
+            scrollable.content.draw(self, content, cursor_position);
+
+        let primitive = Primitive::Scrollable {
+            bounds,
+            offset: scrollable.state.offset,
+            content: Box::new(content),
+        };
+
+        (
+            Primitive::Group {
+                primitives: if is_mouse_over
+                    && content_bounds.height > bounds.height
+                {
+                    let ratio = bounds.height / content_bounds.height;
+                    let scrollbar_height = bounds.height * ratio;
+                    let y_offset = scrollable.state.offset as f32 * ratio;
+
+                    let scrollbar = Primitive::Quad {
+                        bounds: Rectangle {
+                            x: bounds.x + bounds.width - 12.0,
+                            y: bounds.y + y_offset,
+                            width: 10.0,
+                            height: scrollbar_height,
+                        },
+                        background: Background::Color(Color {
+                            r: 0.0,
+                            g: 0.0,
+                            b: 0.0,
+                            a: 0.5,
+                        }),
+                        border_radius: 5,
+                    };
+
+                    vec![primitive, scrollbar]
+                } else {
+                    vec![primitive]
+                },
+            },
+            mouse_cursor,
+        )
+    }
+}