How does this skill improve my XAML code?

It helps you move away from deep nesting and redundant property declarations by using specialized panels like EdgePanel and centralized styling strategies.

Is it compatible with existing Avalonia projects?

Yes, it is designed to help refactor standard Avalonia layouts into the more maintainable Zafiro-based structure, even in ongoing projects.

Can I use this for icon management?

Yes, the skill provides specific rules for using IconExtension with FontAwesome names, allowing for easy and customizable icon integration without boilerplate.

What is Zafiro.Avalonia?

Zafiro.Avalonia is an extension library for the Avalonia UI framework that provides semantic containers and design utilities to simplify complex UI development.

Does this skill help with MVVM patterns?

Certainly. It encourages moving logic from IValueConverters into ViewModel properties or using Interaction Behaviors for UI-specific logic.

Avalonia UI Zafiro Layout Expert

Name: Avalonia UI Zafiro Layout Expert
Author: lingxling

bylingxling

•

Design Tools

Optimizes Avalonia UI development using Zafiro conventions to create clean, maintainable, and semantic layouts.

This skill provides specialized guidance for building modern cross-platform desktop applications using Avalonia UI and the Zafiro.Avalonia library. It streamlines the creation of user interfaces by emphasizing semantic containers like EdgePanel and HeaderedContainer, promoting the use of shared styles, and enforcing best practices that minimize XAML nesting. Developers can leverage this skill to implement icon extensions, interaction behaviors, and theme-safe designs, ensuring that complex UI projects remain scalable and free from redundant code-behind or excessive converters.

Key Features

01Simplifies icon management via IconExtension and centralized IconOptions

02Reduces XAML complexity by flattening layouts and eliminating deep nesting

03Standardizes theme organization through shared styles and DynamicResource usage

04Implements semantic containers like HeaderedContainer and EdgePanel for cleaner layouts

05Promotes Xaml.Interaction.Behaviors to replace complex converters and code-behind logic

0646 GitHub stars

Use Cases

01Building high-performance, cross-platform desktop UIs with a clean architectural foundation

02Establishing a consistent design system using Zafiro's layout and styling patterns

03Refactoring legacy Avalonia XAML files into reusable, modular components

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add lingxling/awesome-skills-cn avalonia-layout-zafiro

For use in Claude.ai and ChatGPT

Key Features

01Simplifies icon management via IconExtension and centralized IconOptions

02Reduces XAML complexity by flattening layouts and eliminating deep nesting

03Standardizes theme organization through shared styles and DynamicResource usage

04Implements semantic containers like HeaderedContainer and EdgePanel for cleaner layouts

05Promotes Xaml.Interaction.Behaviors to replace complex converters and code-behind logic

0646 GitHub stars

Use Cases

01Building high-performance, cross-platform desktop UIs with a clean architectural foundation

02Establishing a consistent design system using Zafiro's layout and styling patterns

03Refactoring legacy Avalonia XAML files into reusable, modular components

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add lingxling/awesome-skills-cn avalonia-layout-zafiro

For use in Claude.ai and ChatGPT