use llimphi_ui::llimphi_layout::taffy::{
prelude::{length, percent, Dimension, FlexDirection, Size, Style},
AlignItems, JustifyContent,
};
use llimphi_ui::llimphi_raster::kurbo::{Affine, Circle, Line, Stroke};
use llimphi_ui::llimphi_raster::peniko::{Color, Fill};
use llimphi_ui::{App, DragPhase, GesturePhase, Handle, View};
#[derive(Clone)]
enum Msg {
Zoom { factor: f32, fx: f32, fy: f32 },
Pan { dx: f32, dy: f32 },
Reset,
Mark { lx: f32, ly: f32 },
}
struct Model {
zoom: f32,
pan: (f32, f32),
marks: Vec<(f32, f32)>,
last: String,
}
struct Gestos;
impl App for Gestos {
type Model = Model;
type Msg = Msg;
fn title() -> &'static str {
"llimphi · gestos (pinch-zoom · double-tap · long-press)"
}
fn initial_size() -> (u32, u32) {
(900, 640)
}
fn init(_: &Handle<Self::Msg>) -> Self::Model {
Model {
zoom: 1.0,
pan: (0.0, 0.0),
marks: Vec::new(),
last: "probá: Ctrl+rueda (zoom) · arrastrar (paneo) · doble-click (reset) · mantener (marca)".into(),
}
}
fn update(mut model: Self::Model, msg: Self::Msg, _: &Handle<Self::Msg>) -> Self::Model {
match msg {
Msg::Zoom { factor, fx, fy } => {
let new_zoom = (model.zoom * factor).clamp(0.15, 12.0);
let rf = new_zoom / model.zoom; model.pan.0 = fx - rf * (fx - model.pan.0);
model.pan.1 = fy - rf * (fy - model.pan.1);
model.zoom = new_zoom;
model.last = format!("zoom ×{:.2}", model.zoom);
}
Msg::Pan { dx, dy } => {
model.pan.0 += dx;
model.pan.1 += dy;
model.last = "paneo".into();
}
Msg::Reset => {
model.zoom = 1.0;
model.pan = (0.0, 0.0);
model.last = "doble-tap → reset".into();
}
Msg::Mark { lx, ly } => {
let wx = (lx - model.pan.0) / model.zoom;
let wy = (ly - model.pan.1) / model.zoom;
model.marks.push((wx, wy));
model.last = format!("long-press → marca #{} @ ({wx:.0}, {wy:.0})", model.marks.len());
}
}
model
}
fn view(model: &Self::Model) -> View<Self::Msg> {
let zoom = model.zoom;
let pan = model.pan;
let marks = model.marks.clone();
let canvas = View::new(Style {
size: Size { width: percent(1.0_f32), height: Dimension::auto() },
flex_grow: 1.0,
..Default::default()
})
.fill(Color::from_rgba8(16, 18, 26, 255))
.clip(true)
.paint_with(move |scene, _ts, rect| {
let step = 40.0 * zoom as f64;
if step >= 4.0 {
let thin = Stroke::new(1.0);
let grid = Color::from_rgba8(40, 46, 60, 255);
let ox = (rect.x as f64) + (pan.0 as f64).rem_euclid(step);
let mut x = ox;
while x < (rect.x + rect.w) as f64 {
scene.stroke(&thin, Affine::IDENTITY, grid, None,
&Line::new((x, rect.y as f64), (x, (rect.y + rect.h) as f64)));
x += step;
}
let oy = (rect.y as f64) + (pan.1 as f64).rem_euclid(step);
let mut y = oy;
while y < (rect.y + rect.h) as f64 {
scene.stroke(&thin, Affine::IDENTITY, grid, None,
&Line::new((rect.x as f64, y), ((rect.x + rect.w) as f64, y)));
y += step;
}
}
let dot = Color::from_rgba8(90, 220, 150, 255);
let r = (6.0 * zoom as f64).clamp(3.0, 24.0);
for (wx, wy) in &marks {
let sx = rect.x as f64 + pan.0 as f64 + (*wx as f64) * zoom as f64;
let sy = rect.y as f64 + pan.1 as f64 + (*wy as f64) * zoom as f64;
scene.fill(Fill::NonZero, Affine::IDENTITY, dot, None, &Circle::new((sx, sy), r));
}
})
.on_scale(|phase, factor, fx, fy| match phase {
GesturePhase::Update => Some(Msg::Zoom { factor, fx, fy }),
_ => None,
})
.draggable(|phase, dx, dy| match phase {
DragPhase::Move => Some(Msg::Pan { dx, dy }),
DragPhase::End => None,
})
.on_double_tap(Msg::Reset)
.on_long_press_at(|lx, ly, _w, _h| Some(Msg::Mark { lx, ly }));
let status = View::new(Style {
size: Size { width: percent(1.0_f32), height: length(40.0_f32) },
align_items: Some(AlignItems::Center),
justify_content: Some(JustifyContent::Center),
..Default::default()
})
.fill(Color::from_rgba8(28, 32, 42, 255))
.text(
format!("{} · ×{:.2} · {} marcas", model.last, model.zoom, model.marks.len()),
18.0,
Color::from_rgba8(210, 220, 235, 255),
);
View::new(Style {
flex_direction: FlexDirection::Column,
size: Size { width: percent(1.0_f32), height: percent(1.0_f32) },
..Default::default()
})
.fill(Color::from_rgba8(16, 18, 26, 255))
.children(vec![canvas, status])
}
}
fn main() {
llimphi_ui::run::<Gestos>();
}