轻提示反馈
操作完成后短暂出现、过几秒自己消失的提示条。不打断用户,也不用点确定。
- 下面冒出来一条字然后自己消失
- 操作完弹一下那个小黑条
- 一闪而过的提示
- 吐司提示
- 消息条
- 浮动提示
- 轻量反馈
示例
示例可交互
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 的提示词
做一个轻提示组件:从屏幕底部滑入,停留 3 秒后自动消失,同一时间最多显示一条,新的挤掉旧的。必须放在 aria-live="polite" 的区域里保证读屏可感知。