自上次参加完回音分享会后,我下定决心要洗心革面乖乖打基础,于是开启了这个part,争取两个月不间断更新,写完Material Design与iOS中的组件(顺便学学英语),以便今后在使用的时候完全不虚
Tables
Human Interface Guidelines链接:Tables
一个table将数据显示为可滚动的单列列表,这些列表可以分为多个部分或组。
使用table可以以列表的形式干净有效地显示大量或少量信息。
一般来说,table非常适合基于文本的内容,并且通常在split view的一侧显示为导航方式,相关的内容则显示在另一边。
iOS的两种table 样式
plain(使用较多)
行可以分为贴上标签的sections,可选索引(如通讯录右边的ABCD...)可以沿着table的右边纵向出现。 标题可以出现在section中的第一个项目之前,而页脚可以出现在最后一个项目之后。
grouped(一般用在“我的”等不常更改的页面)
行以组的形式显示,可以前面加标题,后面加页脚。 这种table样式总是包含至少一个组,每个组总是至少包含一行。一个grouped table不包含索引。
使用时注意
·考虑table宽度
太窄(横向)的table可能导致截断和缠绕,使得它们很难在一定距离进行快速阅读和扫视。太宽的table也可能难以阅读和扫描,并可能从内容中夺走空间。
·开始快速显示table内容
在展示内容之前不要等待大面积的table内容加载。先立即用文本数据填充屏幕上的行,再在可行时显示更复杂的数据(如图像)。这种技术可以马上为人们提供有用的信息,并提高app的感知响应能力。在某些情况下,在新的数据到达之前,显示陈旧的数据可能会有意义。
·在内容加载时交代进展
如果表格的数据需要花费时间才能加载,请显示进度条或spinning activity indicator以向用户保证您的app仍在运行。
·保持内容新鲜
考虑定期更新您的table内容以反映更新后的数据,但不要更改用户滚动后所在的位置。作为替代,可以将新内容添加到table的开头或结尾,并让人们在准备好时继续滚动。有些app会在添加了新数据时显示一个 indicator,并提供一个control直接跳转至新数据。包含刷新control也是一个好主意,所以人们可以随时手动执行更新。
·避免将索引与包含右对齐元素的table行组合
索引是通过执行较大滑动的手势来控制的。如果其他可交互元素存在于附近(例如disclosure indicators),则可能难以在手势发生时辨别用户的意图,并且可能激活错误的元素。
Table Rows
使用标准table cell样式来定义内容在table rows中的显示方式。
基本(默认)
行左侧为可存在的图像,后跟左对齐的title。 这种方式适合展示不需要补充信息的项是一个很好的选择。
有副标题的(Subtitle)
一行的左对齐title,接下来是一行左对齐的subtitle。 这种风格在每行都看起来相似的table中适用。 额外的subtitle有助于将rows彼此区分开来。
下图左:左对齐的title,在同一行上有右对齐的subtitle
下图右:右对齐的title,然后是同一行上的左对齐subtitle
所有 table cell样式还允许图形元素,例如 checkmark 或 disclosure indicator(>)。当然,添加这些元素会减少可用于 title 和 subtitle 的空间。
使用时注意
·保持文本简洁以避免截断
截断的单词和短语很难扫视和辨认。文本截断在所有table cell 样式中都是自动的,它可以表现出一些问题,具体取决于使用的 cell 样式和截断发生的位置。
·考虑为删除按钮使用自定义title
如果一行支持删除并且需要提供明确性,请将系统提供的删除标题替换为自定义标题。
·在进行选择时提供反馈
当内容被点击时,人们希望一行可以简短的高亮。然后,人们期望出现新的view或一些东西进行改变,例如出现checkmark,表示已进行选择。
·为非标准table rows设计自定义table cell格样式
标准样式适用于各种常见场景,但某些内容或您的整体app设计可能需要大量定制的table外观。