TechnologiesSwiftUI

UIHostingConfiguration struct

iOSmacOStvOSwatchOSvisionOS✓ renders

A content configuration suitable for hosting a hierarchy of SwiftUI views.

How it works

UIHostingConfiguration is a UIKit content configuration that hosts a SwiftUI view hierarchy directly inside a UICollectionViewCell or UITableViewCell. It lets you describe a cell's appearance with SwiftUI's declarative layout instead of building the view tree by hand, and hand the result to the cell's contentConfiguration property. Reach for it when you want to keep a UIKit collection or table view while writing each cell's content the SwiftUI way, so a single layout like the HStack row in UIHostingConfigurationDemo can be reused as cell content without bridging through UIHostingController.

  1. Author the cell content as a SwiftUI view

    Everything a UIHostingConfiguration shows is an ordinary SwiftUI view tree, so you build the row exactly as you would any other layout. Here that content is the body of UIHostingConfigurationDemo — an HStack pairing a leading Image(systemName: "star.fill"), a VStack of Text("Favorites") and Text("3 items"), a Spacer, and a trailing chevron — the view hierarchy you intend to host inside a cell.

  2. Wrap the view in UIHostingConfiguration { ... }

    You create the configuration with an initializer that takes a SwiftUI view builder, UIHostingConfiguration { content }. The closure returns the same body shown in UIHostingConfigurationDemo, so the HStack becomes the content the configuration manages and sizes for you.

  3. Assign it to the cell's contentConfiguration

    A UIHostingConfiguration conforms to UIContentConfiguration, which means you set it on a cell's contentConfiguration property (typically from a UICollectionView.CellRegistration handler). The cell then renders and lays out the hosted SwiftUI content — the star, the Favorites label, and the chevron — as its own content view.

  4. Tune the host with margins and background modifiers

    UIHostingConfiguration exposes modifiers such as margins(_:_:) and background(_:) that govern how the SwiftUI content sits within the cell, independent of the SwiftUI .padding() applied inside body. Use margins to control the inset around the hosted HStack and background to give the host its own backing surface.

Try it — Change Text("3 items") to a longer string and watch the cell grow to fit it — UIHostingConfiguration self-sizes the cell from the hosted SwiftUI content rather than a fixed rowHeight.

Example & preview

Press Run live & edit to compile it in your browser — then edit the Swift on the left and the preview re-renders live.

UIHostingConfiguration.swift
struct UIHostingConfigurationDemo: View {
    // UIHostingConfiguration hosts SwiftUI inside a UIKit cell.
    // This is the SwiftUI content you'd pass to it.
    var body: some View {
        HStack(spacing: 12) {
            Image(systemName: "star.fill")
                .foregroundStyle(.yellow)
                .font(.title2)
            VStack(alignment: .leading, spacing: 2) {
                Text("Favorites")
                    .font(.headline)
                Text("3 items")
                    .font(.subheadline)
                    .foregroundStyle(.secondary)
            }
            Spacer()
            Image(systemName: "chevron.right")
                .foregroundStyle(.tertiary)
        }
        .padding()
    }
}
Live preview
Favorites 3 items
Favorites 3 items
swift → lexer → parser → sema → uiir → canvas Open in Studio ↗
What's new in SwiftUI 27 →