makepad-graphics
2
总安装量
0
周安装量
#74277
全站排名
安装命令
npx skills add https://github.com/zhanghandong/makepad-skills --skill makepad-graphics
Skill 文档
Graphics & Effects
GPU-accelerated shaders, SDF drawing, and animations in Makepad.
Shader Basics
| Skill | Description |
|---|---|
| Shader Structure | Variables, types, built-ins |
| Shader Math | Math functions, colors, textures |
SDF Drawing
| Skill | Description |
|---|---|
| SDF Shapes | Circle, box, capsule |
| SDF Path Drawing | Lines, arcs, triangles |
| Progress & Track | Progress bars, sliders |
Animation
| Skill | Description |
|---|---|
| Animator Basics | Definition, timing, triggering |
| Easing Functions | Curves, multi-property |
| Keyframe Animation | Keyframes, loops |
| Loading Spinner | Rotating arc animation |
Visual Effects
| Skill | Description |
|---|---|
| Hover Effect | Interactive hover states |
| Gradient Effects | Linear, radial, vignette |
| Shadow & Glow | Shadows, glow, pulse |
| Disabled State | Disabled visual pattern |
| Toggle & Checkbox | Switch, checkbox visuals |
Community Effects
See community/ for community-contributed shaders and effects.
To contribute your own shader/effect, use the template at 99-evolution/templates/shader-template.md.
Quick Reference
SDF Operations
sdf.circle(x, y, r) // Circle
sdf.box(x, y, w, h, r) // Rounded rect
sdf.fill(color) // Fill shape
sdf.stroke(color, w) // Stroke outline
sdf.fill_keep(color) // Fill, keep shape
Animator Timing
Forward {duration: 0.15} // Linear transition
Snap // Instant change
Loop {duration: 1.0} // Continuous loop
Common Easing
OutQuad // Enter animations
InQuad // Exit animations
ExpDecay {d1: 0.8, d2: 0.97} // Physics-like