您的位置:华清远见教育科技集团 >> iOS资料 >> iOS界面元素使用指南:控件(二)  
 
iOS界面元素使用指南:控件(二)
分享到:

圆角矩形按钮

按钮用于执行特定的操作。

外观和行为

按钮的圆角弧度与分组型表格的外角弧度一直。默认情况下,按钮的背景色是白色。

指南

使用圆角矩形按钮可以触发操作。在命名按钮的时候,可以参考以下方式:
    使用标题大写样式:除冠词、连词、介词外的词都大写,多四个词
    避免标题太长:太长的词读起来太卡,用户不容易理解。

你可以定义圆角矩形按钮内展示的标题或图片,也可以定义被按下后如何高亮反馈、标题的外观如何改变。

范围栏(Scope Bar)

范围栏可以允许用户定义搜索的范围,只有在和搜索栏配合时才可以使用。

外观和行为

当搜索栏出现的时候,范围栏紧挨着出现在它下面,除非你使用的是搜索显示控制器(search display controler)。当使用搜索显示控制器的时候,横屏视图模式下范围栏会出现搜索框的右侧。

用户可以点击范围栏上的按钮,切换搜索范围。其外观会和搜索框的设置一致。

指南

当对用户想搜索的范围有明确或典型的分类时,使用范围栏会很有帮助。例如:用户常常想只在邮件中的某一类中进行搜索。

搜索栏

搜索栏可以从用户获得文本,用做筛选的关键字。

外观和行为

搜索栏看起来像圆角的文本框。默认情况下,搜索按钮放在左侧。当用户点击搜索栏,键盘自动出现;当用户输入完毕后,输入的文本就按系统定义的那样处理。

另外,搜索栏还有一些可选的元素:

占位符文本。可以用它来描述控件的作用(例如“搜索”)或者提醒用户是在哪里搜索(例如“Youtube”“Google”)。

书签按钮。这个按钮可以为用户提供便捷的信息输入方式。例如,在Maps搜索模式下,用户可以用书签按钮访问标记的地点、近的搜索和联系人。

只有当文本框里不存在用户输入的或占位符以外的文字时,书签按钮才会出现。因为有了用户输入的文字后,这个位置会放一个清空按钮。

清空按钮。大多数搜索栏包含清空按钮,允许用户点一下就擦除搜索栏中的内容。

当搜索栏 任何非占位符的文字时,清空按钮就会出现。如果没有用户提供的或者非占位符,这个按钮就隐藏起来。因为没必要清空搜索栏的必要。

描述性标题。它会出现在搜索上上面。例如,它可以是一小段用于提供指引或介绍上下文的短语。

指南

用搜索栏来实现搜索功能,不要用文本文本框。

你可以在几种标准配色里选取适当的颜色,对搜索框进行自定义:

蓝色(与工具栏和导航栏的默认配色一致)。

黑色。

分段控件

分段控件是一条分割成多段的线,每一段都像是按钮,可以激活一种视图方式。

外观和行为

分段控件的长度由分段的数量决定,高度是固定的。每一段的宽度依比例而定,起决于分段的总数。当用户单击分段,可使其变成选中态。

指南

使用分段控件提供紧密相连又互斥的选项。

确保每一个选项都可以轻松触摸。为了将每一段尺寸维持在44×44像素以上,你需要限制段的数目。在iPhone上,分段控件至多可以分成5段。

尽可能让每一段的标题一致。因为所有段的宽度都是相同的,如果段上的文字标题长度、风格等不一致,会很难看。

避免同时使用文字和图标。分段控件上面可以放文字,也可以放图标,但只能选用一种。

滚动条(Slider)

滚动条帮助用户在容许的范围内调整值或进程。

外观和行为

滚动条包含滑轨和滑块,以及可选的图片,用于传达左右两端各代表什么。当用户拖拽滑块,值会实时地连续变化。

指南

用户可以使用滚动条精准地控制值,或者操控当前的进度。

合适的话,可以考虑自定义外观。例如,你可以这样做:

水平或者竖直地放置它。

自定义宽度,以适应程序。

定义滑块的外观,以便用户迅速区分滑块是否可用。

为滑轨两端添加自定义的图片,帮助用户理解滑轨的用途。

通常情况下,这些图片表示了大值和小值的意思。一个用来控制字体尺寸的滚动条可以在左侧放一个很小的字,在右侧放一个很大的字,为滑块在各个位置、控件的各种状态定制不同导轨的外观。

切换器(Switch)

切换器用于切换两种互斥的选择或状态。

外观和行为

切换器展示当前的激活状态,用户滑动空间可以切换状态。当然,按也可以。

指南

在表格视图中展示两种简单、互斥的选项,比如是/否,开/关。所选的两个值要让用户可以预测,这样用户能知道切换后的效果。

你可以使用切换控件改变其他控件的状态。根据用户的选择,新的表单项可能会出现或消失,激活或失活。

文本框(Text Field)

文本框用于接受一行用户的输入。

外观和行为

文本框有固定的高度。用户按一下文本框后,会出现键盘。当用户按下回车键,文本框会按照程序预设的方式处理输入的字符。

指南

使用文本框来从用户获得少量信息。在用户决定使用文本框前,想想是否有别的控件可以让输入变得简单,比如拾取器或者列表。

可以自定义文本框,帮助用户理解如何使用它。例如,你可以在文本框某一侧放上定制的图片,或者添加系统提供的按钮(比如书签按钮)。一般而言,可以把提示放在文本框左半部,把附加的功能放在右半部。

在右端放置清空按钮。当清空按钮出现时,单击它可以清空文本框的内容。

在文本框里放置提示语,帮助用户理解意图。比如“姓名”“地址”。如果没有其他的文字可放,就可以在这里放置提示语做占位符。

根据要输入的内容选择合适的键盘样式。键盘是主要的输入手段,随着用户的语言而变。例如,你也许想让输入URL、PIN或电话号码变简单。iOS提供几种不同的键盘,每一种都是为输入特定的内容而优化。

 更多相关文章

·ios界面元素使用指南:控件(一)
·iOS界面元素使用指南:模态视图
·iOS界面元素使用指南:操作列表
·iOS界面元素使用指南:警告框
·iOS界面元素使用指南:内容视图(二)