me/iced
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

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

Browse source
This commit is contained in:
Héctor Ramón Jiménez 2020-06-08 18:33:36 +02:00
commit 8493ccec7f
8 changed files with 225 additions and 168 deletions
Download patch file Download diff file Expand all files Collapse all files

2
examples/integration/src/controls.rs
View file

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

17
examples/integration/src/main.rs
View file

@ -154,14 +154,19 @@ pub fn main() {
&wgpu::CommandEncoderDescriptor { label: None },
);
// We draw the scene first
let program = state.program();
scene.draw(
&mut encoder,
&frame.view,
program.background_color(),
);
{
// We clear the frame
let mut render_pass = scene.clear(
&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(

82
examples/integration/src/scene.rs
View file

@ -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 {
pipeline,
bind_group,
}
Scene { pipeline }
}
pub fn draw(
pub fn clear<'a>(
&self,
encoder: &mut wgpu::CommandEncoder,
target: &wgpu::TextureView,
target: &'a wgpu::TextureView,
encoder: &'a mut wgpu::CommandEncoder,
background_color: Color,
) {
let mut rpass =
encoder.begin_render_pass(&wgpu::RenderPassDescriptor {
color_attachments: &[
wgpu::RenderPassColorAttachmentDescriptor {
attachment: target,
resolve_target: None,
load_op: wgpu::LoadOp::Clear,
store_op: wgpu::StoreOp::Store,
clear_color: {
let [r, g, b, a] = background_color.into_linear();
) -> wgpu::RenderPass<'a> {
encoder.begin_render_pass(&wgpu::RenderPassDescriptor {
color_attachments: &[wgpu::RenderPassColorAttachmentDescriptor {
attachment: target,
resolve_target: None,
load_op: wgpu::LoadOp::Clear,
store_op: wgpu::StoreOp::Store,
clear_color: {
let [r, g, b, a] = background_color.into_linear();
wgpu::Color {
r: r as f64,
g: g as f64,
b: b as f64,
a: a as f64,
}
},
},
],
depth_stencil_attachment: None,
});
wgpu::Color {
r: r as f64,
g: g as f64,
b: b as f64,
a: a as f64,
}
},
}],
depth_stencil_attachment: None,
})
}
rpass.set_pipeline(&self.pipeline);
rpass.set_bind_group(0, &self.bind_group, &[]);
rpass.draw(0..3, 0..1);
pub fn draw<'a>(&'a self, render_pass: &mut wgpu::RenderPass<'a>) {
render_pass.set_pipeline(&self.pipeline);
render_pass.draw(0..3, 0..1);
}
}
fn build_pipeline(
device: &wgpu::Device,
) -> (wgpu::RenderPipeline, wgpu::BindGroup) {
fn build_pipeline(device: &wgpu::Device) -> wgpu::RenderPipeline {
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
}

2
examples/pane_grid/src/main.rs
View file

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

8
glow/src/widget/progress_bar.rs
View file

@ -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
//! [`State`]: struct.State.html
//! [`ProgressBar`]: type.ProgressBar.html
use crate::Renderer;
pub use iced_graphics::progress_bar::{Style, StyleSheet};

233
native/src/widget/pane_grid.rs
View file

@ -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,
/// and key events.
/// The modifier keys will need to be pressed to trigger dragging, and key
/// 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 =
self.elements.iter().zip(layout.children()).filter(
|(_, layout)| {
layout.bounds().contains(cursor_position)
},
);
let bounds = layout.bounds();
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);
if bounds.contains(cursor_position) {
match self.on_resize {
Some((leeway, _)) => {
let relative_cursor = Point::new(
cursor_position.x - bounds.x,
cursor_position.y - bounds.y,
);
messages.push(on_drag(DragEvent::Picked {
pane: *pane,
}));
let splits = self.state.splits(
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,
);
}
}
_ => {
self.state.focus(pane);
None => {
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()
}

24
native/src/widget/pane_grid/axis.rs
View file

@ -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)]

25
native/src/widget/slider.rs
View file

@ -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>,