APP应用设计中,6组常见组件的区别与用法

发布时间:2020-01-16 05:30 | 浏览人次:浏览次数

在APP设计中,有许多组建有着相似的功能和用法。怎样恰当采取这些组件?这些组件中间有什么区别?一同看看作者的解读。
APP应用设计中,6组常见组件的区别与用法

在设计iOS版和Android版APP应用的过程中会牵涉到许多组件。不一样的场景采取的组件也不一致。这篇文章介绍六组常见的类似组件的区别和用法。

警示框(alert)和底端操作列表(action sheet)

标签栏(tab bar)和工具栏(tool bar)

底端动作条(bottom sheets)和菜单(menus)

选择器(selector)和底端操作列表(action sheet)

下拉菜单(drop-down menu)、底端操作列表(action sheet)及活动视图控制器(activity view controller)

一、警示框(alert)和底端操作列表(action sheet)

警示框是传达软件或设备某些状态的信息,并且常常需求会员来点击操作。

底端操作列表展示了与会员触发的操作直接有关的一连串选项,涵盖2个或以上的按钮。

普遍含有三种以上操作采取底端操作列表,一种或许两种操作采取警示框或底端操作列表。

比如:iOS源生邮箱,点击“更多”出现底端操作列表,展示四种操作选项。推特的退出登录只需求二次确认采取的是警示框。

对于警示框(alert)和底端操作列表(action sheet)的疑惑多用作二次确认上,比如微信的退出登录采取的是底端操作列表,而qq用的是警示框。

警示框(alert)和底端操作列表(action sheet)的区别于用法:

警示框注重提醒文字;从而表示提醒文字的内容优先级较高;

底端操作列表注重选择按钮;从而表示选择按钮的功能优先级较高;

按钮为0-两个时,建议采取警示框;

按钮为2-n个时,建议采取底端操作列表;

当然有的场景需求强阻断操作,比如提醒没有网络,版本升级,这种情形需求采取警示框;

具体情形可依据产品看待。比如微信退出登录用的是底端操作列表,阻断性不强,对会员的打搅限度较低;

二、标签栏(tab bar)和工具栏(tool bar)

标签栏:让会员在不一样的子任务、视图和模式中进行变换。

工具栏:摆放着用作操作当前屏幕中各对象的组件,在iPhone上,工具栏一直位于屏幕底端,而在iPad上则有也许出目前顶端

比如:app store中底端的标签栏和iOS源生邮件详情的底端工具栏

标签栏(tab bar)和工具栏(tool bar)的区别:

标签栏让会员在不一样视图变换,比如app store 点击游戏tab,进到游戏内容的界面,所以牵涉到视图变换是 标签栏。

工具栏是对当前界面内容的操作,比如iOS源生邮件点击工具栏中的卸载,则卸载当前邮件。所以牵涉到对当前页面的操作是标签栏。

三、底端动作条(bottom sheets)和菜单(menus)

底端动作条:1个从屏幕底端边缘向上滑出的1个面板,采取这种方法向会员展现一组功能。底端动作条提供3个或3个以上的操作需求提供应会员选择、并且不需求对操作有额外解释的情景。

底端动作条能够是列表样式的也可以够是宫格样式。

菜单:菜单是暂时的一张纸(paper),由按钮(button)、动作(action)、点(pointer)或许涵盖起码2个菜单项的其他控件触发。

每1个菜单项是1个离散的选项或许动作,并且可以影响到软件、视图或许视图中选中的按钮。

比如:微信公众号点击更多,出现底端动作条;微信对话列表长按出现菜单,点击退出出现的菜单

归纳底端动作条(bottom sheet)和菜单(menu)的区别:

假如只有2个或许更少的操作,或许需求详加描述的,能够思考采取菜单(Menu)或许提醒框代替。

长按操作,多数情形采取菜单(menu)

四、选择器和底端操作列表

对于互斥的单项选择而言,要采取选择器。选择器的好处是能够来回变换明确,时候由于选择器里面的内容滚动,所以能够容纳特别多的选项。

比如猎聘app前期版本,选择当前状态,采取的是底端操作列表。这样做是错误的。底端操作列表是对选项进行操作而不是选择。猎聘现版本已经改成了选择器。

五、下拉菜单(drop-down menu)、底端操作列表(action sheet)及活动视图控制器(activity view controller)

下拉菜单:常见适用作提供便捷入口。导流会员去做其他操作任务。

底端操作列表:展示了与会员触发的操作直接有关的一连串选项,涵盖2个或以上的按钮。

活动视图控制器:是1个暂时视图,当中罗列了一连串能够针对页面指定内容的系统服务和定制服务。

比如在支付宝中,点击“更多”出现下拉菜单。微信公众号首页点击“更多”出现底端操作列表。公众号历史文章中点击“更多”出现视图控制器。

下拉菜单、底端操作列表及动视图控制器的区别:

假如操作选项是提供下1个操作任务入口,则采取下拉菜单;

假如是对当前操作的共享则采取活动视图控制器;

假如是对当前页面内容的操作,则采取底端操作列表;

六、snackbar和toast

Snackbar 是一种针对操作的轻量级反馈机制,常以1个小的弹出框的方式,出目前手机屏幕下边或许桌面左下边。它们出目前屏幕所有层的更上方,包括波动操作按钮。

它们会在超时或许会员在屏幕其他地方触摸以后自动消失。Snackbar 能够在屏幕其他区域滑动关掉。当它们出现时,不会障碍会员在屏幕上的输入,并且也不支持输入。

屏幕上时候更多只能显示1个Snackbar。

Toast重要用作提醒系统消息。Toast 同 Snackbar 非常类似,可是 Toast 并不涵盖操作也不能从屏幕其他区域上滑动关掉,文本内容左对齐。

文章讨论的toast和snackbar重要是针对Android端,当然iOS设计规范中采取taost许多,采取snackbar我也仅仅在gmail中看到过。

归纳snackbar和toast的区别:

1.toast作为信息的反馈提醒,能够承载更多的提醒语。提醒语很长的同时建议用taost,snack bar 文案必须请求很端

2.假如在提醒信息里面嵌入操作,采取snackbar ,比如微信收藏,可在snack bar中参与操作按钮进行收藏标签分类

3.toast相对于snackbar而言,提醒强度偏低一些。

上述内容就是小编今天为您带来的关于《APP应用设计中,6组常见组件的区别与用法》的全部内容,希望能对您有所帮助,我们是一家成立于北京的IT外包公司,如果您有app软件或者微信小程序需要定制开发,不妨联系我们。
免责声明:本站部分文章转载自网络,不代表本站的观点和立场,不以盈利为目的。如有侵犯公司或个人权益,本站会第一时间删除文章。我们是一家北京app开发公司,欢迎咨询免费获取思维导图!

本文地址:https://appbj.cn/article/3043/

网友热评

暂无更多评论
思捷智联

思捷智联是一家2009年成立于北京的IT外包公司,我们致力于为企业提供app软件开发和微信小程序开发服务。公司成立10年来,我们为民政部、方正电子、神州数码、联想控股、壹基金、首钢集团、北京大学、北京师范大学、今麦郎、丰汇租赁、万通控股等上百家企业提供了IT外包服务。我们努力实现每一位客户的托付,为客户创造实在的效益,让您与梦想走得更近。

微信咨询

扫描微信二维码
同市场经理沟通需求

我们积累了丰富的移动互联网开发和运营经验,在开发中为客户提供更多帮助!
咨询热线:18612209195