Agent Skills
› ZhangHanDong/makepad-skills
ZhangHanDong/makepad-skills
GitHub用于 Makepad 2.0 动画系统的开发技能，涵盖 Animator API、状态组配置及缓动函数。指导如何为支持组件添加悬停、过渡等动画，并明确不支持的组件列表。
Install All Skills
npx skills add ZhangHanDong/makepad-skills --all -g -y
Skills in Collection (14)
用于 Makepad 2.0 动画系统的开发技能，涵盖 Animator API、状态组配置及缓动函数。指导如何为支持组件添加悬停、过渡等动画，并明确不支持的组件列表。
makepad animation
AnimatorState
hover effect
animation state
ease function
timeline
snap()
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-animation -g -y
提供Makepad 2.0应用结构、Rust与Splash脚本集成、生命周期管理及热重载部署的脚手架指南。
makepad app structure
Rust Splash integration
app_main setup
hot reload configuration
wasm deploy
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-app-structure -g -y
提供Makepad 2.0 DSL语法指导，涵盖script_mod!宏、冒号属性赋值、命名实例(:=)、合并操作符(+:)及点路径语法。用于解决UI组件定义、样式覆盖及模板复用等开发问题。
makepad dsl
script_mod!
makepad syntax
makepad property
colon syntax
merge operator
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-dsl -g -y
Makepad 2.0布局系统指南，介绍非CSS的Turtle布局机制。涵盖Walk（尺寸控制）与Layout（排列规则），详解Fill/Fit/固定值用法及常见陷阱，指导容器高度设置以避免渲染为0像素的问题。
makepad layout
makepad flex
布局
对齐
间距
滚动视图
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-layout -g -y
指导将Makepad框架从1.x版本迁移至2.0版本，涵盖宏语法、派生宏及生命周期方法的变更处理。
makepad migration
makepad upgrade
旧语法转新语法
LiveHook to ScriptHook
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-migration -g -y
针对Makepad 2.0的性能优化与调试技能，涵盖渲染批处理、垃圾回收及UI卡顿排查。
性能优化
调试
渲染批处理
内存管理
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-performance -g -y
提供 Makepad 2.0 GPU 着色器开发指南，涵盖 SDF2D 绘制、像素/顶点函数编写、变量作用域及 Alpha 预乘规范，辅助实现自定义 UI 渲染。
Makepad 着色器开发
SDF2D 图形绘制
自定义 UI 渲染逻辑
像素函数编写
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-shaders -g -y
提供 Makepad 2.0 主题系统的使用指南，涵盖暗色/亮色模式切换、设计令牌（颜色、字体、间距）的配置与最佳实践，确保 UI 视觉一致性。
主题配置
暗色模式设置
亮色模式设置
主题切换实现
UI 样式调整
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-theme -g -y
用于Makepad 2.0框架的矢量图形开发，支持SVG路径、形状、渐变、滤镜及Tween动画。指导用户正确使用Vector/Svg组件属性，避免与通用Widget属性混淆。
makepad vector
Vector widget
SVG path
vector animation
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-vector -g -y
提供 Makepad 2.0 UI 组件目录与使用指南，涵盖视图、文本、按钮等控件属性及高级模式，辅助前端界面开发。
查询 Makepad 组件用法
获取控件属性参考
UI 布局与样式配置
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-widgets -g -y
Makepad 2.0 GUI开发的入门技能，作为设计判断锚点。它负责将问题路由至具体的语法/API合规技能，并为架构、状态管理和数据流等设计决策提供概念指导，确保开发符合最佳实践。
makepad, makepad app, makepad project, makepad design
live_design!, app_main!, script_mod!, Cx, WidgetRef, Widget
makepad-widgets, makepad architecture, makepad how to
how should I, should I use, what's the best way
makepad 架构, makepad 设计, makepad 怎么做, makepad 最佳实践
组件拆分, 状态管理, 数据流, 渲染思维
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-design-judgment -g -y
文档介绍Makepad 2.0的双层事件系统，涵盖Splash层内联处理与Rust层MatchEvent，以及两者间的宏桥接机制，指导UI交互与业务逻辑的实现。
需要实现Makepad UI组件的点击、渲染或状态回调
处理用户输入、剪贴板或弹窗等交互事件
在Rust代码中调用或更新Splash脚本状态
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-events -g -y
Makepad 2.0 核心运行时 UI 脚本语言 Splash 的开发指南。涵盖 script_mod! 宏、热重载、流式评估及 AI 代码生成。详细说明语法规则（无逗号分号）、状态管理、事件处理、函数定义及与 Rust 的交互机制，用于构建响应式界面和逻辑。
Splash 脚本编写
Makepad 2.0 UI 开发
script_mod! 宏使用
热重载配置
Rust 与 Splash 交互
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-splash -g -y
提供 Makepad 2.0 开发中的常见陷阱与故障排除指南，涵盖 UI 不显示、文本不可见、编译错误及性能问题等场景的根因分析与修复方案。
makepad error
UI is invisible
text invisible
compile error
hot reload not working
npx skills add ZhangHanDong/makepad-skills --skill makepad-2.0-troubleshooting -g -y
