什么是模态窗?
北京/UI设计师/5年前/930浏览
版权
什么是模态窗?
模态与非模态之间最大的区别就在于用户阻断
很多人在设计中会分不清楚模态和非模态是什么区别?笔者也曾有这样的疑惑,于是查阅了网上多篇文章,总结以下笔记:
先从两者的定义来看吧~
模态 Modal:模态控件要求必须进行操作(关闭or确认)之后才可以进行其他界面操作。
非模态 Modeless:非模态控件的出现不影响用户继续界面操作。
说白了它们之间最大的区别就在于用户阻断,与以下无关:
1.是不是会弹出透明遮罩层
2.控件外区域是否可点击消失
3.上面有没有操作项
然后我们来看具体的应用例子:
最常见的模态应用就是弹窗Dialog/操作栏action sheet以及浮层框Popover了,接下来咱们来挨个细说。
模态1. 弹窗Dialog

弹窗99.99%(对就是这么严谨)都属于模态,因为它的出现视觉比重较大,通常都用在必须用户进行重视的操作提示中。点击控件外区域,控件不消失。(也叫重提示并需要点击操作)
模态2.操作栏action sheet

模态3. 浮层框Popover

操作栏与浮层框同理,99.99%属于模态,虽然它不强行要求用户进行操作,但它的出现也阻断了用户进行别的操作。点击控件外区域,控件消失(限iOS,安卓可定制)。
而非模态就是我们熟悉的:提示框toast。
对,提示框100%属于非模态,非模态,非模态(分不清的事情说三遍啊),ios叫HUD,安卓叫toast和snackbar。都是安安静静地弹它的信息,用户可以选择忽略它,控件通常伴随2-3s的自动消失or滑动隐藏等交互。


另外在此想提一下,由ios专属控件演变而来的“模态卡片”,
模态卡片早在ios13的时候就被正式写入到 iOS 设计指南中。演变后可以更好同时适配安卓和ios同时使用的模态卡片,增加了滑动和隐藏的交互功能。


2
举报
声明
5
分享
相关推荐
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
你可能喜欢
相关收藏夹
登录注册
2登录即可同步推荐记录哦
5登录即可加入我的收藏
评论登录即可评论想法
分享分享













































































