Table Views

A table view presents a small or large amount of data cleanly and efficiently in a scrolling list of cells that are organized into columns and rows. At minimum, a table view contains one column that contains primary data like file names. Subsequent columns may be added, as needed, to display additional attributes that supplement the primary data like file sizes and modification dates.

Tables are ideal for displaying text-based content and are often used for navigation on one side of a split view, with related content on the opposite side. See Split Views.

Use an outline view instead of a table view to present hierarchical data. An outline view looks like a table view, but includes disclosure triangles for exposing additional levels of data. For example, an outline view might display folders and the items they contain. See Outline Views.

Use descriptive column headings to provide context. Column headings should be noun or short noun phrases with title-style capitalization and no punctuation—they should never include a trailing colon. Always provide column headings in a multi-column table view. If you don’t include a column heading in a single-column table view, use a label or other means to make sure there’s enough context for the user.

Let people click column headings to sort a table view if it provides value. In a sortable table view, the user can click a single column heading to perform an ascending or descending sort based on that column. You can implement additional sorting based on secondary columns behind the scenes, if necessary. If the user clicks the heading of a column that’s already sorted, data should re-sort in the opposite direction.

Let people resize columns. Data displayed in a table view often varies in width. When columns can be resized, the user can adjust their width as needed to reveal clipped data.

Consider using alternating row colors in multi-column table views. Alternating colors make it easier to track row values across columns—especially in wide table views.

Enable data editing if it makes sense in your app. In an editable table view cell, the user should be able to single-click a cell to edit its contents. Note that a cell can respond differently to a double-click. For example, a table view listing files might let the user single-click a file’s name to edit it, but double-click a file’s name to open the file. You can also let people reorder, add, and remove table rows if it such functionality is useful.

Consider using a pop-up button instead of a single-column table view when presenting a single-column list of choices. A pop-up button requires significantly less space than a table view, and is designed to present a list of choices clearly and efficiently.

Use a centered ellipsis to truncate cell text that would otherwise be clipped. An ellipsis in the middle preserves the beginning and end of the cell text, the result of which tends to be more distinct and recognizable than clipped text.

Consider offering a search field to help people find values quickly in a lengthy table view. Windows whose primary feature is a table view often include a search field in the toolbar. See Search Fields.

For developer guidance, see NSTableView.