Class

NSCollectionLayoutSupplementaryItem

An object used to add an extra visual decoration, such as a badge or a frame, to an item in a collection view.

Declaration

@interface NSCollectionLayoutSupplementaryItem : NSCollectionLayoutItem

Overview

You use supplementary items to attach additional views to your content. For example, you might attach a badge to an item or a frame around a group. A supplementary item follows the index path of the item it's attached to.

If you want to create a header or footer for your layout or its sections, use a boundary supplementary item (NSCollectionLayoutBoundarySupplementaryItem) instead.

Each type of supplementary item must have a unique element kind. Consider tracking these strings together in a way that makes it straightforward to identify each element.

struct ElementKind {
    static let badge = "badge-element-kind"
    static let background = "background-element-kind"
    static let sectionHeader = "section-header-element-kind"
    static let sectionFooter = "section-footer-element-kind"
    static let layoutHeader = "layout-header-element-kind"
    static let layoutFooter = "layout-footer-element-kind"
}

Add supplementary items to an item by passing in an array of supplementary items when you construct the item:

let itemSize = NSCollectionLayoutSize(widthDimension: .absolute(44),
                                     heightDimension: .absolute(44))
    
let badgeAnchor = NSCollectionLayoutAnchor(edges: [.top, .trailing],
                                fractionalOffset: CGPoint(x: 0.3, y: -0.3))
   
let badgeSize = NSCollectionLayoutSize(widthDimension: .absolute(20),
                                      heightDimension: .absolute(20))
    
let badge = NSCollectionLayoutSupplementaryItem(layoutSize: badgeSize,
                                               elementKind: ElementKind.badge,
                                           containerAnchor: badgeAnchor)
    
let item = NSCollectionLayoutItem(layoutSize: itemSize,
                          supplementaryItems: [badge])

Topics

Creating a Supplementary Item

+ supplementaryItemWithLayoutSize:elementKind:containerAnchor:

Creates a supplementary item of the specified size, with a string to identify the element kind and an anchor relative to a container.

+ supplementaryItemWithLayoutSize:elementKind:containerAnchor:itemAnchor:

Creates a supplementary item of the specified size, with a string to identify the element kind, an anchor relative to a container, and an anchor relative to an item.

Getting the Anchors

itemAnchor

The anchor between the supplementary item and the item it's attached to.

containerAnchor

The anchor between the supplementary item and the container it's attached to.

Getting the Element Kind

elementKind

A string that identifies the type of supplementary item.

Specifying Stacking Order

zIndex

The vertical stacking order of the supplementary item in relation to other items in the section.

Relationships

Conforms To

See Also

Appearance

NSCollectionLayoutAnchor

An object that defines how to attach a supplementary item to an item in a collection view.

NSCollectionLayoutBoundarySupplementaryItem

An object used to add headers or footers to a collection view.

NSCollectionLayoutDecorationItem

An object used to add a background to a section of a collection view.