简介
基于 shadcn/ui 与 GPUI Kit 的 Avalonia 主题与控件,浅色、深色逐像素校验。
Avalonia UIKit 是为 Avalonia 打造的一套主题与控件,基于 shadcn/ui 的 Nova 风格与 GPUI Kit。它由三部分组成:
UIKitTheme:面向 Avalonia 原生控件的Styles主题,提供 GPUI Kit 的 Default Light、Default Dark 以及其同捆的 36 套配色主题(Aurora、Ayu、Catppuccin、Tokyo Night 等),覆盖Button、TextBox、ComboBox、TabControl、Calendar、ListBox、TreeView、TableView、Menu、ToolTip等控件。主题会替换每个控件的ControlTheme,因此改变的不只是配色,还包括内边距、轮廓、内部布局、状态与动画。- 新控件:位于
uikit:命名空间,外观与主题一致。其中一些是 Avalonia 没有对应物的小型组件:Badge、TagLabel、Alert、Avatar、Breadcrumb、Kbd、Clipboard、Rating、EmptyState、Skeleton、StatusBar、DescriptionList、Stepper、Form、HoverCard、ShimmerText、Marker、Bubble和Message。另一些则实现了 Avalonia 控件做不到的事:带搜索框和多选的Select、带分组的ListView、虚拟化的Tree、支持多月份和区间的CalendarView,以及DateField、TimeField、Table、ColorSelect、Sidebar、Sheet、NotificationList、TitleBar等。每个控件在 组件 的 UIKit Controls 分组下都有自己的页面。 - 附加属性:为 Avalonia 原生控件补充功能,例如按钮的加载状态(
uikit:Buttons)、TextBox的校验与输入掩码(uikit:Inputs)、标签栏的前缀与后缀(uikit:Tabs)、GroupBox的页脚、Separator的标签等。它们只在应用主动设置时生效。
每个组件都会与参考渲染图比对:浅色与深色下的每个变体、尺寸与状态,以及逐帧的动效。颜色令牌由生成器生成,包括组件为各种状态推导出的颜色,因此没有任何颜色需要手工近似。
本库面向 NativeAOT 构建。它只使用编译绑定,并在构建时禁止反射;每次改动都会运行 NativeAOT 冒烟测试,在两种主题下渲染每个控件。
它不是什么
本库是对 Avalonia 控件的补充,而不是替代:应用仍然编写 Button、TextBox 或 ComboBox,只在需要额外能力的地方使用 uikit: 控件或附加属性。需要自带引擎或平台服务的组件不在范围内,例如代码编辑器、多光标或文本框内联令牌、图表、对话框、命令面板、系统通知,以及 SVG 或动图。停靠布局由 Dock.Avalonia 提供,AvaloniaUIKit.Dock 为其提供主题。