AgentSkillsCN

makepad-router

关键：用于所有Makepad/Robius相关问题，包括组件、布局、事件与着色器。可通过以下触发词启动：makepad、robius、live_design、app_main、Widget、View、Button、Label、Image、TextInput、ScrollView、RoundedView、SolidView、PortalList、Markdown、Html、TextFlow、布局、Flow、Walk、内边距、外边距、宽度、高度、Fit、Fill、对齐、间距、事件、动作、Hit、FingerDown、FingerUp、KeyDown、handle_event、点击、轻触、动画师、动画、状态、过渡、悬停、按下、缓动、着色器、draw_bg、draw_text、Sdf2d、像素、渐变、发光、阴影、字体、文本样式、字体大小、字形、排版、tokio、async、spawn、submit_async、SignalToUI、post_action、apply_over、TextOrImage、模态、可折叠、拖放、AppState、持久化、主题、Scope、部署、打包、APK、IPA、WASM、cargo makepad、makepad组件、makepad组件、makepad按钮、makepad布局、makepad事件、makepad动画、makepad着色器、创建组件、自定义组件、开发应用、居中、对齐、点击事件、悬停效果、渐变、阴影、字体大小

SKILL.md
--- frontmatter
name: makepad-router
description: "CRITICAL: Use for ALL Makepad/Robius questions including widgets, layout, events, and shaders.
Triggers on: makepad, robius, live_design, app_main, Widget, View, Button, Label, Image, TextInput,
ScrollView, RoundedView, SolidView, PortalList, Markdown, Html, TextFlow,
layout, Flow, Walk, padding, margin, width, height, Fit, Fill, align, spacing,
event, action, Hit, FingerDown, FingerUp, KeyDown, handle_event, click, tap,
animator, animation, state, transition, hover, pressed, ease,
shader, draw_bg, draw_text, Sdf2d, pixel, gradient, glow, shadow,
font, text_style, font_size, glyph, typography,
tokio, async, spawn, submit_async, SignalToUI, post_action,
apply_over, TextOrImage, modal, collapsible, drag drop,
AppState, persistence, theme, Scope,
deploy, package, APK, IPA, WASM, cargo makepad,
makepad widget, makepad 组件, makepad 按钮, makepad 布局, makepad 事件, makepad 动画, makepad 着色器,
创建组件, 自定义组件, 开发应用, 居中, 对齐, 点击事件, 悬停效果, 渐变, 阴影, 字体大小"
globs: ["**/live_design!*", "**/*.rs"]

Makepad Question Router

Version: 2.0.0 | Last Updated: 2026-01-21

INSTRUCTIONS FOR CLAUDE

When this skill is triggered, you MUST load the appropriate sub-skill(s) based on the question:

Routing Table

KeywordsLoad Skill
live_design!, app_main!, getting started, app structuremakepad-basics
DSL, inheritance, <Widget>, Foo = { }makepad-dsl
layout, Flow, Walk, padding, width, height, center, alignmakepad-layout
View, Button, Label, Image, TextInput, widget, Markdown, Htmlmakepad-widgets
event, action, Hit, FingerDown, handle_event, clickmakepad-event-action
animator, state, transition, hover, pressedmakepad-animation
shader, draw_bg, Sdf2d, gradient, glow, shadowmakepad-shaders
font, text_style, font_size, glyphmakepad-font
platform, macOS, Android, iOS, WASMmakepad-platform
tokio, async, spawn, submit_asyncrobius-app-architecture
apply_over, modal, collapsible, pagefliprobius-widget-patterns
custom action, MatchEvent, post_actionrobius-event-action
AppState, persistence, theme switchrobius-state-management
deploy, package, APK, IPAmakepad-deployment
troubleshoot, error, debugmakepad-reference

Context Bundle Loading

For complex tasks, load multiple skills:

ContextLoad These Skills
Create widget/componentmakepad-widgets, makepad-dsl, makepad-layout, makepad-animation, makepad-shaders, makepad-event-action
Build full appmakepad-basics, makepad-dsl, makepad-layout, makepad-widgets, makepad-event-action, robius-app-architecture
UI designmakepad-dsl, makepad-layout, makepad-widgets, makepad-animation, makepad-shaders
Production patternsrobius-app-architecture, robius-widget-patterns, robius-state-management

Skill Dependencies

When loading a skill, also load its dependencies:

SkillAlso Load
makepad-widgetsmakepad-layout, makepad-dsl
makepad-animationmakepad-shaders
makepad-shadersmakepad-widgets
robius-widget-patternsmakepad-widgets, makepad-layout

Example Workflow

code
User: "How do I create a custom button with hover animation?"

Analysis:
1. Keywords: custom, button, hover, animation
2. Context: Widget creation
3. Load: makepad-widgets, makepad-animation, makepad-shaders, makepad-event-action

Answer using patterns from all loaded skills.

Default Project Settings

When creating Makepad projects:

toml
[package]
edition = "2024"

[dependencies]
makepad-widgets = { git = "https://github.com/makepad/makepad", branch = "dev" }

[features]
default = []
nightly = ["makepad-widgets/nightly"]

Key Patterns Quick Reference

Widget Definition

rust
#[derive(Live, LiveHook, Widget)]
pub struct MyWidget {
    #[deref] view: View,
    #[live] property: f64,
    #[rust] state: State,
    #[animator] animator: Animator,
}

Async Pattern (Robius)

rust
// UI -> Async
submit_async_request(MyRequest { ... });

// Async -> UI
Cx::post_action(MyAction { ... });
SignalToUI::set_ui_signal();