Generate Makepad Widget Code and Answers

Makepad Widgets Skill turns Claude into an expert on Makepad's Rust UI widget system, generating widget code following documented patterns and answering questions about widget properties, variants, and usage. Before answering, it must read the relevant local reference file (widgets-core.md, widgets-advanced.md, or widgets-richtext.md) and incorporate its content; if a reference file is missing or empty, it tells the user to run /sync-crate-skills makepad --force to update the documentation and falls back to the patterns in SKILL.md plus built-in knowledge.

Use this when working with core or advanced Makepad widgets, choosing between widget variants, composing widgets, or needing widget-specific behavior explained, or when examples are needed for View, Button, labels, rich text, or other makepad-widgets building blocks.

Key code patterns cover View (a basic Fill/Down-flow container with show_bg/draw_bg), Button (draw_bg/draw_text styling including hover color and border radius), Label (styled text with draw_text/text_style), Image (source via dep("crate://self/...") and a fit mode), and TextInput (default text plus draw_text styling), for example:

<Button> {
    text: "Click Me"
    draw_bg: {
        color: #0066CC
        color_hover: #0088FF
        border_radius: 4.0
    }
    draw_text: {
        color: #FFFFFF
        text_style: { font_size: 14.0 }
    }
}

The underlying WidgetNode and Widget traits define find_widgets, walk, area, redraw, handle_event, draw_walk, draw, and widget for custom widget implementations. When writing code, the skill always sets width/height, enables show_bg: true for background rendering, uses draw_bg/draw_text/draw_icon for shader uniforms, and uses dep("crate://self/...") for resource paths.

Spans 84 files in widgets/src/ across nine categories: Basic (View, Label, Button, Icon, Image), Input (TextInput, CheckBox, RadioButton, Slider, DropDown, ColorPicker), Container (ScrollBars, PortalList, FlatList, StackNavigation, Dock, Splitter), Navigation (TabBar, Tab, FoldHeader, FoldButton, ExpandablePanel), Overlay (Modal, Tooltip, PopupMenu, PopupNotification), Media (Video, RotatedImage, ImageBlend, MultiImage), Layout (AdaptiveView, SlidePanel, PageFlip, SlidesView), Special (Markdown, Html, TextFlow, WebView, KeyboardView), and Utility (LoadingSpinner, DesktopButton, LinkLabel, ScrollShadow). View has 12 style variants (SolidView, RoundedView, RoundedAllView, RectView, CircleView, GradientXView, GradientYView, RoundedShadowView, ScrollXView, ScrollYView, ScrollXYView, CachedView), Button has 6 (ButtonFlat, ButtonFlatIcon, ButtonFlatter, ButtonGradientX, ButtonGradientY, ButtonIcon), and Image supports 4 fit modes (Stretch, Contain, Cover, Fill).

Rust developers building Makepad UIs who need correct widget syntax, the right variant for a visual need such as RoundedShadowView versus a plain View, or a starting point for exploring the widget catalog via the UI Zoo example - keeping in mind that View is the base container most visual widgets inherit from, and all widgets support animation through the animator property.