03 弹窗的类型
1. 模态&;非模态
弹窗可以分为模态弹窗和非模态弹窗两种类型, 这两个概念来源于开发人员的术语。
当打开一个模态弹窗后,它所属页面的进程被打断了,必须等用户处理完毕模态弹窗后,才能够回到刚才正在进行的页面。
举个例子,你准备删除一个重要的文件,系统弹出一个弹窗,问你确认要删除吗?这个你时候你必须下一个明确的指令,选择删除或者不删除,然后你才可以离开当前界面,我们可以简单的把模态弹窗理解为用户不得不做的选择。
再来看非模态弹窗,非模态弹窗允许用户在不打断当前页面的同时,去处理其他任务,举个例子,设计师们最熟悉不过的PS,你可以同时调用多个弹窗去更改画面参数,因为艺术创作是一个多线过程,艺术家可以想到什么参数就改变什么参数。
模态和非模态只是一个比较概括性的概念,而且不同的规范里可能对相似的某一类弹窗的称呼完全不同或者有轻微差异,接下来我分别根据 Microsoft-Fluent UI、Google- Material Design、IOS 规范中拿出一些比较有代表性的弹窗类型详细讲一讲。
2. 典型弹窗
1)Actionsheet
类型:模态弹窗
参考规范:IOS Design
简介:Action sheet一次展示和当前语境相关的两个或者更多的动作,非必要不要展示太多的动作选项,以及避免在动作列表中使用滚动条。
关键点:
- 动作按钮: 把危险性选择 (如清空、删除)放在最上面, 把取消按钮置于底部。
- 避免使用太多动作按钮让Action Sheet列表产生滚动条。
- 毁灭性操作需要在视觉上突出。
2)Modal