拆分按钮操作
它把一个常用操作和与它相关的更多选项放在同一个分成两块的按钮里。
- 左边直接做事右边箭头还能选
- 一个按钮分成主要动作和更多选项
- 点文字执行点小箭头展开菜单
- 分裂按钮
- 主次操作按钮
- 带下拉的双区按钮
示例
尚无经验证的示例
这条词条暂时只提供平台定义和出处，不用临时动画冒充正式内容。
Web / iOS / Android 对照
Web需自己实现
桌面与移动端现代浏览器
Split Button
网页没有原生拆分按钮，需要把主按钮和菜单按钮组合，并分别处理名称和键盘焦点。
通常怎么做：使用相邻的 button 和菜单按钮，视觉相连但保持两个独立可访问控件。
iOS需自己实现
iOS / iPadOS
Split Button
苹果没有显示成两个分区的通用拆分按钮，Menu 可以配置主操作但外观与桌面拆分按钮不同。
通常怎么做：使用带 primaryAction 的 Menu，或把主操作与更多菜单分开放置。
Android原生支持
Material 3 1.5.0-alpha24 及以上
Split Button
Compose Material 3: SplitButtonLayout
当前接口属于 Material 3 Expressive 新增能力，版本低于要求时需要组合两个按钮。
使用规范
什么时候用
- 一个操作明显最常用，同时还要提供少量同类变体
什么时候别用
- 两个区域的关系不清楚，或次级菜单里包含无关操作
给 AI 的提示词
这条词条还没有经过验证的实现提示词。