工具提示

Tooltip 在指针停留在元素上、或键盘焦点落到元素上时显示一条提示,并向 辅助技术描述该元素:

ui.Button(c, "").Label("Share").Tooltip("Share with others").Children(func() {
	ui.Icon(c, share)
})

指针在元素上停留 0.6 秒后提示出现;当键盘焦点经由键盘落到元素上时,提示 立即出现。提示位于元素上方并水平居中,上方空间不足时位于下方;无论指针在 元素的哪个位置都是如此,与 Base UI 的做法一致。若一条提示消失后 0.4 秒内 又有下一条,则下一条会立即出现,例如指针沿工具栏移动时。指针离开时提示 消失;在元素上按下或点击、或按 Escape,会隐藏提示,直到指针离开再回来 或焦点同样移动为止:点击之后它不会再出现,菜单按钮打开菜单时也不会在其 旁边出现。对于相互嵌套的元素,显示最内层元素的提示,且一次只显示一条 提示。请为只显示图标的按钮,以及仅凭标签无法说明用途的元素添加提示。

提示使用主题的 Inverse 和 InverseText 颜色,即文字与背景反转配色, 除非主题另有设置(参见主题)。

不带外观

TooltipBase 在元素旁显示自定义提示,如同 Base UI 的 Tooltip:它按上述 规则决定提示何时出现和消失,fn 则为提示设置样式并构建其内容。提示位于 元素上方并居中,上方空间不足时位于下方;可用 AttachTo 将其放到其他位置, 用外边距与元素保持距离:

b := ui.Button(c, "").Label("Share").Description("Share with others")
b.Children(func() { ui.Icon(c, share) })
ui.TooltipBase(c, b, func(tip ui.Element) {
	tip.AttachTo(b, ui.AnchorRight, ui.AnchorLeft).Margin(0, 0, 0, 6)
	tip.Padding(4, 8).Radius(6).Background(ink).TextColor(paper)
	tip.Children(func() {
		ui.Text(c, "Share with others")
		ui.Text(c, "⌘S").TextColor(muted)
	})
})

它返回提示元素,提示未显示时返回 nil。指针会穿过提示。

无障碍

辅助技术把 Tooltip 的提示作为元素的描述来朗读,在其名称之后作为帮助 文本朗读,除非 Description 提供了其他描述。它把 TooltipBase 的提示 视为一个 tooltip,但不会朗读它:请为元素添加 Description 来说明提示的 内容。