Winui Design
Guida alla progettazione/revisione di layout, scelta dei controlli, temi e binding XAML di WinUI 3
Promosso
Cosa fa
Una skill di progettazione e revisione per WinUI 3 (Windows App SDK): mappa i requisiti ai controlli della piattaforma, applica le silhouette Fluent app-shape, una rubrica di dimensionamento delle finestre, regole di tematizzazione Light/Dark/High-Contrast e rileva le comuni insidie di binding XAML x:Bind. Si attiva quando si crea o si revisiona XAML di WinUI 3, si migra UI desktop/WPF a WinUI o si sceglie tra controlli e pattern WinUI. Include un winui-search.exe (solo Windows) per la ricerca di esempi di codice WinUI Gallery/Toolkit/Reactor, più tre file di riferimento on-demand.
Rapporto di test
Ho localizzato SKILL.md in plugins/winui/skills/winui-design/; il frontmatter si analizza con name+description. Ho controllato a campione tutti e 3 i file di riferimento (references/brushes-and-icons.md, theme-accessibility.md, layout-review.md) — HTTP 200 — più winui-search.exe (HTTP 200, 7.9MB; `file` riporta binario console PE32+ Windows, non eseguibile su questo host macOS, quindi quel passaggio è solo per Windows). Ho verificato l'installazione in una HOME temporanea pulita: SKILL.md si trova in ~/.claude/skills/winui-design/SKILL.md. Test OUTPUT: ho scritto una piccola utility WinUI 3 "Rename File" (TextBox + status + button) due volte — base vs conforme alla skill (entrambi salvati nello scratchpad). Seguendo il corpo è stato prodotto XAML concretamente migliore: ha rilevato due veri bug silenziosi che la base aveva spedito — {x:Bind Vm.Status} di default è OneTime quindi lo stato non si aggiorna mai (la skill ha aggiunto Mode=OneWay), e un TextBox TwoWay senza UpdateSourceTrigger=PropertyChanged lascia la VM obsoleta fino alla perdita del focus — e ha applicato la rubrica di dimensionamento delle finestre con un AppWindow.Resize corretto per DPI (la base ha lasciato il default sovradimensionato ~1024x768), scambiando un letterale "Gray" hardcoded + placeholder-come-etichetta con uno stato InfoBar semantico e un'etichetta visibile. NON ho eseguito winui-search.exe (piattaforma sbagliata); la guida inline ha supportato l'output senza di esso.
Testato il: 2026-07-21 · Claude Code 2.x (agent harness)
Installazione
git clone --depth 1 https://github.com/microsoft/win-dev-skills.git /tmp/winui-design-src mkdir -p ~/.claude/skills cp -R /tmp/winui-design-src/plugins/winui/skills/winui-design ~/.claude/skills/winui-design # SKILL.md now at ~/.claude/skills/winui-design/SKILL.md # Optional bundled tool: winui-search.exe is a Windows-only PE32+ binary (~7.9MB, .NET). # It runs ONLY on Windows (WinUI's real target platform); NOT usable on macOS/Linux. # The skill's design/review guidance works without it — the exe only adds sample lookups. # Source for the binary is in the same repo at src/tools/winui-search if you want to build/inspect. # Plugin-marketplace alternative: repo exposes .claude-plugin/marketplace.json (plugin name: winui).
Comandi e prompt di esempio
/winui-designGuida alla progettazione/revisione di layout, scelta dei controlli, temi e binding XAML di WinUI 3
Gli skill si attivano con richieste in linguaggio naturale, senza comandi da ricordare. Dopo l'installazione, prompt come questi lo attivano (in inglese):
Review this XAML page against Fluent DesignChoose the right WinUI control for this layoutFix dark theme contrast in this WinUI screen