<!--
{
  "availability" : [
    "macOS: 10.15.0 -"
  ],
  "documentType" : "symbol",
  "framework" : "AppKit",
  "identifier" : "/documentation/AppKit/NSCollectionLayoutSupplementaryItem",
  "metadataVersion" : "0.1.0",
  "role" : "Class",
  "symbol" : {
    "kind" : "Class",
    "modules" : [
      "AppKit"
    ],
    "preciseIdentifier" : "c:objc(cs)NSCollectionLayoutSupplementaryItem"
  },
  "title" : "NSCollectionLayoutSupplementaryItem"
}
-->

# NSCollectionLayoutSupplementaryItem

An object used to add an extra visual decoration to an item in a collection view.

```
class NSCollectionLayoutSupplementaryItem
```

## 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, for example:

```objc
NSString* const ELEMENT_KIND_BADGE = @"badge-element-kind";
NSString* const ELEMENT_KIND_BACKGROUND = @"background-element-kind";
NSString* const ELEMENT_KIND_SECTION_HEADER = @"section-header-element-kind";
NSString* const ELEMENT_KIND_SECTION_FOOTER = @"section-footer-element-kind";
NSString* const ELEMENT_KIND_LAYOUT_HEADER = @"layout-header-element-kind";
NSString* const ELEMENT_KIND_LAYOUT_FOOTER = @"layout-footer-element-kind";
```

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

```objc
NSCollectionLayoutSize *itemSize = [NSCollectionLayoutSize sizeWithWidthDimension:[NSCollectionLayoutDimension absoluteDimension:44.0] heightDimension:[NSCollectionLayoutDimension absoluteDimension:44.0]];

NSCollectionLayoutAnchor *badgeAnchor = [NSCollectionLayoutAnchor layoutAnchorWithEdges: NSDirectionalRectEdgeTop|NSDirectionalRectEdgeTrailing fractionalOffset:CGPointMake(0.3, -0.3)];

NSCollectionLayoutSize *badgeSize = [NSCollectionLayoutSize sizeWithWidthDimension:[NSCollectionLayoutDimension absoluteDimension:20.0] heightDimension:[NSCollectionLayoutDimension absoluteDimension:20.0]];

NSCollectionLayoutSupplementaryItem *badge = [NSCollectionLayoutSupplementaryItem supplementaryItemWithLayoutSize:badgeSize elementKind:ELEMENT_KIND_BADGE containerAnchor:badgeAnchor];

NSCollectionLayoutItem *item = [NSCollectionLayoutItem itemWithLayoutSize:itemSize supplementaryItems:@[badge]];
```

## Topics

### Creating a supplementary item

[`+  supplementaryItemWithLayoutSize:elementKind:containerAnchor:`](/documentation/AppKit/NSCollectionLayoutSupplementaryItem/init(layoutSize:elementKind:containerAnchor:))

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

[`+  supplementaryItemWithLayoutSize:elementKind:containerAnchor:itemAnchor:`](/documentation/AppKit/NSCollectionLayoutSupplementaryItem/init(layoutSize:elementKind:containerAnchor:itemAnchor:))

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

### Getting the anchors

[`itemAnchor`](/documentation/AppKit/NSCollectionLayoutSupplementaryItem/itemAnchor)

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

[`containerAnchor`](/documentation/AppKit/NSCollectionLayoutSupplementaryItem/containerAnchor)

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

### Getting the element kind

[`elementKind`](/documentation/AppKit/NSCollectionLayoutSupplementaryItem/elementKind)

A string that identifies the type of supplementary item.

### Specifying stacking order

[`zIndex`](/documentation/AppKit/NSCollectionLayoutSupplementaryItem/zIndex)

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

## Relationships

### Conforms To

[`CustomDebugStringConvertible`](/documentation/Swift/CustomDebugStringConvertible)

[`CustomStringConvertible`](/documentation/Swift/CustomStringConvertible)

[`Hashable`](/documentation/Swift/Hashable)

[`CVarArg`](/documentation/Swift/CVarArg)

[`NSCopying`](/documentation/Foundation/NSCopying)

[`Equatable`](/documentation/Swift/Equatable)

[`NSObjectProtocol`](/documentation/ObjectiveC/NSObjectProtocol)

### Inherits From

[`NSCollectionLayoutItem`](/documentation/AppKit/NSCollectionLayoutItem)

### Inherited By

[`NSCollectionLayoutBoundarySupplementaryItem`](/documentation/AppKit/NSCollectionLayoutBoundarySupplementaryItem)

---

Copyright &copy; 2026 Apple Inc. All rights reserved. | [Terms of Use](https://www.apple.com/legal/internet-services/terms/site.html) | [Privacy Policy](https://www.apple.com/privacy/privacy-policy)