首页 > 开发 > 设计 > 正文

[ISUX转译]iOS7人机界面指南-UI元素(上)

2017-09-15 09:33:20  来源: 网友分享

xa0

译者注:

1. 本次主要翻译了iOS Human Interface Guideline的Part 4-UI Element的前半部分,包括栏(Bars)和内容视图(Content Views)。Part 4-UI Element的下半部分控件(Controls)、临时视图(Temporary Views)以及Part 5将在下次更新中放出。

2. 我们感到非常抱歉,由于苹果文档在不停地变化和更新,本次放出的内容也许不能与最新版文档相匹配,我们会在随后进行修正。

3.xa0如您在阅读中发现任何疏漏,欢迎您提出宝贵的意见和建议,感谢。

重要:这是一份针对API或其它相关技术开发而准备的预备文档。尽管文档在专业精确程度上已经过多次审查,它仍不是最终版本。文档仅供已注册苹果开发者计划的开发者使用。苹果提供这份文档的目的,是帮助开发者根据文档来规划自身应用的开发技术与界面设计。这些信息将可能发生变化,您的应用也应当根据最新的操作系统与最终文档进行相应的调整。该文档可能会由于API与相关技术的发展而更新版本。

栏(Bars)

状态栏(Status Bar)

状态栏展示了关于设备及其周围环境的重要信息。

1

你可以将状态栏风格设计为全应用统一,或者为应用里不同的视图定义不同的状态栏风格。你可以通过阅读UIApplication Class ReferenceUIViewController Class Reference来分别了解更多关于UIStatusBarStyle常数和preferredStatusBarStyle属性的内容。

外观和行为

状态栏是透明的。不管设备处于横屏还是竖屏,状态栏始终固定在整个屏幕的上边缘,承载用户所需要的如网络连接,时间,电量等信息。

指南

尽管你不会像使用其它UI元素一样编辑状态栏,理解它在应用中的功能仍然很重要。

隐藏状态栏时请慎重。由于状态栏是透明的,通常情况下不需要隐藏它。始终隐藏状态栏意味着用户必须退出你的应用才能知道现在的时间,或者了解是否当前环境下是否有Wi-Fi连接。

在用户全屏观看媒体时,考虑隐藏状态栏以及所有页面UI。当你这么做的时候,请确保用户在轻击屏幕时即可重新唤起状态栏以及相关的UI。而除非你有充分的理由,否则最好不要重新定义一个手势来让用户唤起状态栏,因为用户不会发现,就算发现了也难以记住。

不要创建自定义状态栏。用户依赖系统默认状态栏的一致性。就算你在应用中隐藏了它,也优于定制一个新的UI来代替它。

为你的应用选择配色协调的状态栏颜色。内容是深色的状态栏的在浅色应用中效果出色,而相应的浅色状态栏则更适用于颜色较深的应用。

千万千万,避免在状态栏后面叠加会分散注意力的内容。尤其是,你不能让用户觉得轻击状态栏之后可以获取内容或激活你的应用中的控件。

在适当的时候展示网络活动指示器(network activity indicator)。这可以提醒用户当前远程网络连接(lengthy network access)正在工作。更多详情请参考本章第三节控件(Control)部分的Network Activity Indicator.

导航栏(Navigation Bar)

导航栏能够实现在应用不同信息层级结构间的导航,有时候也可用于管理当前屏幕内容。

2

导航栏包含在导航控制器(navigation controller)中,该控制器是一个用于管理自定义视图中信息层级展示形式的编程对象。想要了解如何在代码中定义你的导航栏内容,请参考Navigation ControllersNavigation Bars.

外观和行为

导航栏通常位于屏幕的上方,状态栏正下方。导航栏居中展示当前屏幕或当前视图的标题。当用户在信息层级中穿梭时,也可以通过点击导航栏中的返回按钮,或轻扫屏幕的边缘来回到上一层。另外,用户可以使用导航栏上相应的控件来管理当前的屏幕内容。

导航栏是半透明的,上面所有的控件都是无边界的(borderless)。

在iPhone上,导航栏始终与屏幕等宽以通栏显示,当用户改变屏幕方向时,导航栏的高度也将自动发生改变。

指南

你可以用导航栏在不同视图间提供导航,或在上面放置管理当前视图内容的相关控件。

使用当前视图的标题作为导航栏标题。若觉得标题冗余,你也可以将标题留空。

当用户到达一个新的层级,你需要做以下两件事: