原文地址：http://isnofate.com/human_interface_guidelines_for_ios7_ui_elements_content_views/
活动菜单 (Activity)
每个活动菜单表示一个系统提供的或自定义服务——通过活动视图控制器 (Activity view controller) 来作用于某些特定的内容.
API NOTE 想了解如何在代码中定义标签栏, 请参考 UI Activity Class Reference; 想了解如何把活动视图控制器整合进你的应用, 请参考 Activity View Controller.
活动菜单是:
- 一个可定制的, 用以指代应用可以执行的服务 (当用户使用app时) 的对象.
- 一个看起来像是标签栏按钮的图标
用户可在活动视图控制器中点击活动菜单图标来触发一项服务. 作为回应, 活动菜单会立刻执行该项服务, 如果该项服务相对复杂, 它会在执行服务前询问更多信息.
使用活动菜单让用户使用你应用 (可执行) 的自定义服务. 请注意, iOS 已提供了若干内置的服务, 例如打印, Twitter, 发信息以及AirPlay. 你不需要再创建这些 (执行内置服务的) 活动菜单.
为你的服务设计一套线框化 (streamlined) 的模板图像 (Template image). iOS 会把模板图像做为遮罩来生成用户所看到的最终图标. 如果想让通过模板图像生成的最终图标有不错的效果, 请遵循以下原则:
- 使用黑色或者白色, 配合适当的 alpha 透明度
- 不要使用阴影
- 使用抗锯齿处理
活动菜单上的模板图像应该在区域里居中显示, 尺寸大约在 70 x 70 像素左右 (高分辨率下).
制作一个可以简练地描述服务的活动菜单标题. 标题将会出现在活动菜单图标的下方. 短标题通常效果最好, 因为它在屏幕上的显示效果更好并且更容易本地化. 如果你的标题文字过长, iOS会先将文本缩小, 仍然过长的话则会被截断. 一般而言, 最好能避免在活动标题中提及你的公司或产品名称.
活动视图控制器 (Activity View Controller)
活动视图控制器呈现为一个临时视图 (transient view),, 列出了可以作用于页面特定内容的系统服务和自定义服务.
API NOTE 想了解如何在代码中定义活动视图控制器, 请参考 UIActivityViewController Class Reference; 想了解如何设计一个提供自定义服务的活动视图, 请参考 Activity.
活动视图控制器是:
- 显示了一系列可配置的让用户可操作特定内容的服务
- 在iPhone中用动作表单 (action sheet) 显示, iPad中, 用弹出层 (popover) 显示
活动视图控制器提供给用户一系列服务让他们可以用一些特定的方式操作内容. 这些服务可以是系统内置的, 例如复制, Twitter 和打印, 也可以是自定义的. 活动视图控制器的一个通常用法就是让用户把他们选中的内容复制到他们的社交媒体账户上.
不要创建一个自定义按钮来触发活动视图控制器. 用户更习惯点击分享按钮后使用系统提供的服务. 你应该学会如何更好地利用用户这一既定习惯, 而不是强迫他们以一种全新的方式来完成同样的事情.
确保控制器中的操作适用于当前场景. 你可以适当地在活动视图控制器中增减系统操作, 或增加自定义操作. 例如, 如果你不希望用户打印某张图片, 你可以把打印功能从控制器中删除.
NOTE 你不能改变系统默认服务在控制器中的顺序. 同时, 所有系统内置服务都应出现在自定义服务之前.
容器视图 (Collection View)
容器视图用于管理一系列有序的项, 并以一种自定义的布局来呈现它们.
API NOTE 想要了解如何在代码中定义容器视图, 请参考 Collection View Programming Guide for iOS.
容器视图是:
- 包含可以在视觉上区分各项的子集的可选视图 (optional views), 以及装饰元素, 例如自定义背景.
- 支持布局组件间的自定义过场动画 (当用户插入, 移动以及删除项目时, 容器视图会提供默认的动画效果)
- 支持额外定义手势识别来执行自定义操作. 容器视图在默认的情况下可以识别轻击 (选中某项) 和长按 (编辑某项)
容器视图允许用户使用某种方式来查看和操作一系列不适合以列表形式呈现的项. 由于容器视图的布局不是一个严格的线性布局, 因此尤其适合用来展示一些尺寸不一致的项.
容器视图支持广泛的自定义行为, 所以我们要尽量避免把心思都放在激进新颖的设计上. 容器视图是用来帮助用户更好地完成任务的, 而其本身并不是用户体验的焦点所在. 以下指南可以帮助你设计出很赞的容器视图:
可以使用表格视图 (Table View) 的时候, 不要使用容器视图. 有时候用户会觉得以列表呈现的信息更容易阅读和理解, 例如将文本信息放在滚动列表中的时候, 用户阅读和处理起来会更为简单和高效.
让用户更容易选中目标项. 如果在容器视图中让用户感到点击项目非常困难, 他们是不会愿意把你的应用用下去的. 跟所有用户可以点击的 UI 对象一样, 请确保你的容器视图中每一个项的最小点击区域有 44 × 44 点距 (points).
当你要让整个布局进行动态变化时, 请务必谨慎. 容器视图允许你在用户浏览和操作项的时候调整视图的布局. 但当你决定调整它的时候, 请确保这个动态变化是有意义并且容易理解的. 没有明确目的而贸然改变容器视图的布局会让用户对应用留下难用、不符合预期等负面的印象. 更有甚者, 如果用户此时关注的项在变化中消失了, 用户会觉得这个应用超出了他们的控制能力.
容器视图控制器 (Container View Controller)
容器视图控制器采用自定义的方式来管理和呈现它的一系列子视图或视图控制器. 系统定义的容器视图控制器包括标签栏视图控制器 (Tab bar view controller), 导航视图控制器 (navigation view controller) 和对分视图控制器 (split view controller). 想了解更多关于这些元素请看 Tab Bar, Navigation Bar 和 Split View Controller (iPad Only).
API NOTE 想要了解如何在代码中定义容器视图控制器, 请参考 UIViewController Class Reference.
容器视图控制器没有任何预设的外观或者行为.
用容器视图控制器来呈现内容, 用户可以通过它以自定义的方式进行导航.
先问问你自己是不是必须用到容器视图控制器. 用户会更习惯诸如对分视图, 或者是标签栏视图这类标准容器视图控制器的外观和行为. 你必须确保自定义容器视图的优点大于用户不认识或不能快速理解如何使用的弊端.
确保你的容器内容控制器在横屏与竖屏模式都可用. 你的容器视图控制器无论在横屏还是竖屏中, 体验都应该是一致的.
一般来说, 避免太过花哨的转场动画. 当你使用故事板 (storyboard) 来设计你的自定义视图控制器时, 为内容视图之间过渡定义转场动画并不难. 但绝大多数情况下, 这些花哨的转场动画会让用户分心, 让他们忘记了当前要做的事, 还可能降低你的应用整体的美感.
图片视图 (Image View)
图片视图用以展示一张单独的图片或者一系列动态图片.
API NOTE 想要了解如何在代码中定义图片视图, 请参考 image views.
图片视图是:
- 没有任何预设的外观, 同时在默认状态下它不支持用户的交互行为.
- 可以检测图片本身及其父视图 (parent view) 的属性, 并决定这个图片是否应该被拉伸、缩放、调整到适合屏幕的尺寸, 或者固定在一个特定的位置.
在 iOS7 里, 包含了模版图片 (template image) 的图片视图会把当前的主色调 (tint color) 应用到图片上.
请务必确保图片视图中的每一张图片都保持相同的尺寸和比例. 如果你的图片尺寸各不相同, 图片视图将会逐一对它们进行调整; 而当你的图片比例不一, 渲染的时候很可能会出错.
地图视图 (Map View)
地图视图呈现地理数据, 同时支持系统内置地图应用的大部分功能 (如下图所示).
API NOTE 想要了解如何在代码中定义地图视图, 请参考 Map Kit Framework Reference.
地图视图是:
- 通常以标准地图, 卫星图像, 或两者结合的形式来展示地理区域.
- 可以展示标注点 (单个标注点) 和描绘路径 (绘制路径或者二维区域)
- 支持程序自动或用户控制的缩放和平移操作
利用地图视图可以给用户提供一个可交互的地理区域视图. 如果你在开发一个导航类应用 (routing app), 可以使用地图视图来像用户展示路线 (想了解更多关于如何创建导航应用, 请参考 Routing).
一般来说, 允许用户与地图进行交互. 用户习惯了在系统内置地图中进行交互, 因此他们会有预期, 能在你所提供的地图中进行类似的行为.
按一贯的标准使用标注颜色. 地图标注是用来显示地图上有意义的位置. 因为用户习惯了内置地图的各个标注的颜色, 所以最好避免在你的应用中重新定义这些颜色的含义. 定义颜色时, 请遵循以下这些标准:
- 红色表示目的地
- 绿色表示起点
- 紫色表示用户指定的地点 (User-Specified Point)
页面视图控制器 (Page View Controller)
页面视图控制器使用滚动或翻页的切换效果, 来管理多页的内容. 翻页效果在 iOS7 模拟器上的演示:
API NOTE 想要了解如何在代码中定义页面视图控制器, 请参考 Page View Controller.
页面视图控制器是:
- 滚动效果下没有默认的外观翻页效果的控制器可以在两页中间增加书脊 (book spine) 的效果
- 根据指定的风格为当前页切换到下一页增加动画使用滚动效果的时候, 当前页面将滚动到下一页; 而使用翻页效果时, 页面上会出现一个模拟实体书或笔记本翻页效果的翻页动画.
使用页面视图控制器来展示那些线性的内容 (例如一篇故事的文本), 或者是一些可以被自然地拆分成块的内容 (例如日历).
如有必要, 自定义一种让用户可以用非线性方式切换内容的方法. 页面视图控制器让用户从一页移动到前一页或者后一页, 而并不支持用户在并不相邻的页面间快速切换. 如果你希望在页面视图控制器中展示一些非线性的内容——比如说字典, 或者书籍的目录——那么你就需要自定义一种方式, 让用户可以随意地到达不同的内容区块.
弹出层 (Popover) (iPad Only)
弹出层是一个临时视图 (transient view), 当用户点击控件或者屏幕上某个区域时就会显露出来.
API NOTE 想要了解如何在代码中定义弹出层, 请参考 UIPopoverController Class Reference 和 Popovers.
IMPORTANT 弹出层仅适用于 iPad 应用.
弹出层是:
- 一个悬停在屏幕内容上方的独立视图
- 通常显示一个箭头, 用以指出让它出现的地方
- 用一个半透明的背景模糊了其背后的内容
- 包含各种各样的对象和视图, 比如:
- 表格, 图片, 地图, 网页或者自定义视图
- 导航栏, 工具栏以及标签栏
- 作用于当前应用视图的控件或者对象
(默认情况下, 表格视图, 导航栏, 以及工具栏在弹出层中要使用透明背景以便适配弹出层的模糊效果.)
在 iPad app 中, 操作列表常常出现在popover中.
你可以使用弹出层来:
- 展示与焦点对象或者选中对象相关的附加信息或者项目列表.
- 展示一个包含选项 (与屏幕上内容密切相关) 的简短列表的动作选单.
- 对分视图模式的应用在竖屏模式下显示左侧面板的内容. 如果这样做的话, 提供一个有适当标题的按钮来显示弹出层–最好是在导航栏或者工具栏上添加按钮, 或者允许用户通过滑动手势来隐藏或者显示弹出层.
避免提供一个 “关闭弹出层(dismiss popover)” 的按钮. 当不再需要它时, 弹出层应当自动关闭. 要决定什么时候不再需要弹出层, 可考虑以下场景:
| 如果弹出层 | 那么这样处理 |
|---|---|
| 提供影响主视图的选项, 但未作为检查器 (inspector) 使用时 | 当用户作出选择或点击任何弹出层 (及其所含控件) 之外的区域则立刻关闭之. |
| 作为检查器使用时 | 当用户点击任何弹出层 (及其所含控件) 之外的区域则立刻关闭之.但在这个场景下, 不要在用户调整选项后立即关闭弹出层, 因为用户可能还要调整其他选项, 或者修改当前选项的属性. |
| 用作开启一项任务 | 只有当用户通过点击弹出层上的按钮表示他们完结或放弃了任务时才将之关闭, 例如 “完成 “或” 取消 “按钮.在这个场景下, 用户点击弹出层边框之外的区域不要将之关闭, 因为用户是完成还是确定放弃任务可能很关键. 除此之外, 也可以在用户点击弹出层边框之外的区域时保存他们的输入内容, 就像点击 “完成” 按钮那样. |
一般来说, 当用户点击弹出层边框以外地方时, 你要保存用户的 “劳动成果”. 不是每个弹出层都需要明确解除, 所以用户可能会错误地解除它们. 只有当用户点击取消按钮时, 你才应当放弃它们在弹出层中的 “劳动成果”.
尽可能直接地让弹出层箭头指向那个显示它的元素. 这可以帮用户记住弹出层的来源, 以及相关的任务或对象.
确保用户在使用弹出层时不需要再查看下面的内容. 弹出层会遮挡它下面的内容, 并且用户不能把弹出层拖放至其他位置.
确保在屏幕上一次只展示一个弹出层. 你不能同时展示一个以上的弹出层 (或者外观和行为类似弹出层的自定义视图). 特别是, 应当避免层叠或多级弹出层同时展示, 即在一个弹出层中叠加另一个.
不要在弹出层上展示模态视图. 除外警告窗口外, 没有什么是必须要显示在弹出层之上的.
可能的话, 尽量允许用户点击一次就能关闭一个弹出层并能打开新的一个弹出层. 尤其是在栏上的多个按钮都能各自打开一个弹出层的情况下, 这样可以避免用户额外的点击.
避免创建区域过大的弹出层. 弹出层的尺寸不应当超过整个屏幕, 应该足以显示其内容和指明自身出处.
理想状况下, 弹出层的宽度最小不能少于 320 点距, 最大不能超过 600 点距. 弹出层的高度没有被限制, 所以你可以用它来展示长长的项目列表. 虽然如此, 一般在弹出层开启任务或用作动作表单时还是要避免滚动. 注意系统会对弹出层的高度和宽度进行调整, 以使之更好地适应屏幕的尺寸.
在弹出层中使用标准的 UI 控件和视图. 一般来说, 包含标准控件和视图的弹出层足够美观, 也有利于用户的理解.
确保自定义的弹出层的仍然看起来像个弹出层. 虽然使用 UIPopoverBackgroundView 的 API 可以简单地自定义弹出层的各种视觉外观, 避免设计出一个用户无法识别的弹出层. 如果你对弹出层外观更改过多, 用户就不能利用一贯的经验来帮他们理解如何使用你的应用.
如果合适, 在弹出层保持可见时可以改变其尺寸. 如果在弹出层展示同一信息简化和扩展两种视图切换时, 会需要对应改变其尺寸. 当需要调整弹出层尺寸时, 最好的办法是用动画过渡, 这样可以避免给人一个新弹出层替代旧的的错觉.
滚动视图 (Scroll View)
滚动视图方便用户浏览尺寸超出其边界的图片 (下图无论是长度还是宽度都超出了滚动视图的区域).
API NOTE 想要了解如何在代码中定义滚动视图, 请参考 Scroll Views.
滚动视图是:
- 没有任何预设的外观
- 在首次展现或用户与之交互时, 滚动指示器 (scroll indicator) 会暂时闪现
- 响应速度和对各方向手势的识别都应当让用户感到自然
当用户在视图中拖拽内容, 内容随之滚动; 当用户轻扫屏幕时, 内容将快速滚动, 直到用户再次触摸屏幕或内容已经到达底部时才停止. - 同样可以在分页模式 (paging mode) 中起作用, 在此模式下用户可以通过拖拽和轻扫等手势来浏览某些应用特定的页面或内容.
你可以用滚动视图让用户在固定的空间内浏览大尺寸或大量的视图.
适当地支持缩放操作. 如果你的应用需要如此, 可以让用户通过捏合或双击来放大或者缩小滚动视图. 而若是支持了缩放操作的话, 你还应当设定在当前任务下合适缩放的最大值和最小值. 例如, 允许用户把文章的放大到一个字符就充满整个屏幕的话, 那对他们阅读体验没有任何好处.
在分页模式滚动视图中, 可以考虑使用分页控件 (page control). 当你想要展示分页、分屏或者分块的内容, 最好使用页面控件告诉用户当前内容一共有多少块, 以及他们当前浏览的是哪个.
当你在滚动视图中使用分页控件的时候, 最好禁用同一方向的滚动指示器. 这样可以让用户把注意力集中到分页控件这个唯一且清晰的内容分块方式上. 想要了解更多如何使用分页控件, 请参考 Page Control.
一般来说, 一次只展示一个滚动视图. 如果在一屏中同时存在不止一个滚动视图, 由于用户滚动屏幕时动作幅度经常都会很大, 所以很难避免误操作到同屏中相邻的滚动视图. 如果你确实要在同屏中放两个滚动视图, 可以考虑给他们设定不同的滚动方向, 来避免一个手势滚动两个视图. 例如, iPhone 上的股票应用在竖屏时纵向滚动上半部分会展示各股票报价, 横向滚动下半部分时则展示该公司的特定信息.
对分视图控制器 (Split View Controller) (iPad Only)
对分视图控制器是一个全屏视图控制器, 用以管理两个并排的视图控制器.
API NOTE 对分视图控制器的每个子视图控制器都负责管理一个窗格的展示. 对分视图控制器自身用来呈现这些子视图控制器并且管理屏幕方向改变时的过渡. 想要了解如何在代码中定义滚动视图, 请参考 UISplitViewController Class Reference 和 Split View Controllers.
IMPORTANT 对分视图控制器仅适用于 iPad 应用.
对分视图控制器是:
- 显示两个窗格.(不管在什么方向左窗格宽度都固定在 320 点距; 你可以自定义右窗格的宽度)
- 当旋转设备至竖屏时, 左窗格可以放在弹出层 (popover) 中呈现
- 可以包含各种对象和视图, 比如:
- 表格, 图片, 地图, web, 或者自定义视图.
- 导航栏, 工具栏以及标签栏.
NOTE 即便左窗格常常被称为主窗格, 右窗格常常被称为详细窗格, 但这种关系并没有在代码中严格执行.
对分视图控制器的左窗格用来展示持续不变的信息, 在右窗格展示与之相关的详细或者次要信息. 在这种设计模式中, 当用户选中左侧窗格中的项目, 右侧窗格会相应地展示与这项相关的信息.(你要负责在代码中实现)
避免右窗格的宽度比左窗格窄. 虽然右窗格的宽度由你决定, 但是如果它的宽度少于 320 点距, 对分视图控制器就不能填满屏幕宽度导致整体外观失衡.
避免同时在两侧窗格中展示导航栏. 这么做会让用户辨别不清左右两个窗格的关系.
一般情况下, 要用一致的方式指明左窗格中当前所选内容. 即使右边窗格中的内容发生改变, 也总能与左边窗格所选项保持关系. 这种视觉体验可以帮助用户理解左窗格中的项和右窗格中内容的关系.
适当情况下, 给用户可选的方法来访问左窗格. 默认情况下, 在竖屏模式只显示左窗格, 并且为用户提供一个按钮 (通常位于导航栏) 来显示和隐藏左窗格. 对分视图控制器还支持滑动手势操作来控制显示和隐藏. 除非你的应用使用滑动手势来执行其他功能, 否则应该让用户用它来访问左窗格.
表格视图 (Table View)
表格视图以单列的形式来展示多行数据.
API NOTE 想要了解如何在代码中定义滚动视图, 请参考 Table View Programming Guide for iOS 和 Table Views.
表格视图是:
- 其数据是以行为单位, 可分段或者按组显示
- 通过控件让用户对其行进行添加, 移除, 多选, 查看详细信息的操作, 或切换另一个表格视图.
iOS 定义了两种表格样式:
平铺型 (Plain). 平铺样式的行被分为若干带标签的段落, 表格右侧靠边缘处可以展示垂直的表格索引. 第一行之前可以有页眉, 最后一行之后也可以有页脚.
分组型 (Grouped). 分组样式的行按组显示, 每组前后可以有页眉和页脚. 分组型表格中至少包含一组列表项 (每行代表一个列表项), 而每一组中至少包含一列表项. 分组型表格不含索引.
当用户选中某一行时该行会短暂地高亮, 以上两种样式皆是. 当选中某行将展开另外一屏内容的时候, 该行会短暂地高亮, 然后新一屏内容滑入. 当用户回到前一屏时, 之前选中的那一行同样会短暂地高亮 (不会保持高亮) , 提醒用户他们先前选中了什么.
iOS 内含了若干表格视图元素 (table-view elements) 用来扩展表格视图的功能. 除了特别标注明的外, 这些元素只适用于表格视图.
| 表格视图元素 | 名称 | 含义 |
|---|---|---|
 | 勾选 (Checkmark) | 表示当前行已被选中. |
 | 扩展指示器 (Disclosure indicator) | 展开一个与当前行相关的新表格. |
 | 详情展示按钮 (Detail Disclosure button) | 在新视图中展开当前行相关的详情 (如何在表格视图上展开此元素，请参考 Popover (iPad Only)). |
 | 行记录器 (Row reorder) | 表示当前行可以被拖拽到表格的另一位置. |
 | 插入行 (Row insert) | 在表格中新增一行. |
 | 删除按钮控件 (Delete button control) | 在编辑状态中，显示和隐藏删除按钮. |
 | 删除按钮 (Delete button) | 删除当前行. |
除上面列出的表格专用元素, iOS还定义了能让用户刷新表格内容的刷新控件. 想要了解更多关于如何在你的应用中使用刷新控件, 请参考 Refresh Control.
iOS 定义了在平铺型表格和分组型表格中最常用到的四种单元格布局样式. 每种单元格样式都有最适合展示的信息类型.
NOTE 从编程角度来说, 这些样式应用于表格视图单元格 (cell) 中, 用以控制表格里每一行的绘制方式.
默认样式 (Default) (UITableViewCellStyleDefault)
默认样式包括一个位于行左端的图标 (可选), 以及居左对齐的文字标题.
默认样式非常适合展示不需要依靠额外信息区分的列表项.
副标题样式 (Subtitled) (UITableViewCellStyleSubtitle)
副标题样式包括一个位于行左端的图标 (可选), 居左对齐的文字标题, 以及在标题下方同样左对齐展示的副标题.
左对齐的文本标签让用户可以更快速地扫视表格. 这种列表样式适用于列表各项较为相似的情况, 用户可以通过副标题中的附加信息来区分各项标题的含义.
Value 1 (UITableViewCellStyleValue1)
Value 1 样式包括了左对齐的标题, 以及在同一行, 用较细的字体右对齐的副标题.
Value 2 (UITableViewCellStyleValue2)
Value 2 样式包括了右对齐蓝色字体的标题, 以及在同一行, 左对齐黑色字体的副标题. 这种样式不适合使用图片.
在 Value 2 的布局中, 文本和副标题中间一目了然的垂直间距会让用户专注于副标题的第一个单词.
NOTE 以上四种单元格基本样式均支持添加表格视图元素, 例如勾选或扩展指示器 (disclosure indicator). 添加这些元素会缩小单元格标题和副标题的可用宽度.
使用表格视图可以简洁而高效地展示少量或者大量信息. 举例来说, 你可以通过表格视图来:
- 展示可供用户选择的选项清单 (a list of options). 你可以使用选中标记来告知用户当前选中了哪些项.
用户在点击表格中某一行时所展示的选项清单, 可以使用表格视图的任意一种 (平铺或分组型) 展示, 但用户点击表格之外的按钮或 UI 元素时, 请使用平铺型表格视图展示选项清单. - 展示层级信息. 平铺型表格样式非常适合展示层级信息. 表格中的每项都指向不同的子信息, 这些子信息承载于另一个列表中. 用户可以沿着这些层级结构的路径来点击每一层列表中的项, 扩展指示器可告知用户点击这一列中的任何位置, 都将展开新的列表以展示其子类信息.
- 展示可以在概念上进行分组的信息. 平铺型和分组型列表都允许你通过提供页眉和页脚来对信息进行分组和分段.
在iOS 6及以后版本中, 你可以使用页眉-页脚视图 (也就是 UITableViewHeaderFooterView 的实例) 来展示页眉和页脚中的文本或图片. 想要了解如何在代码中使用页眉-页脚视图, 可查看UITableViewHeaderFooterView Class Reference.
在使用表格视图时请遵循以下指南:
当用户选中列表项时始终给予反馈. 用户期望当他们点击一个可选项目时, 表格行会短暂地高亮. 点击后用户预期会出现新的视图 (或展示一个复选标记) 以指示项目被选中或者已经启用.
如果表格中的内容非常庞杂, 不要等到所有数据都加载完成再显示. 相反, 应立即在当前屏的行中填充文本数据, 而较其他复杂的数据 (例如图片) 则当其可用后再显示. 这个技巧能够立即向用户提供有用的信息, 并能强化用户对你应用响应速度的感知.
考虑在等待新数据加载的过程中先显示 “过期 (stale)” 的数据. 虽然不推荐处理频繁变化数据的应用用这个方法, 但它让静态应用也能立即给用户一些可用信息. 在你决定这么做之前, 先要估算数据变化的频率, 以及有多少用户依赖于快速看到更新的数据.
如果信息加载速度很慢或者非常复杂, 你需要告诉用户加载正在进行中. 如果表格中所有内容都很复杂, 我们很难即时地给用户展示任何内容. 在这种极端情况下, 切勿显示空白的表格, 因为这会让用户错以为你的应用挂了. 此时应当在屏幕中央展示一个活动指示器 (activity indicator) 和一个信息标签 (information label), 比如 “加载中…”, 让用户知道加载仍然在进行.
如果合适的话, 为删除按钮自定义一个标题. 如果这能让用户更好地理解你应用 (对删除按钮) 的处理方式, 你就应该创建一个合适的标题, 来取代系统默认的删除按钮标题.
尽量使用简洁的文字标签, 以避免被截断. 截断的文字和词组不方便用户扫视和理解. 所有四种单元格样式均会自动截断文本, 而所造成的问题可大可小, 取决于你采用的单元格样式, 以及被截断了哪一部分.
避免索引和表格视图元素在表格右侧边缘处的显示出现重叠. 在表格右侧边缘处显示的表格视图元素 (例如扩展指示器) 会妨碍到索引的使用.
如果你想以一种非标准的形式来布局你的表格, 最好是自定义一种单元格样式. 而不是在标准表格样式上大肆改动. 想要了解如何创建自定义单元格样式, 请参考 Table View Programming Guide for iOS 中的Customizing Cells 部分.
文本视图 (Text View)
文本视图可以接收和展示多行文本.
API NOTE 想要了解如何在代码中定义文本视图, 请参考 Text View.
文本视图是:
- 矩形, 可定义为任何高度.
- 当内容太多超出视图的边框时, 支持滚动.
- 支持自定义字体, 字色及对齐方式 (默认显示左对齐的黑色字体).
- 支持编辑, 当用户轻击文本视图内部时, 将唤起键盘 (键盘的布局和类型取决于用户的系统语言设置).
始终确保文字的易读性. 虽然你可以使用属性字符串将不同的字体、字色和对齐方式串联在同一个文本视图内, 但保持文本的可读性是首先要考虑的. 最好是可以支持动态文本 (Dynamic Type) 以及使用 UIFont 的类方法 preferredFontForTextStyle 来展示文本框中的文本. 关于动态文本的指南, 请参考 Text Should Always Be Legible; 而编程相关信息, 请参考 Text Programming Guide for iOS 中的 Text Styles.
根据输入内容的类型来指定不同的键盘类型. 举例来说, 你希望用户能更方便地输入网址, 密码或者电话号码. 但请注意, 由于键盘的布局以及输入方法是由用户的系统语言设置决定的, 这是你不能控制的.
iOS 提供了各种不同的键盘类型, 以便用户输入不同类型的文本. 想要了解可用键盘类型, 可以参考UIKeyboardType. 想要了解如何在管理你的应用中的键盘, 请参考 iOS App Programming Guide 中的Managing the Keyboard 部分.
网络视图 (Web View)
网络视图是一个可以展示丰富的 HTML 内容的区域.(下图是iPhone自带的邮件应用, 网络视图指的是下图中导航栏和标签栏中间的区域)
API NOTE 想要了解如何在代码中定义网络视图, 请参考 Web Views.
网络视图是:
- 展示网页内容
- 对页面中的内容做一些自动处理, 比如把页面中的电话号码转化成电话链接
如果你有一个网页或者网络应用, 你可以考虑用网络视图来实现一个简单的 iOS App, 来对你的网页或者应用进行一个封装. 如果你打算用网络视图来访问你所控制的网页内容, 请务必阅读 Safari Web Content Guide.
不要用网络视图来创建一个看起来像迷你网络浏览器的应用. 用户期望使用 iOS 自带的 Safari 来浏览网页内容, 因此我们并不推荐你在自己的应用中复制这种以被广泛应用的功能.
扫一扫
1682
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
