Action sheet 操作面板

/AK-shun SHEET/ · noun · 浮层类模式 · #060

一小组动词清单,只回答一个问题:「你想对它做什么?」危险操作穿一身红。iPhone 上它原来从底部滑出,最下面单独放“取消”;iOS 26 起,它通常从你点的按钮处弹出,和 iPad 一样,没有“取消”,点别处就关掉。

Action sheet(操作面板) UI 模式示例:CatchUI 图鉴标本

你可能会这样叫它

  • “iPhone 底部弹出的选项菜单”
  • “带红色“删除”的选项列表”
  • “最下面有“取消”的菜单”
  • “点“…”后弹出的选项”
  • “底部选项弹窗”

……它的名字是 操作面板(Action sheet)。

常见问题

iPhone 的分享菜单是 Action sheet 吗?

不是。分享菜单叫分享面板(Share sheet,UIActivityViewController),是系统提供的一屏 App 和操作。Action sheet 是你自己的 App 针对某一项弹出的一小组选项:iOS 26 以前从底部升起、最下面单独放“取消”,iOS 26 起通常从你点的按钮处弹出。

代码里叫什么

SwiftUI.confirmationDialog()
UIKitUIAlertController(preferredStyle: .actionSheet) popoverPresentationController?.sourceItem 在 iPhone 上也要设置来源:iOS 26 起面板从来源处弹出,没有“取消”
Jetpack Compose / Android 没有 Action sheet,通常用装着操作列表的 ModalBottomSheet
FlutterCupertinoActionSheet showCupertinoModalPopup()
Web (HTML) 没有原生元素,通常是固定在底部、装着按钮列表的 <dialog>

复制给 AI 编程工具

为这一项加一个操作面板(Action sheet):点“…”后,一小组操作从底部滑出,背后压暗;危险操作(删除)用红色,底部单独放一个“取消”按钮。选中任一操作、点“取消”、点暗色背景或按 Esc 都会关闭。只放跟这一项有关的操作,关闭后焦点回到“…”按钮。

用 AI 写界面时该怎么说:UI 用词指南(英文)→

相关模式

传一张截图,抓住这个模式 →

学会从视觉线索认出 UI 模式(英文)