轻提示反馈

操作完成后短暂出现、过几秒自己消失的提示条。不打断用户,也不用点确定。

  • 下面冒出来一条字然后自己消失
  • 操作完弹一下那个小黑条
  • 一闪而过的提示
  • 吐司提示
  • 消息条
  • 浮动提示
  • 轻量反馈

示例

示例可交互

Web / iOS / Android 对照

Web需自己实现

桌面与移动端主流浏览器

Toast

也叫 Snackbar

Web 没有原生的轻提示元素,都是自己实现或用第三方库。但无障碍这块有官方规范:必须放进 aria-live 区域,否则读屏用户完全感知不到——这是最常被漏掉的一点。

通常怎么做:自己实现;无障碍上用 role="status"(普通提示)或 role="alert"(错误)。

iOS官方不推荐

iOS / iPadOS

Toast

也叫 HUD

iOS 原生没有这个组件,苹果的设计取向就是不用它——短反馈靠界面本身的状态变化表达,重要信息用 Alert,不主张用会自动消失的浮层。所以直接照搬安卓的做法在 iOS 上会显得不像原生应用。

通常怎么做:自己用浮层加定时器实现,或用 SwiftMessages、Toast-Swift 这类第三方库。更贴近平台习惯的做法是改用界面内的状态变化,比如按钮直接变成「已保存」。

Android原生支持

Android 手机 / 平板

Snackbar

也叫 Toast

Compose: Snackbar / SnackbarHost|系统级: android.widget.Toast

安卓有两个东西容易混:Toast 是系统级接口,不能交互、不能带按钮;Snackbar 是 Material 组件,可以带一个操作按钮(比如「撤销」)。Material 3 推荐用 Snackbar。

使用规范

什么时候用

  • 告诉用户某个操作成功了,但这件事没重要到需要打断他
  • 错误能自动恢复,用户不需要做任何事
  • 需要给一个「撤销」的机会(安卓用 Snackbar,Web 自己实现)

什么时候别用

  • 需要用户确认或做选择 → 用对话框,自动消失的东西承载不了决策
  • 错误必须被处理 → 用行内提示,自动消失的提示用户很可能没看到
  • 内容超过一行 → 几秒钟读不完
  • 在 iOS 上不加思考地使用 → 先看看能不能用界面内的状态变化代替

给 AI 的提示词

Web
做一个轻提示组件:从屏幕底部滑入,停留 3 秒后自动消失,同一时间最多显示一条,新的挤掉旧的。必须放在 aria-live="polite" 的区域里保证读屏可感知。