Merge branch 'intuitive-pane-grid-resize' into feature/pane-grid-titlebar

examples/integration/src/controls.rs

@@ -9,7 +9,7 @@ pub struct Controls {
     sliders: [slider::State; 3],
 }
 
-#[derive(Debug)]
+#[derive(Debug, Clone)]
 pub enum Message {
     BackgroundColorChanged(Color),
 }

examples/integration/src/main.rs

@@ -154,14 +154,19 @@ pub fn main() {
                     &wgpu::CommandEncoderDescriptor { label: None },
                 );
 
-                // We draw the scene first
                 let program = state.program();
 
-                scene.draw(
+                {
-                    &mut encoder,
+                    // We clear the frame
-                    &frame.view,
+                    let mut render_pass = scene.clear(
-                    program.background_color(),
+                        &frame.view,
-                );
+                        &mut encoder,
+                        program.background_color(),
+                    );
+
+                    // Draw the scene
+                    scene.draw(&mut render_pass);
+                }
 
                 // And then iced on top
                 let mouse_interaction = renderer.backend_mut().draw(

examples/integration/src/scene.rs

@@ -3,57 +3,49 @@ use iced_winit::Color;
 
 pub struct Scene {
     pipeline: wgpu::RenderPipeline,
-    bind_group: wgpu::BindGroup,
 }
 
 impl Scene {
     pub fn new(device: &wgpu::Device) -> Scene {
-        let (pipeline, bind_group) = build_pipeline(device);
+        let pipeline = build_pipeline(device);
 
-        Scene {
+        Scene { pipeline }
-            pipeline,
-            bind_group,
-        }
     }
 
-    pub fn draw(
+    pub fn clear<'a>(
         &self,
-        encoder: &mut wgpu::CommandEncoder,
+        target: &'a wgpu::TextureView,
-        target: &wgpu::TextureView,
+        encoder: &'a mut wgpu::CommandEncoder,
         background_color: Color,
-    ) {
+    ) -> wgpu::RenderPass<'a> {
-        let mut rpass =
+        encoder.begin_render_pass(&wgpu::RenderPassDescriptor {
-            encoder.begin_render_pass(&wgpu::RenderPassDescriptor {
+            color_attachments: &[wgpu::RenderPassColorAttachmentDescriptor {
-                color_attachments: &[
+                attachment: target,
-                    wgpu::RenderPassColorAttachmentDescriptor {
+                resolve_target: None,
-                        attachment: target,
+                load_op: wgpu::LoadOp::Clear,
-                        resolve_target: None,
+                store_op: wgpu::StoreOp::Store,
-                        load_op: wgpu::LoadOp::Clear,
+                clear_color: {
-                        store_op: wgpu::StoreOp::Store,
+                    let [r, g, b, a] = background_color.into_linear();
-                        clear_color: {
-                            let [r, g, b, a] = background_color.into_linear();
 
-                            wgpu::Color {
+                    wgpu::Color {
-                                r: r as f64,
+                        r: r as f64,
-                                g: g as f64,
+                        g: g as f64,
-                                b: b as f64,
+                        b: b as f64,
-                                a: a as f64,
+                        a: a as f64,
-                            }
+                    }
-                        },
+                },
-                    },
+            }],
-                ],
+            depth_stencil_attachment: None,
-                depth_stencil_attachment: None,
+        })
-            });
+    }
 
-        rpass.set_pipeline(&self.pipeline);
+    pub fn draw<'a>(&'a self, render_pass: &mut wgpu::RenderPass<'a>) {
-        rpass.set_bind_group(0, &self.bind_group, &[]);
+        render_pass.set_pipeline(&self.pipeline);
-        rpass.draw(0..3, 0..1);
+        render_pass.draw(0..3, 0..1);
     }
 }
 
-fn build_pipeline(
+fn build_pipeline(device: &wgpu::Device) -> wgpu::RenderPipeline {
-    device: &wgpu::Device,
-) -> (wgpu::RenderPipeline, wgpu::BindGroup) {
     let vs = include_bytes!("shader/vert.spv");
     let fs = include_bytes!("shader/frag.spv");
 
@@ -65,21 +57,9 @@ fn build_pipeline(
         &wgpu::read_spirv(std::io::Cursor::new(&fs[..])).unwrap(),
     );
 
-    let bind_group_layout =
-        device.create_bind_group_layout(&wgpu::BindGroupLayoutDescriptor {
-            label: None,
-            bindings: &[],
-        });
-
-    let bind_group = device.create_bind_group(&wgpu::BindGroupDescriptor {
-        label: None,
-        layout: &bind_group_layout,
-        bindings: &[],
-    });
-
     let pipeline_layout =
         device.create_pipeline_layout(&wgpu::PipelineLayoutDescriptor {
-            bind_group_layouts: &[&bind_group_layout],
+            bind_group_layouts: &[],
         });
 
     let pipeline =
@@ -117,5 +97,5 @@ fn build_pipeline(
             alpha_to_coverage_enabled: false,
         });
 
-    (pipeline, bind_group)
+    pipeline
 }

examples/pane_grid/src/main.rs

@@ -103,7 +103,7 @@ impl Sandbox for Example {
             .height(Length::Fill)
             .spacing(10)
             .on_drag(Message::Dragged)
-            .on_resize(Message::Resized)
+            .on_resize(10, Message::Resized)
             .on_key_press(handle_hotkey);
 
         Container::new(pane_grid)

glow/src/widget/progress_bar.rs

@@ -1,9 +1,9 @@
-//! Allow your users to perform actions by pressing a button.
+//! Allow your users to visually track the progress of a computation.
 //!
-//! A [`Button`] has some local [`State`].
+//! A [`ProgressBar`] has a range of possible values and a current value,
+//! as well as a length, height and style.
 //!
-//! [`Button`]: type.Button.html
+//! [`ProgressBar`]: type.ProgressBar.html
-//! [`State`]: struct.State.html
 use crate::Renderer;
 
 pub use iced_graphics::progress_bar::{Style, StyleSheet};

native/src/widget/pane_grid.rs

@@ -95,7 +95,7 @@ pub struct PaneGrid<'a, Message, Renderer: container::Renderer> {
     spacing: u16,
     modifier_keys: keyboard::ModifiersState,
     on_drag: Option<Box<dyn Fn(DragEvent) -> Message + 'a>>,
-    on_resize: Option<Box<dyn Fn(ResizeEvent) -> Message + 'a>>,
+    on_resize: Option<(u16, Box<dyn Fn(ResizeEvent) -> Message + 'a>)>,
     on_key_press: Option<Box<dyn Fn(KeyPressEvent) -> Option<Message> + 'a>>,
 }
 
@@ -184,8 +184,8 @@ where
 
     /// Sets the modifier keys of the [`PaneGrid`].
     ///
-    /// The modifier keys will need to be pressed to trigger dragging, resizing,
+    /// The modifier keys will need to be pressed to trigger dragging, and key
-    /// and key events.
+    /// events.
     ///
     /// The default modifier key is `Ctrl`.
     ///
@@ -201,8 +201,6 @@ where
     /// Enables the drag and drop interactions of the [`PaneGrid`], which will
     /// use the provided function to produce messages.
     ///
-    /// Panes can be dragged using `Modifier keys + Left click`.
-    ///
     /// [`PaneGrid`]: struct.PaneGrid.html
     pub fn on_drag<F>(mut self, f: F) -> Self
     where
@@ -215,14 +213,15 @@ where
     /// Enables the resize interactions of the [`PaneGrid`], which will
     /// use the provided function to produce messages.
     ///
-    /// Panes can be resized using `Modifier keys + Right click`.
+    /// The `leeway` describes the amount of space around a split that can be
+    /// used to grab it.
     ///
     /// [`PaneGrid`]: struct.PaneGrid.html
-    pub fn on_resize<F>(mut self, f: F) -> Self
+    pub fn on_resize<F>(mut self, leeway: u16, f: F) -> Self
     where
         F: 'a + Fn(ResizeEvent) -> Message,
     {
-        self.on_resize = Some(Box::new(f));
+        self.on_resize = Some((leeway, Box::new(f)));
         self
     }
 
@@ -250,6 +249,45 @@ where
         self.on_key_press = Some(Box::new(f));
         self
     }
+}
+
+impl<'a, Message, Renderer> PaneGrid<'a, Message, Renderer>
+where
+    Renderer: self::Renderer,
+{
+    fn click_pane(
+        &mut self,
+        layout: Layout<'_>,
+        cursor_position: Point,
+        messages: &mut Vec<Message>,
+    ) {
+        let mut clicked_region =
+            self.elements.iter().zip(layout.children()).filter(
+                |(_, layout)| layout.bounds().contains(cursor_position),
+            );
+
+        if let Some(((pane, content), layout)) = clicked_region.next() {
+            match &self.on_drag {
+                Some(on_drag) => {
+                    if let Some(origin) =
+                        content.drag_origin(layout, cursor_position)
+                    {
+                        self.state.pick_pane(pane, origin);
+
+                        messages
+                            .push(on_drag(DragEvent::Picked { pane: *pane }));
+                    } else {
+                        self.state.focus(pane);
+                    }
+                }
+                None => {
+                    self.state.focus(pane);
+                }
+            }
+        } else {
+            self.state.unfocus();
+        }
+    }
 
     fn trigger_resize(
         &mut self,
@@ -257,7 +295,7 @@ where
         cursor_position: Point,
         messages: &mut Vec<Message>,
     ) {
-        if let Some(on_resize) = &self.on_resize {
+        if let Some((_, on_resize)) = &self.on_resize {
             if let Some((split, _)) = self.state.picked_split() {
                 let bounds = layout.bounds();
 
@@ -416,36 +454,45 @@ where
         match event {
             Event::Mouse(mouse_event) => match mouse_event {
                 mouse::Event::ButtonPressed(mouse::Button::Left) => {
-                    let mut clicked_region =
+                    let bounds = layout.bounds();
-                        self.elements.iter().zip(layout.children()).filter(
-                            |(_, layout)| {
-                                layout.bounds().contains(cursor_position)
-                            },
-                        );
 
-                    if let Some(((pane, content), layout)) =
+                    if bounds.contains(cursor_position) {
-                        clicked_region.next()
+                        match self.on_resize {
-                    {
+                            Some((leeway, _)) => {
-                        match &self.on_drag {
+                                let relative_cursor = Point::new(
-                            Some(on_drag) => {
+                                    cursor_position.x - bounds.x,
-                                if let Some(origin) =
+                                    cursor_position.y - bounds.y,
-                                    content.drag_origin(layout, cursor_position)
+                                );
-                                {
-                                    self.state.pick_pane(pane, origin);
 
-                                    messages.push(on_drag(DragEvent::Picked {
+                                let splits = self.state.splits(
-                                        pane: *pane,
+                                    f32::from(self.spacing),
-                                    }));
+                                    Size::new(bounds.width, bounds.height),
+                                );
+
+                                let clicked_split = hovered_split(
+                                    splits.iter(),
+                                    f32::from(self.spacing + leeway),
+                                    relative_cursor,
+                                );
+
+                                if let Some((split, axis)) = clicked_split {
+                                    self.state.pick_split(&split, axis);
                                 } else {
-                                    self.state.focus(pane);
+                                    self.click_pane(
+                                        layout,
+                                        cursor_position,
+                                        messages,
+                                    );
                                 }
                             }
-                            _ => {
+                            None => {
-                                self.state.focus(pane);
+                                self.click_pane(
+                                    layout,
+                                    cursor_position,
+                                    messages,
+                                );
                             }
                         }
-                    } else {
-                        self.state.unfocus();
                     }
                 }
                 mouse::Event::ButtonReleased(mouse::Button::Left) => {
@@ -473,78 +520,10 @@ where
 
                             messages.push(on_drag(event));
                         }
+                    } else if self.state.picked_split().is_some() {
+                        self.state.drop_split();
                     }
                 }
-                mouse::Event::ButtonPressed(mouse::Button::Right)
-                    if self.on_resize.is_some()
-                        && self.state.picked_pane().is_none()
-                        && self
-                            .pressed_modifiers
-                            .matches(self.modifier_keys) =>
-                {
-                    let bounds = layout.bounds();
-
-                    if bounds.contains(cursor_position) {
-                        let relative_cursor = Point::new(
-                            cursor_position.x - bounds.x,
-                            cursor_position.y - bounds.y,
-                        );
-
-                        let splits = self.state.splits(
-                            f32::from(self.spacing),
-                            Size::new(bounds.width, bounds.height),
-                        );
-
-                        let mut sorted_splits: Vec<_> = splits
-                            .iter()
-                            .filter(|(_, (axis, rectangle, _))| match axis {
-                                Axis::Horizontal => {
-                                    relative_cursor.x > rectangle.x
-                                        && relative_cursor.x
-                                            < rectangle.x + rectangle.width
-                                }
-                                Axis::Vertical => {
-                                    relative_cursor.y > rectangle.y
-                                        && relative_cursor.y
-                                            < rectangle.y + rectangle.height
-                                }
-                            })
-                            .collect();
-
-                        sorted_splits.sort_by_key(
-                            |(_, (axis, rectangle, ratio))| {
-                                let distance = match axis {
-                                    Axis::Horizontal => (relative_cursor.y
-                                        - (rectangle.y
-                                            + rectangle.height * ratio))
-                                        .abs(),
-                                    Axis::Vertical => (relative_cursor.x
-                                        - (rectangle.x
-                                            + rectangle.width * ratio))
-                                        .abs(),
-                                };
-
-                                distance.round() as u32
-                            },
-                        );
-
-                        if let Some((split, (axis, _, _))) =
-                            sorted_splits.first()
-                        {
-                            self.state.pick_split(split, *axis);
-                            self.trigger_resize(
-                                layout,
-                                cursor_position,
-                                messages,
-                            );
-                        }
-                    }
-                }
-                mouse::Event::ButtonReleased(mouse::Button::Right)
-                    if self.state.picked_split().is_some() =>
-                {
-                    self.state.drop_split();
-                }
                 mouse::Event::CursorMoved { .. } => {
                     self.trigger_resize(layout, cursor_position, messages);
                 }
@@ -608,12 +587,38 @@ where
         layout: Layout<'_>,
         cursor_position: Point,
     ) -> Renderer::Output {
+        let picked_split = self
+            .state
+            .picked_split()
+            .or_else(|| match self.on_resize {
+                Some((leeway, _)) => {
+                    let bounds = layout.bounds();
+
+                    let relative_cursor = Point::new(
+                        cursor_position.x - bounds.x,
+                        cursor_position.y - bounds.y,
+                    );
+
+                    let splits = self
+                        .state
+                        .splits(f32::from(self.spacing), bounds.size());
+
+                    hovered_split(
+                        splits.iter(),
+                        f32::from(self.spacing + leeway),
+                        relative_cursor,
+                    )
+                }
+                None => None,
+            })
+            .map(|(_, axis)| axis);
+
         self::Renderer::draw(
             renderer,
             defaults,
             &self.elements,
             self.state.picked_pane(),
-            self.state.picked_split().map(|(_, axis)| axis),
+            picked_split,
             layout,
             cursor_position,
         )
@@ -707,3 +712,25 @@ where
         Element::new(pane_grid)
     }
 }
+
+/*
+ * Helpers
+ */
+fn hovered_split<'a>(
+    splits: impl Iterator<Item = (&'a Split, &'a (Axis, Rectangle, f32))>,
+    spacing: f32,
+    cursor_position: Point,
+) -> Option<(Split, Axis)> {
+    splits
+        .filter_map(|(split, (axis, region, ratio))| {
+            let bounds =
+                axis.split_line_bounds(*region, *ratio, f32::from(spacing));
+
+            if bounds.contains(cursor_position) {
+                Some((*split, *axis))
+            } else {
+                None
+            }
+        })
+        .next()
+}

native/src/widget/pane_grid/axis.rs

@@ -53,6 +53,30 @@ impl Axis {
             }
         }
     }
+
+    pub(super) fn split_line_bounds(
+        &self,
+        rectangle: Rectangle,
+        ratio: f32,
+        spacing: f32,
+    ) -> Rectangle {
+        match self {
+            Axis::Horizontal => Rectangle {
+                x: rectangle.x,
+                y: (rectangle.y + rectangle.height * ratio - spacing / 2.0)
+                    .round(),
+                width: rectangle.width,
+                height: spacing,
+            },
+            Axis::Vertical => Rectangle {
+                x: (rectangle.x + rectangle.width * ratio - spacing / 2.0)
+                    .round(),
+                y: rectangle.y,
+                width: spacing,
+                height: rectangle.height,
+            },
+        }
+    }
 }
 
 #[cfg(test)]

native/src/widget/slider.rs

@@ -40,6 +40,7 @@ pub struct Slider<'a, Message, Renderer: self::Renderer> {
     range: RangeInclusive<f32>,
     value: f32,
     on_change: Box<dyn Fn(f32) -> Message>,
+    on_release: Option<Message>,
     width: Length,
     style: Renderer::Style,
 }
@@ -71,11 +72,25 @@ impl<'a, Message, Renderer: self::Renderer> Slider<'a, Message, Renderer> {
             value: value.max(*range.start()).min(*range.end()),
             range,
             on_change: Box::new(on_change),
+            on_release: None,
             width: Length::Fill,
             style: Renderer::Style::default(),
         }
     }
 
+    /// Sets the release message of the [`Slider`].
+    /// This is called when the mouse is released from the slider.
+    ///
+    /// Typically, the user's interaction with the slider is finished when this message is produced.
+    /// This is useful if you need to spawn a long-running task from the slider's result, where
+    /// the default on_change message could create too many events.
+    ///
+    /// [`Slider`]: struct.Slider.html
+    pub fn on_release(mut self, on_release: Message) -> Self {
+        self.on_release = Some(on_release);
+        self
+    }
+
     /// Sets the width of the [`Slider`].
     ///
     /// [`Slider`]: struct.Slider.html
@@ -114,6 +129,7 @@ impl<'a, Message, Renderer> Widget<Message, Renderer>
     for Slider<'a, Message, Renderer>
 where
     Renderer: self::Renderer,
+    Message: Clone,
 {
     fn width(&self) -> Length {
         self.width
@@ -171,7 +187,12 @@ where
                     }
                 }
                 mouse::Event::ButtonReleased(mouse::Button::Left) => {
-                    self.state.is_dragging = false;
+                    if self.state.is_dragging {
+                        if let Some(on_release) = self.on_release.clone() {
+                            messages.push(on_release);
+                        }
+                        self.state.is_dragging = false;
+                    }
                 }
                 mouse::Event::CursorMoved { .. } => {
                     if self.state.is_dragging {
@@ -252,7 +273,7 @@ impl<'a, Message, Renderer> From<Slider<'a, Message, Renderer>>
     for Element<'a, Message, Renderer>
 where
     Renderer: 'a + self::Renderer,
-    Message: 'a,
+    Message: 'a + Clone,
 {
     fn from(
         slider: Slider<'a, Message, Renderer>,