MakepadDSL技能Skill makepad-dsl

---

name: makepad-dsl description: | 关键：用于Makepad DSL语法和继承。触发于： makepad dsl, live_design, makepad inheritance, makepad prototype, “<Widget>”, “Foo = { }”, makepad object, makepad property, makepad DSL 语法, makepad 继承, makepad 原型, 如何定义 makepad 组件

Makepad DSL 技能

版本： makepad-widgets（开发分支） | 最后更新： 2026-01-19

检查更新：https://crates.io/crates/makepad-widgets

你是Rust makepad-widgets crate DSL的专家。通过以下方式帮助用户：

• 编写代码：生成遵循以下模式的DSL代码
• 回答问题：解释DSL语法、继承、属性覆盖

文档

参考本地文件获取详细文档：

• ./references/dsl-syntax.md - 完整的DSL语法参考
• ./references/inheritance.md - 继承模式和示例

重要：文档完整性检查

在回答问题之前，Claude必须：

1. 阅读上面列出的相关参考文件
2. 如果文件读取失败或文件为空：
   • 通知用户：“本地文档不完整，建议运行 /sync-crate-skills makepad --force 更新文档”
   • 仍然基于SKILL.md模式 + 内置知识回答
3. 如果参考文件存在，将其内容融入答案

关键模式

1. 匿名对象

{
    width: 100.0
    height: 50.0
    color: #FF0000
}

2. 命名对象（原型）

MyButton = {
    width: Fit
    height: 40.0
    padding: 10.0
    draw_bg: { color: #333333 }
}

3. 带有覆盖的继承

PrimaryButton = <MyButton> {
    draw_bg: { color: #0066CC }  // 覆盖父类颜色
    draw_text: { color: #FFFFFF }  // 添加新属性
}

4. 小部件实例化

<View> {
    // 从View原型继承
    width: Fill
    height: Fill

    <Button> { text: "Click Me" }  // 子小部件
    <Label> { text: "Hello" }      // 另一个子小部件
}

5. 链接Rust结构体到DSL

// 在live_design!中
MyWidget = {{MyWidget}} {
    // DSL属性
    width: 100.0
}

// 在Rust中
#[derive(Live, LiveHook, Widget)]
pub struct MyWidget {
    #[deref] view: View,
    #[live] width: f64,
}

DSL语法参考

语法	描述	示例
{ ... }	匿名对象	{ width: 100.0 }
Name = { ... }	命名原型	MyStyle = { color: #FFF }
<Name> { ... }	从原型继承	<MyStyle> { size: 10.0 }
{{RustType}}	链接到Rust结构体	App = {{App}} { ... }
name = <Widget>	命名子小部件	btn = <Button> { }
dep("...")	资源依赖	dep("crate://self/img.png")

属性类型

类型	示例	描述
数字	width: 100.0	浮点值
颜色	color: #FF0000FF	RGBA十六进制颜色
字符串	text: "Hello"	文本字符串
枚举	flow: Down	枚举变体
大小	width: Fit	Fit、Fill或数值
对象	padding: { top: 10.0 }	嵌套对象
数组	labels: ["A", "B"]	值列表

继承规则

1. 急切复制：所有父属性被立即复制
2. 覆盖：子可以覆盖任何父属性
3. 扩展：子可以添加新属性
4. 嵌套覆盖：部分覆盖嵌套对象

Parent = {
    a: 1
    nested: { x: 10, y: 20 }
}

Child = <Parent> {
    a: 2              // 覆盖a
    b: 3              // 添加新属性
    nested: { x: 30 } // 仅覆盖x，y保持20
}

当编写代码时

1. 使用<Widget>语法从内置小部件继承
2. 定义可重用样式为命名原型
3. 使用{{RustType}}链接DSL到Rust结构体
4. 仅覆盖需要更改的属性
5. 使用有意义的名称用于子小部件引用

当回答问题时

1. 解释继承为“急切复制” - 属性在定义时被复制
2. 强调DSL通过live_design!宏嵌入Rust
3. 突出DSL的更改可以实时重新加载而无需重新编译
4. 区分命名对象（原型）和小部件实例