课程咨询: 400-996-5531 / 投诉建议: 400-111-8989
认真做教育 专心促就业
大家在访问网页或者是使用APP软件的时候应该都遇到过弹窗提示这个情况吧,而今天我们就通过案例分析来了解一下,常见的弹窗设计类型都有哪些。
1、模态弹窗:警告/对话弹窗
功能:用来传达重要信息,告知用户当前发生的状况,通常情况下伴随着需要用户进行操作。
场景:一般用于承载非常重要的附加操作或警示信息,如退出、删除、清空
设计规范:对控件设计组成进行拆解。在IOS规范中,警告框包含的元素:1标题(必选)、2内容(可选)、3操作按钮(必选)。
除了系统控件外,我将这些运营、升级、活动弹窗都归类为对话弹窗,一般以好看的元素搭配吸引用户点击。此类弹窗需要特别注意需要保留关闭按钮,不可隐藏。
2、模态弹窗:操作列表
功能:是一个响应控件,一般在用户执行操作出现此窗口,提供更多的功能选择来完成当前任务的操作
场景:一般包含两个及以上的按钮,用于操作项多于三个的操作。与Alert大的区别就是位置:Alert出现在屏幕中心,但ActionSheet由屏幕底部向上滑出。
设计规范:用户进行危险性操作的按钮(如删除),应该使用红色高亮显示,并置于顶端。取消按钮始终在底端显示。避免滚动操作,若需要滑动操作,建议选择使用ActivityViews控件
在实际的应用中是否有按照规范应该使用Alert控件但是用了ActionSheet控件的呢?有的,例如相册删除和微信退出登录。
3、模态弹窗:活动视图
功能:用来解决ActionSheet的滚动问题
场景:多用于分享场景,如隔空投送、想分享到三方APP时
设计规范:支持横向滑动,在控件中选项为矩形块,现在也有了上面是矩形块下面是列表的形式
4、模态弹窗:浮出框
功能:可以在当前页面中进行更多的操作行为,显示/隐藏页面中的折叠信息。
场景:页位置呈现一些常用操作的快捷入口,浮动于顶部窗口、气泡,当用户点击某个控件或者某个区域时浮出的半透明或不透明的弹窗窗口
设计规范:Popover通常是由一个指向其出现位置的三角箭头和弹出窗口组成。Menus和Popover的区别只是没有三角指向。
5、非模态弹窗:提示框
功能:toast是安卓一个控件,现也用于IOS系统中。HUD是苹果控件,现很多安卓系统中也有用到类似的。是一种轻量级的弹窗反馈形式,常以小弹框的形式出现,持续1-2秒自动消失。占用屏幕空间小,不会打断用户操作、使用简单适用范围广。
场景:一般用于提示没那么重要的反馈信息,如刷新后的成功状态
设计规范:在安卓的规范中,toast只能出现在屏幕底部,只能放文字不能放图标,短时间会消失。但现在在使用中,很多APP都不限制出现的位置,在顶部出现toast,不干扰用户使用产品。但为了让用户形成习惯,好统一使用的位置。
6、非模态弹窗:底部弹窗
功能:Android特有的交互形式,在MD规范中,和toast归为一类,可以理解为加强版的toast,不同的是可以经过用户进行其他操作而消失。
场景:多用于撤销操作
设计规范:而SnakeBars是既支持用户操作,又会自动消失的控件。一般出现在屏幕底部。有纯文本提示与操作容器两种模式。
【免责声明】:本内容转载于网络,转载目的在于传递信息。文章内容为作者个人意见,本平台对文中陈述、观点保持中立,不对所包含内容的准确性、可靠性与完整性提供形式地保证。请读者仅作参考。更多内容请在707945861群中学习了解。