AtomUI/docs/Desktop.Controls/Statistic/StatisticToken.md

Statistic Design Token

Statistic 控件家族使用 StatisticToken（Token ID: "Statistic"）作为组件级 Design Token。Token 较为精简，主要控制标题和内容的字体大小。所有颜色值均直接引用全局 SharedToken。

---

Token 资源访问方式

在 AXAML 中使用组件级 Token：

{atom:StatisticTokenResource TitleFontSize}
{atom:StatisticTokenResource ContentFontSize}

在 AXAML 中使用全局共享 Token：

{atom:SharedTokenResource ColorTextDescription}
{atom:SharedTokenResource ColorTextHeading}
{atom:SharedTokenResource SpacingXXS}

---

组件级 Token 一览

以下是 StatisticToken 定义的全部组件级 Token。

字体 Token

Token 名	类型	来源	说明
TitleFontSize	double	SharedToken.FontSize	标题（Header）字体大小，默认等于全局基础字号（14px）
ContentFontSize	double	SharedToken.FontSizeHeading3	数值内容字体大小，默认等于 Heading3 字号（24px），使数值成为视觉焦点

---

主题中使用的全局 SharedToken

除组件级 Token 外，Statistic 的 ControlTheme 还直接引用了以下全局 SharedToken：

颜色 Token

Token 资源键	使用场景
ColorTextDescription	标题（HeaderPresenter）的前景色，使用描述性文本色（较浅，突出数值）
ColorTextHeading	数值内容（ContentForeground）的默认前景色，使用标题文本色（较深，作为视觉焦点）

间距 Token

Token 资源键	使用场景
SpacingXXS	RootLayout（标题与内容之间）的默认间距
Spacing	加载态下（IsLoading=True）RootLayout 的间距（增大间距给骨架屏更多空间）
SpacingXXS	ContentLayout（前缀、数值、后缀之间）的间距

遮罩/背景 Token

Token 资源键	使用场景
ColorBgMask	加载骨架屏（Skeleton）的遮罩背景色

动画 Token

Token 资源键	使用场景
MotionDurationVerySlow	StatisticCountUp 数值递增动画的时长

---

Token 对外观的具体影响

字体层次结构

Statistic 通过字体大小的对比建立视觉层次：

区域	Token	默认值	视觉效果
标题	TitleFontSize	14px（FontSize）	较小字号，描述性文字
数值	ContentFontSize	24px（FontSizeHeading3）	较大字号，视觉焦点

颜色层次结构

区域	SharedToken	视觉效果
标题	ColorTextDescription	较浅的灰色调，提供语义上下文但不抢夺注意力
数值	ColorTextHeading	较深的标题色，作为视觉焦点突出显示

前缀/后缀中图标的尺寸

模板中前缀/后缀区域内的 Icon 控件，其 Width 和 Height 均绑定为 StatisticTokenResource ContentFontSize（即与数值字号一致），确保图标与数值文字视觉对齐。同时图标的 FillBrush 和 StrokeBrush 继承自 ContentForeground，确保颜色一致性。

各控件的 Token 继承关系

StatisticToken (组件级 Token 定义)
├── AbstractStatisticTheme.axaml (基类主题，引用 TitleFontSize / ContentFontSize / SharedToken 颜色)
│   ├── StatisticTheme.axaml (Statistic 主题，基于 AbstractStatisticTheme，增加间距)
│   └── TimerStatisticTheme.axaml (TimerStatistic 主题，基于 AbstractStatisticTheme，使用独立模板)
└── StatisticCountUpTheme.axaml (StatisticCountUp 主题，直接引用 ContentFontSize / ColorTextHeading)

所有三个控件（Statistic、TimerStatistic、StatisticCountUp）共享同一个 StatisticToken 作用域，通过 this.RegisterTokenResourceScope(StatisticToken.ScopeProvider) 注册。这意味着修改 StatisticToken 中的 ContentFontSize 会同时影响所有三个控件的数值显示大小。