المهارات avalonia-layout-zafiro
📦

avalonia-layout-zafiro

آمن

使用 Zafiro 构建简洁的 Avalonia UI 布局

使用语义化容器和共享样式创建可维护的 Avalonia 应用程序。通过 Zafiro.Avalonia 组件和最佳实践减少 XAML 冗余。

يدعم: Claude Codex Code(CC)
📊 71 كافٍ
1

تنزيل ZIP المهارة

2

رفع في Claude

اذهب إلى Settings → Capabilities → Skills → Upload skill

3

فعّل وابدأ الاستخدام

اختبرها

استخدام "avalonia-layout-zafiro". Create a wallet balance display with icon, label, and value

النتيجة المتوقعة:

Use EdgePanel with StartContent for the wallet icon, Content for the label, and EndContent for the balance value. Apply IconOptions.Size and IconOptions.Fill for consistent icon styling.

استخدام "avalonia-layout-zafiro". How do I avoid repeating border and color settings?

النتيجة المتوقعة:

Define a Style in Containers.axaml with selector 'HeaderedContainer.BlueSection', set CornerRadius, BorderThickness, BorderBrush, and Background using DynamicResource. Apply with Classes='BlueSection'.

التدقيق الأمني

آمن
v1 • 2/24/2026

Static analysis detected 100 pattern matches but all are false positives. The skill contains only Markdown documentation files with XAML examples for Avalonia UI development. Detected patterns like backticks are Markdown code fences, not shell execution. No executable code or security risks present.

6
الملفات التي تم فحصها
300
الأسطر التي تم تحليلها
0
النتائج
1
إجمالي عمليات التدقيق
لا توجد مشكلات أمنية
تم تدقيقه بواسطة: claude

درجة الجودة

38
الهندسة المعمارية
100
قابلية الصيانة
87
المحتوى
31
المجتمع
100
الأمان
91
الامتثال للمواصفات

ماذا يمكنك بناءه

桌面应用开发者

重构现有 Avalonia 视图以使用语义化容器和共享样式，实现更简洁、更可维护的 XAML。

UI 架构师

使用 Zafiro 组件和主题组织在大型 Avalonia 代码库中建立一致的 UI 模式。

跨平台开发者

学习适用于 Windows、macOS 和 Linux 平台的现代 Avalonia 布局技术。

جرّب هذه الموجهات

基础容器选择 
我需要创建一个带标题和内容的设置部分。应该使用哪个 Zafiro 容器，如何使用？
图标集成 
展示如何使用 IconExtension 将 FontAwesome 图标添加到按钮和标题，并保持一致的样式。
样式提取 
我在多个 HeaderedContainer 元素中有重复的属性设置。帮助我使用 Classes 将它们提取为共享样式。
行为实现 
我需要处理 TextBox 的焦点管理而不使用代码后置。展示如何使用 Interaction.Behaviors 实现这一点。

أفضل الممارسات

  • 使用 DynamicResource 定义颜色和画刷以支持主题切换
  • 使用 EdgePanel 扁平化布局，避免嵌套的 Grid 和 StackPanel 结构
  • 将重复的布局提取为可重用的泛型 UserControl 组件

تجنب

  • 在视图 XAML 中直接使用硬编码的颜色或尺寸，而不是使用资源
  • 使用多层 Grid 和 StackPanel 创建深度嵌套
  • 将本应放在 ViewModel 中的简单逻辑使用 IValueConverter 处理

الأسئلة المتكررة

什么是 Zafiro.Avalonia？
Zafiro.Avalonia 是一个为 Avalonia 提供增强 UI 组件的库，包括语义化容器（如 HeaderedContainer 和 EdgePanel）以及通过 IconExtension 实现的图标管理。
如何将 Zafiro.Avalonia 添加到我的项目中？
安装 Zafiro.Avalonia NuGet 包。在 XAML 中使用 xmlns:zafiro='using:Zafiro.Avalonia' 或根据项目结构使用类似方式引用命名空间。
什么时候应该使用 Behaviors 而不是代码后置？
对可重用的 UI 逻辑（如焦点管理或动画）使用 Interaction.Behaviors。这可以保持 XAML 整洁，并允许独立测试 UI 行为。
语义化容器有什么好处？
语义化容器（如 HeaderedContainer）能清晰表达意图，减少 XAML 冗余，并通过 Classes 提供内置的样式挂钩以实现一致的主题。
如何切换浅色和深色主题？
在 Colors.axaml 中将颜色和画刷定义为 DynamicResource。在样式中引用它们。在运行时切换资源字典以切换主题，无需重建视图。
我可以将此技能与现有 Avalonia 项目一起使用吗？
可以。这些指南适用于任何 Avalonia 项目。您可以在重构现有视图时逐步采用 Zafiro 组件和共享样式模式。

تفاصيل المطور

المؤلف

sickn33

الترخيص

MIT

المستودع

https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/avalonia-layout-zafiro

مرجع

main

بنية الملفات

📄 behaviors.md

📄 components.md

📄 containers.md

📄 icons.md

📄 SKILL.md

📄 themes.md