Building Apps with Compositional Layout
summary
Shows how UICollectionViewCompositionalLayout assembles UIs from item → group → section → layout and implements an App Store–style screen in five lines of code using fractional and estimated NSCollectionLayoutDimension sizing (fractionalWidth = 1.0, estimated height), nested groups, supplementary headers, and the section count/group count model. Adds orthogonal scrolling with one line (five built‑in behaviors including paging centered). Demonstrates working App Store and Pinterest layouts (two‑section app store, two horizontal groups for Pinterest).
AI-written summary · about
chapters (15)
- 0:00Introduction
- 2:00Flow layout limitations
- 3:48Compositional layout basics
- 5:38Building blocks explained
- 7:26Sizing with NSLayoutDimension
- 8:53Item group section hierarchy
- 10:16Groups and repeating structure
- 11:19Estimated sizing benefits
- 12:48Distinct section layouts
- 13:32Nested groups concept
- 14:36Perpendicular scrolling behavior
- 15:41Paging behaviors overview
- 16:04App store layout implementation
- 16:46Pinterest layout demo
- 17:30Summary and resources
related talks
49mUICollectionViewLayout from scratch
25mSize Doesn't Matter: Building an App for Every iOS Device
33mCombining SwiftUI and UIKit, AppClips and Widgets
54m60 fps UI on iOS
35mScaling beyond Storyboards
23mWriting Your UI Swiftly
37mInspired by SwiftUI, Building a Design System on UIKit
36mSwiftUI Everywhere