egui Drag Values: Speed, Range & Formatting | Rust GUI Ep 20
4views
0011:42
T
Taught by Celeste AI - AI Coding Coach
View on YouTubeDescription
Build a Transform Editor with draggable number controls in egui! Learn DragValue::new() with speed, range,
suffix, and prefix formatting. We also add interactive canvas dragging for position, rotation, and scale.
Student code: https://github.com/GoCelesteAI/egui_drag_values/tree/main
What You'll Learn:
- egui::DragValue::new() for draggable number inputs
- .speed() to control drag sensitivity
- .range() to clamp values within bounds
- .suffix("°") and .prefix("x") for formatted display
- Sense::click_and_drag() for canvas interaction
- response.dragged_by() for primary and secondary button detection
- smooth_scroll_delta for scroll-based scaling
- egui::Rgba for linear-to-sRGB color conversion
- Neo-tree / to filter the file tree
Timestamps:
0:00 Intro
0:12 App Preview
0:22 What We're Building
0:54 Create Project & Cargo.toml
1:26 main.rs — App Entry Point
2:04 app.rs — MyApp Struct & Default
3:04 SidePanel with DragValue Controls
5:12 Color Picker & Reset Button
5:54 CentralPanel — Canvas with Drag Interactions
7:12 Drawing the Rotated Rectangle
8:48 cargo build
9:08 Neo-tree Filter & Split View
9:28 App Demo
10:28 Recap
11:08 Next Episode
Series: Learn egui in Neovim
Part of a 36-episode series teaching Rust GUI development with egui, coded entirely in Neovim with Neo-tree.
Tags: egui, rust, gui, drag value, tutorial, neovim, transform editor, dragvalue, speed, range, suffix, prefix