AtomUI/docs/Desktop.Controls/Tour/TourToken.md

Tour Design Token

Tour 控件使用 TourToken（Token ID: "Tour"）作为组件级 Design Token，所有视觉属性均从全局 SharedToken 派生，不硬编码任何具体值。

---

Token 资源访问方式

在 AXAML 中使用组件级 Token：

{atom:TourTokenResource CloseBtnSize}
{atom:TourTokenResource PrimaryPrevBtnBg}
{atom:TourTokenResource TourBorderRadius}

在 AXAML 中使用全局共享 Token：

{atom:SharedTokenResource ColorPrimary}
{atom:SharedTokenResource ColorBgElevated}
{atom:SharedTokenResource ColorBgMask}

---

组件级 Token 一览

以下是 TourToken 定义的全部组件级 Token，按功能分组说明。

外观 Token

Token 名	类型	来源	说明
CloseBtnSize	double	SharedToken.FontSize * SharedToken.RelativeLineHeight	关闭按钮尺寸（宽高）
HeaderColor	Color	SharedToken.ColorTextHeading	标题文字颜色
TourBorderRadius	CornerRadius	SharedToken.BorderRadiusLG	Tour 气泡卡片的圆角半径

尺寸 Token

Token 名	类型	来源	说明
TourViewMinWidth	double	固定 200	Tour 内容视图（TourStepsView）最小宽度
TourViewMinHeight	double	固定 120	Tour 内容视图（TourStepsView）最小高度
IndicatorSize	double	固定 6	默认圆点指示器尺寸
PopupMarginToAnchor	double	SharedToken.SpacingXXS	Popup 与目标控件的默认间距

Primary 风格按钮 Token

Token 名	类型	来源	说明
PrimaryPrevBtnBg	Color	SharedToken.ColorTextLightSolid 透明度 15%	Primary 模式下"上一步"按钮背景色
PrimaryNextBtnHoverBg	Color	ColorUtils.OnBackground(SharedToken.ColorBgTextHover, SharedToken.ColorWhite)	Primary 模式下"下一步"按钮悬浮背景色

---

主题中使用的全局 SharedToken

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

颜色相关

Token 资源键	使用场景
ColorPrimary	Primary 风格下 ArrowDecoratedBox 背景色
ColorBgElevated	Default 风格下 ArrowDecoratedBox 背景色
ColorBgMask	Tour 遮罩层默认颜色
ColorTextLightSolid	Primary 风格下文字颜色、关闭按钮图标颜色
ColorTextHeading	Default 风格下标题颜色（通过 HeaderColor Token）
ColorFill	默认圆点指示器非活跃颜色
ColorWhite	Primary 风格下导航按钮前景色

间距相关

Token 资源键	使用场景
SpacingXS	TourStep 内部垂直间距、TourStepsView 操作按钮间距、导航栏水平间距
SpacingXXS	TourStepsView 内容与导航栏间距、圆点指示器项间距
PaddingXXS	TourStepsView 整体内间距

字体相关

Token 资源键	使用场景
FontWeightStrong	步骤标题字体粗细
IconSize	关闭按钮图标尺寸

阴影相关

Token 资源键	使用场景
BoxShadowsTertiary	Tour Popup 的投影阴影

动画相关

Token 资源键	使用场景
EnableMotion	Tour 默认动画开关

---

Token 对外观的具体影响

风格类型与 Token 映射

风格	ArrowDecoratedBox 背景	文字颜色	标题颜色	上一步按钮背景	下一步/完成按钮背景
Default	ColorBgElevated	默认前景色	HeaderColor（ColorTextHeading）	标准 Button	标准 Primary Button
Primary	ColorPrimary	ColorTextLightSolid	ColorTextLightSolid	PrimaryPrevBtnBg	ColorWhite + ColorPrimary 前景

指示器与 Token 映射

风格	非活跃圆点	活跃圆点
Default	ColorFill	ColorPrimary
Primary	PrimaryPrevBtnBg	ColorTextLightSolid

导航按钮悬浮态

风格	上一步悬浮	下一步/完成悬浮
Default	标准 Button hover	标准 Primary Button hover
Primary	PrimaryPrevBtnBg + 透明边框	PrimaryNextBtnHoverBg