[WIP] Pan & Zoom #16
|
|
@ -370,7 +370,6 @@ checksum = "212d0f5754cb6769937f4501cc0e67f4f4483c8d2c3e1e922ee9edbe4ab4c7c0"
|
|||
[[package]]
|
||||
name = "druid"
|
||||
version = "0.7.0"
|
||||
source = "git+https://github.com/doppioandante/druid?branch=v0.7.0_stiletto#2cbb14456fb1813e673d2151626630d2c4db68bf"
|
||||
dependencies = [
|
||||
"console_log",
|
||||
"druid-derive",
|
||||
|
|
@ -393,7 +392,6 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "druid-derive"
|
||||
version = "0.4.0"
|
||||
source = "git+https://github.com/doppioandante/druid?branch=v0.7.0_stiletto#2cbb14456fb1813e673d2151626630d2c4db68bf"
|
||||
dependencies = [
|
||||
"proc-macro2",
|
||||
"quote",
|
||||
|
|
@ -403,7 +401,6 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "druid-shell"
|
||||
version = "0.7.0"
|
||||
source = "git+https://github.com/doppioandante/druid?branch=v0.7.0_stiletto#2cbb14456fb1813e673d2151626630d2c4db68bf"
|
||||
dependencies = [
|
||||
"anyhow",
|
||||
"bitflags",
|
||||
|
|
|
|||
|
|
@ -27,6 +27,6 @@ version = "0.13.2"
|
|||
features = ["v3_22"]
|
||||
|
||||
[patch.crates-io]
|
||||
druid = { git = "https://github.com/doppioandante/druid", branch = "v0.7.0_stiletto", features = ["im", "svg"] }
|
||||
#druid = { path = "../druid/druid/", features = ["im", "svg"] }
|
||||
#druid = { git = "https://github.com/doppioandante/druid", branch = "v0.7.0_stiletto", features = ["im", "svg"] }
|
||||
druid = { path = "../druid/druid/", features = ["im", "svg"] }
|
||||
|
||||
|
|
|
|||
29
src/main.rs
29
src/main.rs
|
|
@ -24,9 +24,10 @@ use druid::widget::prelude::*;
|
|||
use druid::widget::{
|
||||
Align, Button, Controller, CrossAxisAlignment, Flex, List, SizedBox, WidgetExt,
|
||||
};
|
||||
use druid::gesture::GestureController;
|
||||
use druid::{
|
||||
AppDelegate, AppLauncher, Color, Command, Data, DelegateCtx, Env, FileDialogOptions, FileSpec,
|
||||
Handled, Lens, Target, WindowDesc,
|
||||
Handled, Lens, PointerEventController, PointerEventPolicy, Target, WidgetId, WindowDesc,
|
||||
};
|
||||
|
||||
use im::Vector;
|
||||
|
|
@ -107,6 +108,8 @@ impl StilettoState {
|
|||
}
|
||||
|
||||
fn build_ui() -> impl Widget<StilettoState> {
|
||||
let canvas_id = WidgetId::next();
|
||||
|
||||
let history_buttons = Flex::row()
|
||||
.cross_axis_alignment(CrossAxisAlignment::Center)
|
||||
.with_child(Button::new("Undo").on_click(
|
||||
|
|
@ -125,8 +128,17 @@ fn build_ui() -> impl Widget<StilettoState> {
|
|||
|
||||
let save_buttons = Flex::row()
|
||||
.cross_axis_alignment(CrossAxisAlignment::Center)
|
||||
.with_child(
|
||||
Button::new("Save").on_click(move |ctx, data: &mut StilettoState, _| {
|
||||
.with_child(Button::new("Up").on_click(
|
||||
move |ctx: &mut EventCtx, _data: &mut StilettoState, _env: &Env| {
|
||||
ctx.submit_command(Command::new(CanvasWidget::SCROLL, -30.0, canvas_id));
|
||||
},
|
||||
))
|
||||
.with_child(Button::new("Down").on_click(
|
||||
move |ctx: &mut EventCtx, _data: &mut StilettoState, _env: &Env| {
|
||||
ctx.submit_command(Command::new(CanvasWidget::SCROLL, 30.0, canvas_id));
|
||||
},
|
||||
))
|
||||
.with_child(Button::new("Save").on_click(move |ctx, data: &mut StilettoState, _| {
|
||||
if data.current_file_path.is_some() {
|
||||
ctx.submit_command(Command::new(commands::SAVE_FILE, (), Target::Auto));
|
||||
} else {
|
||||
|
|
@ -136,8 +148,7 @@ fn build_ui() -> impl Widget<StilettoState> {
|
|||
Target::Auto,
|
||||
))
|
||||
}
|
||||
}),
|
||||
)
|
||||
}))
|
||||
.with_child(Button::new("Save As").on_click(move |ctx, _, _| {
|
||||
ctx.submit_command(Command::new(
|
||||
druid::commands::SHOW_SAVE_PANEL,
|
||||
|
|
@ -183,8 +194,14 @@ fn build_ui() -> impl Widget<StilettoState> {
|
|||
.cross_axis_alignment(CrossAxisAlignment::Center)
|
||||
.must_fill_main_axis(true)
|
||||
.with_child(SizedBox::new(Align::left(toolbar)).height(50.0))
|
||||
.with_flex_child((CanvasWidget).lens(StilettoState::canvas), 1.0)
|
||||
.with_flex_child(
|
||||
CanvasWidget::new()
|
||||
.lens(StilettoState::canvas)
|
||||
.with_id(canvas_id),
|
||||
1.0,
|
||||
)
|
||||
.controller(ToolSwitcher::new())
|
||||
.controller(GestureController::new())
|
||||
}
|
||||
|
||||
struct ToolSwitcher {
|
||||
|
|
|
|||
|
|
@ -27,4 +27,3 @@ pub enum CanvasToolType {
|
|||
Pen,
|
||||
Eraser,
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -21,8 +21,12 @@ use crate::canvas::Canvas;
|
|||
use crate::history::VersionedCanvas;
|
||||
use crate::DocumentSnapshot;
|
||||
|
||||
use druid::scroll_component::ScrollComponent;
|
||||
use druid::widget::prelude::*;
|
||||
use druid::{Color, Data, Env, Event, PointerType};
|
||||
use druid::widget::Viewport;
|
||||
use druid::kurbo::Point;
|
||||
use druid::{Affine, Color, Data, Env, Event, PointerType, Selector};
|
||||
|
||||
|
||||
#[derive(Clone, Data)]
|
||||
pub struct CanvasState {
|
||||
|
|
@ -83,31 +87,110 @@ impl CanvasState {
|
|||
&mut self.tool_ctx
|
||||
}
|
||||
|
||||
pub fn handle_event(&mut self, mut ctx: &mut EventCtx, event: &Event, env: &Env) {
|
||||
pub fn handle_event(&mut self, ctx: &mut EventCtx, event: &Event, transform: Affine, env: &Env) {
|
||||
self.tool_ctx
|
||||
.handle_event(ctx, event, &mut self.versioned_canvas, env);
|
||||
.handle_event(ctx, event, &mut self.versioned_canvas, transform, env);
|
||||
}
|
||||
}
|
||||
|
||||
pub struct CanvasWidget;
|
||||
pub struct CanvasWidget {
|
||||
viewport: Viewport,
|
||||
scroll_component: ScrollComponent,
|
||||
widget_size: Size,
|
||||
}
|
||||
|
||||
impl CanvasWidget {
|
||||
pub fn new() -> Self {
|
||||
CanvasWidget {
|
||||
viewport: Viewport {
|
||||
content_size: Size::new(0.0, 0.0),
|
||||
rect: druid::Rect::new(0.0, 0.0, 0.0, 0.0),
|
||||
},
|
||||
widget_size: Size::new(0.0, 0.0),
|
||||
scroll_component: ScrollComponent::new(),
|
||||
}
|
||||
}
|
||||
|
||||
fn widget_to_viewport(&self) -> Affine {
|
||||
let viewport_rect_size = self.viewport.rect.size();
|
||||
if !viewport_rect_size.is_empty() && !self.widget_size.is_empty() {
|
||||
let scale_x = viewport_rect_size.width / self.widget_size.width;
|
||||
let scale_y = viewport_rect_size.height / self.widget_size.height;
|
||||
Affine::translate(self.viewport.rect.origin().to_vec2())
|
||||
* Affine::scale_non_uniform(scale_x, scale_y)
|
||||
} else {
|
||||
Affine::scale(1.0) // identity
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
pub const SCROLL: Selector<f64> = Selector::new("scroll_canvas");
|
||||
}
|
||||
|
||||
impl Widget<CanvasState> for CanvasWidget {
|
||||
fn event(&mut self, ctx: &mut EventCtx, event: &Event, data: &mut CanvasState, env: &Env) {
|
||||
ctx.request_focus();
|
||||
|
||||
self.scroll_component
|
||||
.event(&mut self.viewport, ctx, event, env);
|
||||
if !ctx.is_handled() {
|
||||
let mut viewport_transform: Option<Affine> = None;
|
||||
let mut toggle_eraser_event = false;
|
||||
let mut enable_temporary_erasing = false;
|
||||
match event {
|
||||
Event::Command(cmd) => {
|
||||
if let Some(value) = cmd.get(CanvasWidget::SCROLL) {
|
||||
viewport_transform = Some(Affine::translate((0.0, *value)));
|
||||
}
|
||||
}
|
||||
Event::KeyDown(key_event) => {
|
||||
if key_event.code == druid::Code::ArrowDown {
|
||||
viewport_transform = Some(Affine::translate((0.0, 30.0)));
|
||||
} else if key_event.code == druid::Code::ArrowUp {
|
||||
viewport_transform = Some(Affine::translate((0.0, -30.0)));
|
||||
} else if key_event.code == druid::Code::ArrowRight {
|
||||
viewport_transform = Some(Affine::translate((30.0, 0.0)));
|
||||
} else if key_event.code == druid::Code::ArrowLeft {
|
||||
viewport_transform = Some(Affine::translate((-30.0, 0.0)));
|
||||
}
|
||||
}
|
||||
Event::MouseDown(mouse_event) => {
|
||||
toggle_eraser_event = true;
|
||||
enable_temporary_erasing = mouse_event.pointer_type == PointerType::Eraser;
|
||||
enable_temporary_erasing = false; //mouse_event.pointer_type == PointerType::Eraser;
|
||||
}
|
||||
Event::MouseMove(mouse_event) => {
|
||||
toggle_eraser_event = true;
|
||||
enable_temporary_erasing = mouse_event.pointer_type == PointerType::Eraser;
|
||||
enable_temporary_erasing = false; //mouse_event.pointer_type == PointerType::Eraser;
|
||||
}
|
||||
Event::MouseUp(mouse_event) => {
|
||||
toggle_eraser_event = true;
|
||||
enable_temporary_erasing = mouse_event.pointer_type == PointerType::Eraser;
|
||||
enable_temporary_erasing = false; //mouse_event.pointer_type == PointerType::Eraser;
|
||||
}
|
||||
Event::Wheel(mouse) => {
|
||||
let transform = self.widget_to_viewport();
|
||||
viewport_transform = Some(
|
||||
Affine::translate(
|
||||
(mouse.wheel_delta.to_point()).to_vec2()
|
||||
)
|
||||
);
|
||||
}
|
||||
Event::GestureZoom { zoom, center } => {
|
||||
let transform = self.widget_to_viewport();
|
||||
|
||||
let diff = (transform * *center).to_vec2()
|
||||
- self.viewport.rect.center().to_vec2();
|
||||
viewport_transform = Some(
|
||||
Affine::scale(1.0/(1.0 + zoom))
|
||||
);
|
||||
log::debug!("{:#?}", viewport_transform);
|
||||
}
|
||||
Event::GesturePan(vec2) => {
|
||||
let transform = self.widget_to_viewport();
|
||||
viewport_transform = Some(
|
||||
Affine::translate(
|
||||
(vec2.to_point()).to_vec2()
|
||||
)
|
||||
);
|
||||
}
|
||||
_ => {}
|
||||
}
|
||||
|
|
@ -120,17 +203,35 @@ impl Widget<CanvasState> for CanvasWidget {
|
|||
}
|
||||
data.temporary_erasing = enable_temporary_erasing;
|
||||
} else {
|
||||
data.handle_event(ctx, event, env);
|
||||
data.handle_event(ctx, event, self.widget_to_viewport(), env);
|
||||
}
|
||||
if let Some(transform) = viewport_transform {
|
||||
let mut new_rect = transform.transform_rect_bbox(self.viewport.rect);
|
||||
if new_rect.x0 <= 0f64 {
|
||||
new_rect.x1 -= new_rect.x0;
|
||||
new_rect.x0 = 0f64;
|
||||
}
|
||||
if new_rect.y0 <= 0f64 {
|
||||
new_rect.y1 -= new_rect.y0;
|
||||
new_rect.y0 = 0f64;
|
||||
}
|
||||
self.viewport.rect = new_rect;
|
||||
self.scroll_component
|
||||
.reset_scrollbar_fade(|d| ctx.request_timer(d), env);
|
||||
ctx.request_paint();
|
||||
ctx.set_handled();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
fn lifecycle(
|
||||
&mut self,
|
||||
_ctx: &mut LifeCycleCtx,
|
||||
_event: &LifeCycle,
|
||||
ctx: &mut LifeCycleCtx,
|
||||
event: &LifeCycle,
|
||||
_data: &CanvasState,
|
||||
_env: &Env,
|
||||
env: &Env,
|
||||
) {
|
||||
self.scroll_component.lifecycle(ctx, event, env);
|
||||
}
|
||||
|
||||
fn update(
|
||||
|
|
@ -149,6 +250,7 @@ impl Widget<CanvasState> for CanvasWidget {
|
|||
// ctx.request_paint_rect(e.bounding_box());
|
||||
// }
|
||||
//} else {
|
||||
|
||||
ctx.request_paint();
|
||||
//}
|
||||
}
|
||||
|
|
@ -177,12 +279,36 @@ impl Widget<CanvasState> for CanvasWidget {
|
|||
let size = ctx.size();
|
||||
let rect = size.to_rect();
|
||||
|
||||
ctx.clip(rect);
|
||||
ctx.fill(rect, &Color::WHITE);
|
||||
|
||||
let page_content_size = data.versioned_canvas.get().content_size();
|
||||
let transform = self.widget_to_viewport();
|
||||
self.viewport.rect =
|
||||
transform.transform_rect_bbox(rect)
|
||||
.with_origin(self.viewport.rect.origin());
|
||||
|
||||
self.viewport.content_size = druid::Size::new(
|
||||
self.viewport.rect.x1.max(page_content_size.width),
|
||||
self.viewport.rect.y1.max(page_content_size.height),
|
||||
);
|
||||
//log::debug!("{:#?}", &self.viewport);
|
||||
|
||||
ctx.save().unwrap();
|
||||
ctx.transform(transform.inverse());
|
||||
for element in data.versioned_canvas.get().elements().iter() {
|
||||
element.draw(ctx);
|
||||
}
|
||||
ctx.restore().unwrap();
|
||||
|
||||
self.scroll_component.draw_bars(ctx, &self.viewport, env);
|
||||
|
||||
// tools take care of the transform themselves
|
||||
if data.tool_ctx.needs_repaint() {
|
||||
data.tool_ctx.paint(ctx, env);
|
||||
}
|
||||
|
||||
// update current widget size
|
||||
self.widget_size = size;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ use crate::canvas::{Canvas, CanvasElement};
|
|||
use crate::history::VersionedCanvas;
|
||||
|
||||
use druid::kurbo::BezPath;
|
||||
use druid::{Data, Env, Event, EventCtx, MouseButton, MouseEvent, PaintCtx};
|
||||
use druid::{Affine, Data, Env, Event, EventCtx, MouseButton, MouseEvent, PaintCtx};
|
||||
|
||||
#[derive(Clone, Data)]
|
||||
pub enum CanvasToolState {
|
||||
|
|
@ -61,30 +61,34 @@ impl CanvasToolCtx {
|
|||
|
||||
pub fn handle_event(
|
||||
&mut self,
|
||||
ctx: &EventCtx,
|
||||
ctx: &mut EventCtx,
|
||||
event: &Event,
|
||||
mut vcanvas: &mut VersionedCanvas,
|
||||
vcanvas: &mut VersionedCanvas,
|
||||
transform: Affine,
|
||||
env: &Env,
|
||||
) {
|
||||
match self.initial_params.tool_type() {
|
||||
CanvasToolType::Pen => self.handle_pen_event(&ctx, &event, &mut vcanvas, &env),
|
||||
CanvasToolType::Eraser => self.handle_erase_event(&ctx, &event, &mut vcanvas, &env),
|
||||
CanvasToolType::Pen => self.handle_pen_event(ctx, event, vcanvas, transform, env),
|
||||
CanvasToolType::Eraser => self.handle_erase_event(ctx, event, vcanvas, transform, env),
|
||||
}
|
||||
}
|
||||
|
||||
pub fn handle_erase_event(
|
||||
&mut self,
|
||||
_ctx: &EventCtx,
|
||||
ctx: &mut EventCtx,
|
||||
event: &Event,
|
||||
vcanvas: &mut VersionedCanvas,
|
||||
transform: Affine,
|
||||
_env: &Env,
|
||||
) {
|
||||
match (&mut self.state, event) {
|
||||
(CanvasToolState::Idle, Event::MouseDown(mouse_event)) if pressed(mouse_event) => {
|
||||
self.state = CanvasToolState::Erasing;
|
||||
ctx.set_handled();
|
||||
}
|
||||
(CanvasToolState::Erasing, Event::MouseMove(mouse_event)) if pressed(mouse_event) => {
|
||||
let eraser_rect = druid::Rect::from_center_size(mouse_event.pos, (5.0, 5.0));
|
||||
let eraser_rect =
|
||||
druid::Rect::from_center_size(transform * mouse_event.pos, (5.0, 5.0));
|
||||
let old_elements = vcanvas.get().elements();
|
||||
let mut new_elements = old_elements.clone();
|
||||
new_elements.retain(|elem| {
|
||||
|
|
@ -101,9 +105,11 @@ impl CanvasToolCtx {
|
|||
*canvas = Canvas::new_with_elements(new_elements);
|
||||
});
|
||||
}
|
||||
ctx.set_handled();
|
||||
}
|
||||
(CanvasToolState::Erasing, Event::MouseUp(mouse_event)) if pressed(mouse_event) => {
|
||||
self.state = CanvasToolState::Idle;
|
||||
ctx.set_handled();
|
||||
}
|
||||
_ => {}
|
||||
}
|
||||
|
|
@ -111,9 +117,10 @@ impl CanvasToolCtx {
|
|||
|
||||
pub fn handle_pen_event(
|
||||
&mut self,
|
||||
_ctx: &EventCtx,
|
||||
ctx: &mut EventCtx,
|
||||
event: &Event,
|
||||
vcanvas: &mut VersionedCanvas,
|
||||
transform: Affine,
|
||||
_env: &Env,
|
||||
) {
|
||||
match (&mut self.state, event) {
|
||||
|
|
@ -130,6 +137,7 @@ impl CanvasToolCtx {
|
|||
},
|
||||
};
|
||||
}
|
||||
ctx.set_handled();
|
||||
}
|
||||
(
|
||||
CanvasToolState::DrawingFreehand {
|
||||
|
|
@ -142,6 +150,7 @@ impl CanvasToolCtx {
|
|||
path.kurbo_path
|
||||
.line_to((mouse_event.pos.x, mouse_event.pos.y));
|
||||
}
|
||||
ctx.set_handled();
|
||||
}
|
||||
(CanvasToolState::DrawingFreehand { .. }, Event::MouseUp(mouse_event)) if pressed(mouse_event) => {
|
||||
vcanvas.update(move |canvas: &mut Canvas| {
|
||||
|
|
@ -149,10 +158,11 @@ impl CanvasToolCtx {
|
|||
if let CanvasToolState::DrawingFreehand { current_path, .. } = current_state {
|
||||
if let CanvasElement::Freehand {
|
||||
mut path,
|
||||
mut thickness,
|
||||
thickness,
|
||||
stroke_color,
|
||||
} = current_path
|
||||
{
|
||||
path.kurbo_path.apply_affine(transform);
|
||||
canvas.add_element(CanvasElement::Freehand {
|
||||
path,
|
||||
thickness,
|
||||
|
|
@ -161,6 +171,7 @@ impl CanvasToolCtx {
|
|||
}
|
||||
}
|
||||
});
|
||||
ctx.set_handled();
|
||||
}
|
||||
_ => {}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue