
关于
Makepad 启动画面开发指南。
name: makepad-splash description: | 关键:用于 Makepad Splash 脚本语言。触发条件: splash language, makepad script, makepad scripting, script!, cx.eval, makepad dynamic, makepad AI, splash 语言, makepad 脚本 risk: unknown source: community
Makepad Splash 技能
版本: makepad-widgets (dev 分支) | 最后更新: 2026-01-19
检查更新:https://crates.io/crates/makepad-widgets
你是 Makepad Splash 脚本语言的专家。通过以下方式帮助用户:
- 编写 Splash 脚本:动态 UI 和工作流自动化
- 理解 Splash:用途、语法和功能
适用场景
- 你需要在 Makepad 中使用 Splash 进行动态脚本编写。
- 任务涉及
script!、cx.eval、运行时生成的 UI 或 Makepad 中的工作流自动化。 - 你想要关于 Splash 语法和用途的指导,而非纯静态 Rust 模式。
文档
参考本地文件获取详细文档:
./references/splash-tutorial.md- Splash 语言教程
重要:文档完整性检查
在回答问题之前,Claude 必须:
- 读取上面列出的相关参考文件
- 如果文件读取失败或文件为空:
- 通知用户:"本地文档不完整,建议运行
/sync-crate-skills makepad --force更新文档" - 仍然基于 SKILL.md 模式 + 内置知识回答
- 通知用户:"本地文档不完整,建议运行
- 如果参考文件存在,将其内容纳入回答
什么是 Splash?
Splash 是 Makepad 的动态脚本语言,设计用于:
- AI 辅助工作流
- 动态 UI 生成
- 快速原型开发
- HTTP 请求和异步操作
Script 宏
// 在 Rust 中嵌入 Splash 代码
script!{
fn main() {
let x = 10;
console.log("Hello from Splash!");
}
}
执行
// 在运行时评估 Splash 代码
cx.eval(code_string);
// 带上下文
cx.eval_with_context(code, context);
基本语法
变量
let x = 10;
let name = "Makepad";
let items = [1, 2, 3];
let config = { width: 100, height: 50 };
函数
fn add(a, b) {
return a + b;
}
fn greet(name) {
console.log("Hello, " + name);
}
控制流
// If-else
if x > 10 {
console.log("big");
} else {
console.log("small");
}
// 循环
for i in 0..10 {
console.log(i);
}
while condition {
// ...
}
内置对象
console
console.log("Message");
console.warn("Warning");
console.error("Error");
http
// GET 请求
let response = http.get("https://api.example.com/data");
// POST 请求
let response = http.post("https://api.example.com/data", {
body: { key: "value" }
});
timer
// 设置超时
timer.set(1000, fn() {
console.log("1 second passed");
});
// 设置间隔
let id = timer.interval(500, fn() {
console.log("tick");
});
// 清除定时器
timer.clear(id);
Widget 交互
// 访问 widget
let button = ui.widget("my_button");
button.set_text("Click Me");
button.set_visible(true);
// 监听事件
button.on_click(fn() {
console.log("Button clicked!");
});
异步操作
// 异步函数
async fn fetch_data() {
let response = await http.get("https://api.example.com");
return response.json();
}
// 调用异步
fetch_data().then(fn(data) {
console.log(data);
});
AI 工作流集成
Splash 专为 AI 辅助开发设计:
// 动态 UI 生成
fn create_form(fields) {
let form = ui.create("View");
for field in fields {
let input = ui.create("TextInput");
input.set_label(field.label);
form.add_child(input);
}
return form;
}
// AI 可以动态生成这些
create_form([
{ label: "Name" },
{ label: "Email" },
{ label: "Message" }
]);
使用场景
- 快速原型开发:无需重新编译即可快速测试 UI 布局
- AI 代理:让 AI 动态生成和修改 UI
- 配置:运行时配置应用行为
- 脚本化工作流:自动化重复任务
- 插件系统:通过脚本扩展应用功能
回答问题时注意
- Splash 用于动态/运行时脚本,不是核心应用逻辑
- 性能关键代码使用 Rust,灵活性需求使用 Splash
- Splash 语法类似 JavaScript/Rust 混合体
- 脚本在沙箱环境中运行
- HTTP 和 timer API 支持异步操作
限制
- 仅在任务明确匹配上述范围时使用此技能。
- 不要将输出视为环境特定验证、测试或专家审查的替代品。
- 如果缺少必需的输入、权限、安全边界或成功标准,请停下来要求澄清。
兼容工具
Claude CodeCursor
标签
通用