Compositional Layout

Series dedicated to the new awesome Compositional Layout for UICollectionViews. Learn by reading about different concepts (like layout groups, supplementary views) and also by how-to guides implementing specific layouts. Sample project is available on GitHub.

12 posts

Compositional Layout

Re-creating Apple Photos layout & animations with Compositional Layout

Let's see how we can create layout similar to the native Photos app in iOS. Complete with the transitions.

Swift & iOS

Compositional Layout

How to create responsive Compositional Layout

Let's look at basic example tutorial about creating Compositional Layout that adapts to available screen space.

Swift & iOS

Compositional Layout

How to create sticky headers with Compositional Layout

It is actually quite easy, but you need to know where to activate this behavior. Let's see how to enable pinned headers.

Swift & iOS

Compositional Layout

Useful extensions for CollectionView and Compositional Layout

With a few extensions, you can make working with CollectionViews and Compositional Layout a lot cleaner.

Swift & iOS

Compositional Layout

How to create onboarding with Compositional Layout

Utilizing Compositional Layout to create onboarding flow. Full code example is available.

Swift & iOS

Compositional Layout

How to create grid with Compositional Layout

Let's look at creating basic grid layouts using Compositional Layout.

Swift & iOS

Compositional Layout

Example project showing Compositional Layout and Diffable

Check out my GitHub project for hand-on examples showcasing how to build various layouts using modern APIs.

Swift & iOS

Compositional Layout

Building Instagram profile screen with Compositional Layout

Let's build the profile page with avatar, followers count, highlights and photos.

Swift & iOS

Compositional Layout

Using background decoration views with Compositional Layout

These can help you add a bit of visual flair or maybe imitate the inset table view style.

Swift & iOS

Compositional Layout

Supplementary views with Compositional Layout and Diffable Data Source

In this post we will see how to add badges to CollectionView. You will learn how to add supplementary views, configure them and display them.

Swift & iOS

Compositional Layout

Detailed look at the NSCollectionLayoutGroup

With the NSCollectionLayoutGroup definition we can create quite different layouts while keeping the rest of the code the same.

Swift & iOS

Compositional Layout

Basic anatomy of collection view compositional layout

Understanding the basic building blocks of the great compositional layout for collection views.

Swift & iOS