Updated: June 10, 2019

Key Value Cell

Intro

The key value cell is a table view cell which fits inside the table view container. It is ideal for displaying sets of data that also need to display their labels for context.

Structure

The structure of this cell type is simple. There is a key label at the top and a value below. Key value cells can be read only, which are displayed in standard text colors, or they may allow for an action such as a quick way to call or view an address. Key value cells that have an action must set the value text as tint color to indicate to the user there is an action.

Key Label

This is the label to describe the content.

Value

The data for a particular label. Values can be read only or have a specific action associated with it (e.g. phone number or email address).

Compact & Regular

The key value cell does not change from compact to regular width, however, you have the option to use a two column view displayed in regular. If you are using the two column, the cells will automatically stack as a single column when you switch to a compact width.