iphone:Table-views
出自UXGuide.net
表格视图
Table Views
A table view presents data in a single-column list of multiple rows. Rows can be divided into sections or groups and each row can contain some combination of text, images, and controls. Users flick or drag to scroll through rows or groups of rows. Figure 8-1 shows how different styles of table views can display lists in different ways.
表格视图通过多行单列的表格显示数据。行可分为节或组,每行可以包含一些文字,图片和控件。用户可以在行间或者分组之间滑动或拖移来进行滚动。图 8-1 给出了不同样式的表格视图在显示列表时的不同方式。
Figure 8-1 Three ways to display lists using table views
图8-1 使用表格视图显示列表的三种方式
目录 |
用途和行为 Usage and Behavior
Table views are extremely useful in iPhone applications because they provide attractive ways to organize both large and small amounts of information. Table views are most useful in productivity applications that tend to handle lots of user items, although utility applications can make use of smaller-scale table views, as well. An immersive application would probably not use a table view to display information, but it might use one to display a short list of options.
表格视图在 iPhone 应用程序中相当有用,因为无论信息数量多少,都能提供具有吸引力的组织方式。尽管实用程序也能利用一些小规模的表格视图,但表格视图通常在那些需要处理大量用户数据的生产力应用程序中最为有用。沉浸式应用程序一般不会使用表格视图来显示信息,但它可能会用它来显示较短的选项列表。
Table views provide built-in elements that allow users to navigate and manipulate information. In addition, table views support:
表格视图提供了让用户浏览和处理信息的内置元素。此外,表格视图还支持:
- The display of header and footer information. You can display descriptive text above or below each section or group in a list, and above or below the list as a whole.
- 显示页眉页脚信息。你可以在列表中的每一节或组的上方或下方,或者是整个列表的上方或下方显示说明文字。
- List editing. You can allow users to add, remove, and reorder list items in a consistent way. Table views also support the selection and manipulation of multiple list items, which you might use to give users a convenient way to delete more than one list item at a time.
- 编辑列表。你可以允许用户以统一的方式对列表项进行添加、删除及排序。表格视图还支持多项选择和操作,这就使得你能够向用户提供方便的一次删除多个列表项的操作方式。
A table should always provide feedback when users select a list item. When an item can be selected, the row containing the item highlights briefly when the user selects it, providing feedback that the selection has been received. Then, an immediate action occurs: Either a new view is revealed or the row displays a checkmark to indicate that the item has been selected or enabled.
当用户选择一个列表项时,表格应始终提供反馈。如果一个项目可以被选择,那么一旦用户进行选择,包含这个项目的行应高亮一下,给用户提供反馈,表示该选择已经收到。然后,立即采取行动:要么显示新视图,要么该行显示复选标记以表明该项目已被选中或启用。
In rare cases, a row might remain highlighted when secondary details or controls related to the row item are displayed in the same screen. However, this is not encouraged because it is difficult to display a list of choices, a selected item, and related details or controls without creating an uncomfortably crowded layout.
在极少数情况下,当与该行项目有关的附加详细信息或控件显示在同一屏上时,该行可能仍然会持续高亮显示。不过,并不鼓励这样做,因为很难将选项列表、已经选定的项和相关的详细信息或控件同时显示而又不显得拥挤难受。
If a row selection results in navigation to a new screen, the selected row highlights briefly as the new screen slides into place. When the user navigates back to the previous screen, the originally selected row again highlights briefly to remind the user of their earlier selection.
如果因为选择了一个行而转到一个新的屏幕,那么选中行应当先高亮一下,然后新屏幕再滑入。当用户返回前一屏时,原先选定的行应该再次高亮一下,提示用户他们先前所做的选择。
Note that you can also animate the changes users make to list items. Doing so is a good way to provide feedback and strengthen the user’s sense of direct manipulation. In Settings, for example, when you turn off the automatic date and time setting (by selecting Off in Date & Time > Set Automatically), the list group expands smoothly to display two new items, Time Zone and Set Date & Time.
注意,你也可以用动画展现用户对列表项所做的更改。这是提供反馈并强化用户直接操纵感的好方法。例如在“设置”中,当你关闭自动设定日期和时间(通过在“日期与时间” > “自动设置”中选择关闭),列表分组将平滑展开,以显示“时区”和“设置日期和时间”两个新项。
A table should display content immediately. If the table's content is extensive or complex, avoid waiting until all the data is available before displaying anything. Instead, fill the onscreen rows with textual data immediately and display more complex data (such as images) as they become available. This technique gives users useful information right away and increases the perceived responsiveness of your application.
表格应立即显示内容。如果表格中的内容非常庞杂,不要等到所有数据都加载完成再显示。相反,立即在屏幕可见的行中显示文本数据,而较复杂的数据(例如图片)则当其就绪后再显示。这个技巧能够立即向用户提供有用的信息,感觉上也提高了你的应用程序的响应速度。
If your application displays data that changes infrequently, you might consider displaying “stale” data while waiting for new data to become available. This technique also allows users to see something useful right away, but it is not recommended for applications that handle data that changes frequently. Before you decide to do this, gauge how often the data changes and how much users depend on seeing fresh data quickly.
如果应用程序显示数据变化不是很频繁,你可以考虑在等待新数据加载的过程中先显示“过期”的数据。这个技巧让用户也能立即看到一些有用的信息,但对于处理数据频繁改变的应用程序则不推荐使用。在你决定这么做之前,要先估计数据变化的频率,以及有多少用户希望迅速看到更新的数据。
If it’s difficult to display anything useful right away, it's important to avoid displaying empty rows, because this can imply that the application has stalled. Instead, the table should display a spinning activity indicator along with an informative label, such as “Loading...”, centered in the screen. If you can display older data, you don’t have to worry about blank rows, but you should update onscreen rows as soon as possible. Both techniques provide feedback to users, letting them know that processing is continuing.
如果很难立即显示有用的内容,那么避免显示空行也非常重要,因为空行可能意味着该应用程序死机。相反,应在屏幕中央显示一个旋转的活动指示器和一个信息描述标签,如“正在加载...”。如果你能显示旧的数据,就不必担心空行,但应当尽快更新可见区域的数据行。这两种技巧都向用户提供反馈,让他们知道程序正在继续进行。
表格视图的样式 Table-View Styles
iPhone OS defines two styles of table views, which are distinguished mainly by appearance:
iPhone OS 定义了两种表格视图样式,其主要区别在于外观:
Plain (UITableViewStylePlain). This table-view style displays rows that extend from side edge to side edge of the screen. The background of the rows is white. The rows can be separated into labeled sections and the table view can display an optional index that appears vertically along the right edge of the view.
普通(UITableViewStylePlain)。在这种表格视图样式下,表格行伸展至屏幕两端,行背景为白色。表格行可以被划分为若干个带标签的节,也可以在表格视图的右端垂直显示可选的索引。
Figure 8-2 shows a list in a plain table (without headers, footers, or an index) in the iPod application.
图 8-2 显示了 iPod 应用程序中的普通表格(无页眉、页脚、索引)。
Figure 8-2 A simple list in a plain table
图 8-2 普通表格中的简单列表
Grouped (UITableViewStyleGrouped). This table-view style displays groups of rows that are inset from the side edges of the screen. The groups are displayed on a distinctive vertically striped background, while inside the groups the background is white. A grouped table can contain an arbitrary number of groups, and each group can contain an arbitrary number of rows. Each group can be preceded by header text and followed by footer text. This style of table view does not provide an index.
分组(UITableViewStyleGrouped)。在这种表格视图样式下,每组表格行显示时会相对屏幕两侧缩进一些。这些分组显示在独特的垂直条纹背景上,而组内背景则是白色的。带分组的的表格可以包含任意数量的分组,每个分组可以包含任意数量的行。可在每个分组之前添加页眉文本,之后添加页脚文本。这种表格视图样式不支持索引。
Figure 8-3 shows a list in a grouped table, in which each group contains one row. This list, in the Settings application, does not include header or footer text.
图 8-3 显示了带分组表格中的列表,其中每组包含一个表格行。“设置”应用程序中的这个列表不包含页眉和页脚文本。
Figure 8-3 A list of four groups in a grouped table
图 8-3 在群组表格中一个包含四个组的清单
单元格样式 Table-Cell Styles
iPhone OS 3.0 and later includes four predefined table-cell styles you can use to quickly and easily produce the most common layouts for table rows in both plain and grouped tables. Note that, programmatically, these styles are applied to a table view’s cell, which is an object that tells the table how to draw its rows.
iPhone OS 3.0 及后续版本包含了四种预置的单元格样式,可以简单快速地针对普通和分组表格生成常用的表格行布局。注意,从编程上来说,这些样式是应用在表格视图单元格上的,单元格用于控制表格如何绘制各行。
When you use the standard table-cell styles, your application is consistent with the built-in applications, which benefits you in a couple of ways:
当使用标准单元格样式时,你的应用程序将与内置应用程序保持一致,其好处在于:
- Users more quickly understand how your application works
- 用户可以更快地了解如何使用你的应用程序
- Your application remains consistent without a lot of extra work on your part, if the standard table-cell styles are enhanced in the future
- 如果将来标准单元格样式发生更改,你无须花费大量的精力即可维持你应用程序的一致性。
If you want to lay out your table rows in a nonstandard way, it’s better to create a custom table-cell style than to significantly alter a standard one. "Customizing Cells" in Table View Programming Guide for iPhone OS helps you learn how to create your own cells.
如果你希望使用非标准的表格行布局方式,最好创建一个自定义的单元格样式,不要对标准样式进行大规模的扩充修改。Table View Programming Guide for iPhone OS 中的“Customizing Cells”包含如何创建自己的单元格样式的信息。
Be aware that text truncation is automatic in all table-cell styles. Generally speaking, you should ensure that your text is as succinct as possible to avoid displaying truncated words or phrases that are difficult for users to understand. Specifically, text truncation can be more or less of a problem, depending on which cell style you use and on where truncation occurs.
注意,在任何单元格样式中,文本都会被自动截断。一般来说,你应当确保你的文本尽可能简洁以避免单词或短语被截断后对于用户来说难以理解。文本截断的问题可大可小,具体取决于你使用的单元格样式和截断出现的位置。
iPhone OS provides the following standard table-cell styles:
iPhone OS 提供下列标准单元格样式:
- The default table-cell style (
UITableViewCellStyleDefault) includes an optional image on the left, followed by a left-aligned text label in black.
- 默认单元格样式(
UITableViewCellStyleDefault)包含一个位于左侧的可选图像,右侧是左对齐的黑色文本标签。
- Figure 8-4 The default table-cell style in a grouped table (left) and a plain table (right)
图 8-4 带分组的表格(左)和普通表格(右)中的默认单元格样式
- The text label’s appearance implies that it represents an item name or title and its left-alignment makes the list easy to scan. This makes the default style good for displaying a list of items that do not need to be differentiated by supplementary information.
- 文本标签的外观意味着它所代表的是项目名称或标题,左侧对齐使得列表易于扫视。默认样式适用于显示一组无须通过附加信息进行区别的项目。
- Short text labels are best, but if truncation is unavoidable, try to ensure that the most important information is contained in the first few words.
- 文本标签越短越好,但如果截断不可避免,尽可能保证最重要的信息出现在最开头的几个单词中。
- The subtitle table-cell style (
UITableViewCellStyleSubtitle) includes an optional image on the left, followed by a left-aligned text label on one line and a left-aligned detail text label on the line below. The text label is in black and the detail text label is in a smaller, gray font.
- 副标题单元格样式(
UITableViewCellStyleSubtitle)包含一个位于左侧的可选图像,右侧是一行左对齐的文本标签,下方是一行左对齐的详细文本标签。文本标签是黑色的,详细文本标签则为稍小的灰色字体。
- Figure 8-5 The subtitle table-cell style in a grouped table (left) and a plain table (right)
图 8-5 带分组的表格(左)和普通表格(右)中的副标题单元格样式
- The prominent appearance of the text label implies that it represents an item name or title, while the subtle appearance of the detail text label implies that it contains subsidiary information related to the item. The left-alignment of the text labels makes the list easy to scan. This table-cell style works well when list items might look similar, because users can use the additional information in the detail text labels to help distinguish items named in the text labels.
- 文本标签的突出外观意味着它代表了项目名称或标题,而详细文本标签的细微外观意味着它包含的是与此项相关的附属信息。文本标签左对齐可使列表更易于扫视。该单元格样式适用于列表项互相较为相似的情况,用户可以通过详细文本标签中的额外信息来帮助区分列表项。
- Text labels should be short to avoid truncation. If truncation is unavoidable, focus on putting the most important information in the first few words. If the detail text label is truncated, users are not likely to mind too much because they view it as information that enhances or supplements the item named by the text label.
- 文本标签应当简短避免截断。如果截断不可避免,尽量让最重要的信息出现在最开头的几个单词中。如果详细文本标签被截断,用户通常不会太在意,因为他们只是将其视为对文本标签所给出的条目名称的一种加强和补充。
- The value 1 table-cell style (
UITableViewCellStyleValue1) displays a left-aligned text label in black on the same line with a right-aligned detail text label in a smaller, blue font. Images do not fit well in this style.
- 值-1 型单元格样式(
UITableViewCellStyleValue1)是在同一行显示黑色的左对齐文本标签,并以稍小蓝色的字体显示右对齐的详细文本标签。该样式不包含图片。
- Figure 8-6 The value 1 table-cell style in a grouped table (left) and a plain table (right)
图 8-6 带分组的表格(左)和普通表格(右)中的值-1 型单元格样式
- The appearance of the text label implies that it represents an item name or title, while the appearance of the detail text label implies that it provides important information that is closely associated with the item.
- 文本标签的外观样式意味着它表示的是条目名称或标签,而详细文本标签的外观意味着它提供了与条目相关的重要的信息。
- The left-alignment and font of the text label help users scan the list for the item they want, and the right-alignment of the detail text label draws their attention to the related information it provides. This table-cell style works well to display an item’s current value, possibly selected from a sublist.
- 文本标签的左对齐方式及其字体能够方便用户扫视列表以寻找条目,详细文本标签右对齐则能够使用户的注意力集中在所提供的相关信息上。该单元格样式适用于显示条目的当前值,可能是选自子列表。
- Text truncation can be difficult to avoid in this layout (because both labels are on the same line), but it’s worth the effort. Otherwise, you lose the active space between the labels that helps users understand the relationship between the two pieces of information.
- 在这种布局下,文本截断很难避免(因为一行要显示两个标签),但还是值得努力尝试的。否则,左右标签之间将没有留白,用户不容易理解两组信息之间的关系。
- Although you can use the value 1 table-cell style in either a plain or a grouped table, its appearance is better suited to a grouped table. For example, the Usage screen in Settings uses the value 1 style in grouped tables:
- 尽管值-1 型单元格样式在普通或者分组表格中均可使用,但其外观更适用于分组表格。例如,“设置”中的“使用情况”屏幕即在分组表格中使用了值-1 型样式。
- Figure 8-7 The value 1 table-cell style looks best in a grouped table
图 8-7 值-1 型单元格样式最适用于分组表格
- The value 2 table-cell style (
UITableViewCellStyleValue2) displays a right-aligned text label in a small blue font, followed on the same line by a left-aligned detail text label in a larger, black font. Images do not fit well in this style.
- 值-2 型单元格样式(
UITableViewCellStyleValue2)在左侧以较小的蓝色字体显示右对齐的文本标签,在右侧同一行上以较大的黑色字体显示左对齐的详细文本标签。该样式不包含图片。
- Figure 8-8 The value 2 table-cell style in a grouped table (left) and a plain table (right)
图 8-8 带分组的表格(左)和普通表格(右)中的值-2 型单元格样式
- The right-alignment, constrained width, and font of the text label imply that it functions as a heading or caption for the important information in the more prominent, left-aligned detail text label.
- 文本标签的右侧对齐方式、受限宽度及其字体意味着它是作为标题来使用的,而更突出、左侧对齐的详细文本标签则包含更重要的信息。
- In this layout, the labels are aligned towards each other at the same location in every row. This creates a crisp, vertical margin between the text labels and the detail text labels in the list, which helps users focus on the first words of the detail text label. If you allow the text labels to be truncated, you lose the sharpness of this vertical strip, which can make it harder for users to scan the information in the detail text labels.
- 在这种布局方式下,每行的左右标签都在同一个位置相互靠齐,在列表的文本标签和详细文本标签之间产生了清晰的垂直间距,使用户能够专注于详细文标签的首字词。如果文本标签被截断,就会影响这种垂直条带的清晰度,用户扫视详细文本标签中的信息则可能变得困难。
- Although you can use the value 2 table-cell style in either a plain or a grouped table, it looks much better in a grouped table. For example, the Info screen in Contacts uses the value 2 table-cell style in grouped tables:
- 尽管值-2 型单元格样式在普通或者分组表格中均可使用,但其外观更适用于分组表格。例如,“联系人”中的“信息”屏幕即在分组表格中使用了值-2 型样式。
- Figure 8-9 The value 2 table-cell style looks best in a grouped table
图 8-9 值-2 型单元格样式最适用于分组表格
Note: All standard table-cell styles also allow the addition of a table-view element, such as the checkmark or the disclosure indicator. Be aware that adding these elements decreases the width of the cell available for the title and subtitle.
注: 所有的标准单元格样式都允许添加表格视图元素,比如复选标记或者继续展开指示符。要注意添加这些元素会减少标题及副标题可用的单元格宽度。
You might be able to avoid text truncation by increasing the height of a table row to accommodate text wrapping, but this can be problematic:
你可以通过增加表格行的高度支持文本折行来避免文本截断,但这也可能会有问题:
- You have to programmatically check the text length and decide if wrapping might occur. You must make this determination for both portrait and landscape orientation, because the table width affects text wrapping.
- 你需要通过编程方式来检查文本长度并确定是否需要折行。你必须在纵横两个方向都进行确定,因为文本折行受表格宽度的影响。
- You should avoid displaying wrapped text in one orientation, but not the other.
- 你应当避免一个方向上出现文本折行而另一个方向上没有。
- Variable row heights can negatively impact the overall table view performance in your application, regardless of table-view style.
- 不同的行高会对你应用程序中表格视图的整体性能产生负面影响,无论使用何种表格视图样式。
Finally, although variable row heights are acceptable in grouped tables, they can make a plain table look cluttered and uneven.
最后,即使在分组表格使用不同的行高还可以接受,但在普通表格中这会显得杂乱不均。
表格视图的元素 Table-View Elements
iPhone OS includes a handful of table-view elements that can extend the functionality of table views. Unless noted otherwise, these elements are suitable for use in table views only. Be sure to use these elements correctly in your application, because users are accustomed to their appearance and behavior in the built-in applications.
iPhone OS 包含一些能够扩展表格视图功能的表格视图元素。除非另有说明,否则这些元素只在表格视图中适用。一定要确保这些元素在应用程序中的正确使用,因为用户已经习惯了它们在内置应用程序中的外观和行为。
Note: Programmatically, table-view elements are implemented in different ways. Some are accessory views of the table cell (an object that tells the table how to draw its rows) and others can be displayed when the table view enters an editing mode. See Table View Programming Guide for iPhone OS to learn about the different ways to manage these elements.
注:从编程上来说,表格视图元素是以不同方式实现的。有些是单元格(控制表格如何绘制各行的对象)的附属视图,而其他的则当表格视图进入编辑模式后显示。要了解管理这些元素的不同方式,参见 iPhone OS 表格视图编程指南(英文)。
- Disclosure indicator. When this element is present, users know they can tap anywhere in the row to see the next level in the hierarchy or the choices associated with the list item.
- 继续展开指示符。当此元素出现时,用户知道他们可以点击该行的任何位置以查看下一级信息,或是与该列表项相关的选项。
- Use a disclosure indicator in a row when selecting the row results in the display of another list. Don’t use a disclosure indicator to reveal detailed information about the list item; instead, use a detail disclosure button for this purpose.
- 当选择表格行将显示另一个列表时,应当使用继续展开指示符。不要使用继续展开指示符去表示该列表项的详细信息,在这种情况下应该使用详情展开按钮。
- Detail disclosure button. Users tap this element to see detailed information about the list item. (Note that you can use this element in views other than table views, to reveal additional details about something; see “Detail Disclosure Buttons” for more information.)
- 详情展开按钮。用户点击该元素以查看关于该列表项的详细信息。(注意,你也可以在除表格视图以外的其他视图中使用该元素,以展现某物额外的详细信息。更多信息,参见“详情展开按钮”)。
- In a table view, use a detail disclosure button in a row to display details about the list item. Note that the detail disclosure button, unlike the disclosure indicator, can perform an action that is separate from the selection of the row. For example, in Phone Favorites, tapping the row initiates a call to the contact; tapping the detail disclosure button in the row reveals more information about the contact.
- 在表格视图中,在表格行中使用详情展开按钮以显示该列表项的详细信息。注意,与继续展开指示符不同,详情展开按钮可以执行与选定该行不同的操作。例如,在电话收藏夹中,点击行能够呼叫联系人,点击行中的详情展开按钮可以显示更多关于该联系人的信息。
- Delete button. Users tap this element to delete the list item. This element appears to the right of a list item when users swipe in the row or when they tap the delete control button while in an editing context. (See Figure 8-10 for an example of this element.)
- 删除按钮。用户点击此元素以删除列表项。当用户在该行上扫过或者当他们在编辑状态下点击删除控制按钮时,该元素就会在列表项的右侧出现。(参见元素的示例:图8-10)。
- Delete control button. Users tap this element to reveal and hide the Delete button for each list item. To give additional feedback to users, the horizontal minus symbol inside this button becomes vertical when users tap it to reveal the Delete button. See Figure 8-10 for an example of this element.
- 删除控制按钮。用户点击此元素以显示和隐藏每个列表项的删除按钮。为了向用户提供额外的反馈,当用户点击删除控制按钮时,其中的减号会由横向变为纵向。图 8-10 给出了该元素的一个示例。
- In a grouped table that supports a transitory editing mode, the delete control appears outside the table view, on the left. You can see this, for example, when editing an individual’s information in Contacts. In a grouped table that is in a permanent editing mode (such as the grouped tables on the back of Stocks and Weather), the delete control appears inside the table, on the left.
- 在一个支持临时编辑模式的分组表格中,删除控件显示在表格视图外部的左侧。例如,你可以在“通讯录”中编辑具体某个人的信息时看到。在处于持续编辑模式(比如“股票”和“天气”背面的分组表格)下的分组表格中,删除控件显示在表格内部的左侧。
- In a plain table, the delete control always appears inside the table, on the left, as shown in Figure 8-10.
- 在普通表格中,删除控件始终显示在表格内部的左侧,如图 8-10 所示。
- Row insert button. Users tap this element to add a row to the list.
- 插入行按钮。用户点击此元素向列表中添加一行。
- Row reorder control. When this element is present, users can drag the row to another location in the list.
- 行排序控件。当此元素出现时,用户可以将表格行拖移到列表中的另一个位置。
- Checkmark. This element appears to the right of a list item to show that it is currently selected.
- 复选标记。该元素显示在一个列表项的右边,表明它当前已被选定。
Figure 8-10 A table view can display the Delete button and the delete control button
图 8-10 表格视图可以显示删除按钮和删除控制按钮
开关控件 Switch Controls
A switch control presents to the user two mutually exclusive choices or states, such as yes/no or on/off. A switch control shows only one of the two possible choices at a time; users slide the control to reveal the hidden choice or state. Figure 8-11 shows examples of switch controls.
一个开关控件向用户呈现了两个互斥的选项或状态,如是/否或者开/关。开关控制一次只能显示两个可选项中的一个,用户滑动控件以显示另一个隐藏的选项或状态。图 8-11 给出了开关控制的一些示例。
Figure 8-11 Switch controls in a table view
图 8-11 表格视图中的开关控件
Use a switch control in a grouped table view when you need to offer the user two simple, diametrically opposed choices. Because one choice is always hidden, it’s best to use a switch control when the user already knows what both values are. In other words, don’t make the user slide the switch control just to find out what the other option is.
当你需要向用户提供两个简单而又截然相反的选项时,可以在分组表格视图中使用开关控制。因为其中一个选项始终是隐藏的,所以最好是在用户已经知道两个选项是什么时才使用开关控件。换句话说,不要让用户仅仅为了弄清另一种选项是什么,而去滑动开关控件。
You can use a switch control to change the state of other user interface elements in the view. Depending on the choice users make, new list items might appear or disappear, or list items might become active or inactive.
你可以使用开关控件来改变视图中其他用户界面元素的状态。根据用户的选择不同,新的列表项可能出现或消失,或列表项可能变为有效或无效。
使用表格视图实现普通用户操作 Using Table Views to Enable Common User Actions
Table views are particularly versatile user interface elements, because they can be configured in different ways to support different user actions, such as:
表格视图是非常通用的用户界面元素,因为它们可以通过不同的配置方式来支持不同的用户操作,例如:
- Selecting options.
- 选择选项。
- iPhone OS does not include multi-item selection controls analogous to menus or pop-up menus, but a table view works well to display a list of options from which the user can choose. This is because table views display items in a simple, uncluttered way. In addition, the table view provides a checkmark image that shows users the currently selected option (or options) in a list.
- iPhone OS 并不包括类似于菜单或弹出菜单的多项选择控件,而表格视图适用于显示可让用户进行选择的选项列表。这是因为表格视图简洁且不拥挤。此外,表格视图提供了复选标记图像,用于显示用户当前在列表中选中的一个(或多个)选项。
- If you need to display a list of choices users see when they tap an item in a table row, you can use either style of table view. But if you need to display a list of choices users see when they tap a button or other user interface element that is not in a table row, use the plain style.
- 如果你需要显示的是用户在点击列表中某一行时,所看到的选项清单,你可以使用表格视图的任意一种样式。但是如果你需要显示的是,当用户为了看到的选项清单,而点击列表外的一个按钮或其他用户界面元素时,请使用简洁的风格。
- Navigating hierarchical information.
- 导航层次信息。
- A table view works well to display a hierarchy of information in which each node (that is, list item) can contain its own subset of information, because each subset can be displayed in a separate list. This makes it easy for users to follow a path through the hierarchy by selecting one item in each successive list. The disclosure indicator element tells users that tapping anywhere in the row reveals the subset of information in a new list.
- 表格视图适用于显示具有层次结构的信息,其中每个节点(即列表项)可以包含自己的子信息,这是因为每个子元素可以显示在单独的列表中。这样用户可以很容易地沿着层次结构中的路径,从每层列表中选择一项。继续展开指示符元素意味着用户在表格行的任意位置点击即可在新的列表中查看子信息。
- When a table is used for navigation, previously selected table rows do not remain highlighted when users retrace their steps through the hierarchy.
- 当表格用于导航时,在用户沿着层次结构返回时,先前选中的表格行不应当保持高亮显示。
- Viewing conceptually grouped information.
- 查看在概念上进行分组的信息。
- You can use either table-view style to cluster information into logical groups, such as work, home, or school. Both plain and grouped tables allow you to provide context for each section by supplying header and footer text.
- 你可以使用任意一种表格视图样式对信息进行逻辑分组,如工作、家庭或学校。普通和分组表格中都可以通过添加页眉和页脚文本来为每节添加上下文。
- Generally speaking, grouped tables provide a clearer visual indication of grouping because it’s easy for users to distinguish the rounded corners of the groups, even when scrolling quickly.
- 一般来说,分组表格为分组提供了清晰的视觉识别,因为用户能够很容易地区分分组的圆角,即使在快速滚动的时候。
- Looking up indexed information.
- 查找索引信息。
- If you’re using a plain table, you can display an index that helps users quickly find what they need. The index consists of a column of entries (usually letters in an alphabet) that floats on the right edge of the screen. Users tap (or drag to) an index entry to reveal the corresponding area in the list. An index is most useful in a list that might span more than a few screenfuls.
- 如果使用的是普通表格,可以通过显示索引来帮助用户快速找到他们需要的东西。索引由浮在屏幕右边缘的一列条目(通常是字母表中的字母)组成。用户点击(或拖移至)某个索引项以定位至列表中的相应区域。索引在当列表可能延伸数屏时最为有用。
- If you include an index in a plain table, avoid using table-view elements that display on the right edge of the table (such as the disclosure indicator), because these elements interfere with the index.
- 如果你在普通表格中使用索引,应当避免使用显示在表格的右边缘的表格视图元素(如继续展开指示符),因为这些元素会影响索引的使用。