SuperAPI AI 工具集

avalonia-layout-zafiro

前端与建站

查看项目

更新于 10-16 05:51

技能介绍

用途:这是一份面向 Avalonia UI 的布局指南,目标是用 Zafiro.Avalonia 写出现代、清晰、易维护的界面,强调语义化容器、共享样式与尽量少的 XAML。

主要能力与内容:按主题分文件组织,可按需选择性阅读。themes.md 讲主题组织与共享样式,用于搭建或优化应用主题;containers.md 讲语义化容器,如 HeaderedContainer、EdgePanel、Card,用于组织视图与布局;icons.md 讲用 IconExtension 与 IconOptions 添加和定制图标;behaviors.md 讲 Xaml.Interaction.Behaviors 以及如何避免使用转换器;components.md 讲通用组件与避免嵌套。

使用方式:先判断当前布局问题属于哪个主题,只读相关文件,不必通读全部。文档给出整洁布局检查清单:使用语义化容器(例如用 HeaderedContainer 替代手写表头的 Border);避免冗余属性,把共享样式放在 axaml 文件中;用 EdgePanel 或通用组件扁平化布局、减少嵌套;图标用 {Icon fa-name} 配合 IconOptions 设置样式;用 Interaction.Behaviors 处理 UI 与逻辑的交互而非写代码隐藏文件;尽量避免转换器,优先用 ViewModel 属性或行为。

反模式:不要在视图中硬编码颜色或尺寸字面量;不要深层嵌套 Grid 和 StackPanel;不要在多处重复相同视觉属性(应抽成 Styles);不要用 IValueConverter 处理本属于 ViewModel 的简单逻辑。应使用 DynamicResource 取颜色与画刷,把重复布局抽为通用组件,并利用 EdgePanel 等 Zafiro.Avalonia 专有面板处理常见 UI 模式。

适用场景:使用 Avalonia 与 Zafiro.Avalonia 构建或重构桌面应用界面时,可作为布局与样式的约定参考。

限制:资料中未提供具体版本、依赖安装方式、许可与收费信息,也未给出完整代码示例;示例项目路径为本地路径 /mnt/fast/Repos/angor/src/Angor/Avalonia/Angor.Avalonia.sln,不构成通用安装步骤。