avalonia-layout-zafiro

Solid

Guidelines for modern Avalonia UI layout using Zafiro.Avalonia, emphasizing shared styles, generic components, and avoiding XAML redundancy.

Web & Frontend 27,705 stars 2858 forks Updated today MIT

Install

View on GitHub

Quality Score: 96/100

Stars 20%
100
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# Avalonia Layout with Zafiro.Avalonia > Master modern, clean, and maintainable Avalonia UI layouts. > **Focus on semantic containers, shared styles, and minimal XAML.** ## ๐ŸŽฏ Selective Reading Rule **Read ONLY files relevant to the layout challenge!** --- ## ๐Ÿ“‘ Content Map | File | Description | When to Read | |------|-------------|--------------| | `themes.md` | Theme organization and shared styles | Setting up or refining app themes | | `containers.md` | Semantic containers (`HeaderedContainer`, `EdgePanel`, `Card`) | Structuring views and layouts | | `icons.md` | Icon usage with `IconExtension` and `IconOptions` | Adding and customizing icons | | `behaviors.md` | `Xaml.Interaction.Behaviors` and avoiding Converters | Implementing complex interactions | | `components.md` | Generic components and avoiding nesting | Creating reusable UI elements | --- ## ๐Ÿ”— Related Project (Exemplary Implementation) For a real-world example, refer to the **Angor** project: `/mnt/fast/Repos/angor/src/Angor/Avalonia/Angor.Avalonia.sln` --- ## โœ… Checklist for Clean Layouts - [ ] **Used semantic containers?** (e.g., `HeaderedContainer` instead of `Border` with manual header) - [ ] **Avoided redundant properties?** Use shared styles in `axaml` files. - [ ] **Minimized nesting?** Flatten layouts using `EdgePanel` or generic components. - [ ] **Icons via extension?** Use `{Icon fa-name}` and `IconOptions` for styling. - [ ] **Behaviors over code-behind?** Use `Interaction.Behaviors` for...

Details

Author
davila7
Repository
davila7/claude-code-templates
Created
11 months ago
Last Updated
today
Language
Python
License
MIT

Integrates with

Similar Skills

Semantically similar based on skill content โ€” not just same category