Skip to content

Object Cell


open class FUIObjectCell: NibDesignable

FUIObjectCell is an Interface-Builder-designable UI component that extends UIView for showing object information. It contains a set of default content views that are common to Fiori Design Language Object Cell types, with the associated constraint implementations and handling for size classes.

Views Available in FUIObjectCell

  • iconsStackView: a UIStackView view expected to contain a vertical stack of icons/images in its view content. The view is added to the cell unless cell.preserveIconStackSpacing is set to false. This is the first view in the cell and can be left to detailImageView. Use cell.iconImages to add image(s) to the stack view. Each icon/image size is set to be 16px by 16px.

  • detailImageView: an FUIImageView view added to the cell unless cell.preserveDetailImageSpacing is set to false. The view is to the right of iconsStackView and left of headlineLabel. The image is scaled to fit with fixed aspect. The image size is set to 45px by 45px. Use cell.detailImage to set the image.

  • headlineLabel: a UILabel view is always displayed and intended to display a headline text in the cell. Use cell.headlineText to set label text.

  • subheadlineLabel: a UILabel view is added 3px below headlineLabel to the cell. Use `cell.subheadlineText" to set label text.

  • footnoteLabel: a UILabel view is added 3px below subheadLabel to the cell. Use cell.footnoteText to set label text.

  • descriptionLabel: a UILabel view intended to display long text in the cell. It gets displayed only in regular view. The view is to the right of headlineLabel and left of statusImageView(or statusLabel). Use `cell.descriptionText" to set label text.

  • statusImageView/statusLabel: a UIImageView/UILabel added to the cell for status. statusImageView gets added with size 16px by 16px. The view is to the left of accessory view and right of descriptionLabel. Use cell.statusText to set label text or cell.statusImage to set image.

  • substatusImageView/substatusLabel: a UIImageView/UILabel added to the cell under status. substatusImageView gets added with size 16px by 16px. Use cell.substatusText to set label text or cell.substatusImage to set image. An error will be logged when accessoryType is not .none nor .disclosureIndicator, then setting a substatus label text or substatus image as this setting breaks the Fiori Design Language pattern.

  • accessoryView: a UIView added to the view when cell.accessoryType is not .none. The view is a UIButton customized in FUIObjectCell and is aligned to the baseline of headlineLabel when the type is .disclosureIndicator. For any other types, it's vertically center-aligned and created by Apple native SDK.

Example Initialization and Configuration

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: ObjectTableViewCell.reuseIdentifier, for: indexPath as IndexPath) as! ObjectTableViewCell
    cell.detailImage = UIImage(named: "ProfilePic")
// To enable a default gradient layer behind the placeholder text.
    cell.detailImageView.isGradientLayerEnabled = true
// Set placeholder text.
    cell.detailImageView.placeholder.text = "This is a placeholder"
    cell.headlineText = "Edgar Scissorhands"
    cell.subheadlineText = "Lorem ipsum datil es iosin Lotios nsiqok"
    cell.footnoteText = "Here is some footer text about Edward"
    cell.statusImageView.image = UIImage(named: "ErrorIcon")
    cell.substatusText = "Active"
    cell.descriptionText = "This text is only visible when the cell is in regular horizontal size class."
    cell.iconImages = [#imageLiteral(resourceName: "clock"), #imageLiteral(resourceName: "check"), #imageLiteral(resourceName: "attention")]
    cell.accessoryType = .disclosureIndicator
    return cell


Supported style classes


Last update: December 8, 2020