Introduction

In UICollectionView, “cell spacing” usually means two different layout controls: the spacing between items on the same row and the spacing between rows themselves. If you are using UICollectionViewFlowLayout, both are configurable and often adjusted together with section insets and item size.

The main challenge is that spacing is not independent of cell width. If your item width calculation ignores spacing and insets, the layout will wrap awkwardly or leave inconsistent gaps.

The Three Main Spacing Controls

With flow layout, the most relevant properties are:

• 'minimumInteritemSpacing for spacing between items on the same line'
• 'minimumLineSpacing for spacing between rows'
• 'sectionInset for padding around the whole section'

Here is a direct configuration example.

1import UIKit
2
3let layout = UICollectionViewFlowLayout()
4layout.minimumInteritemSpacing = 8
5layout.minimumLineSpacing = 12
6layout.sectionInset = UIEdgeInsets(top: 16, left: 16, bottom: 16, right: 16)

That gives you a basic grid with predictable spacing rules.

Use the Flow Layout Delegate for Dynamic Values

If spacing depends on screen size or section, implement UICollectionViewDelegateFlowLayout.

1import UIKit
2
3class ViewController: UIViewController, UICollectionViewDelegateFlowLayout {
4    func collectionView(_ collectionView: UICollectionView,
5                        layout collectionViewLayout: UICollectionViewLayout,
6                        minimumLineSpacingForSectionAt section: Int) -> CGFloat {
7        12
8    }
9
10    func collectionView(_ collectionView: UICollectionView,
11                        layout collectionViewLayout: UICollectionViewLayout,
12                        minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
13        8
14    }
15
16    func collectionView(_ collectionView: UICollectionView,
17                        layout collectionViewLayout: UICollectionViewLayout,
18                        insetForSectionAt section: Int) -> UIEdgeInsets {
19        UIEdgeInsets(top: 16, left: 16, bottom: 16, right: 16)
20    }
21}

This is the usual approach when spacing needs to vary by section or environment.

Spacing Depends on Item Size Too

A frequent source of layout bugs is calculating cell width without subtracting insets and inter-item spacing first.

For two columns with 16-point horizontal insets and 8-point spacing between cells:

1func collectionView(_ collectionView: UICollectionView,
2                    layout collectionViewLayout: UICollectionViewLayout,
3                    sizeForItemAt indexPath: IndexPath) -> CGSize {
4    let totalHorizontalInset: CGFloat = 16 + 16
5    let spacing: CGFloat = 8
6    let width = (collectionView.bounds.width - totalHorizontalInset - spacing) / 2
7    return CGSize(width: width, height: width)
8}

If you skip this calculation and just divide the full width by two, your spacing rules will appear to “not work” because the cells already consumed the available space.

Section Insets Versus Cell Spacing

Developers often mix these up.

• section inset controls the outer margin around the section
• inter-item spacing controls gaps between neighboring cells
• line spacing controls vertical gaps between rows

If the first cell is too close to the edge, change the inset, not the inter-item spacing.

Modern Layouts Can Use Compositional Layout

If you are building a newer layout with UICollectionViewCompositionalLayout, spacing is configured differently through groups and item content insets. That model is often better for complex screens, but the same design principle applies: decide where outer padding ends and item-to-item spacing begins.

For simple grids, flow layout is still easier to reason about.

Common Pitfalls

A common mistake is setting spacing correctly but forgetting to account for it when calculating item size. The result is unexpected wrapping or compressed cells.

Another mistake is trying to use line spacing to create outer margins. That is what section insets are for.

Developers also sometimes expect the minimum spacing values to guarantee exact spacing in every situation. Flow layout may adjust placement slightly depending on available space.

Finally, if the layout seems inconsistent, check whether self-sizing cells or estimated sizes are influencing the final geometry.

Summary

• In flow layout, cell spacing is mainly controlled by inter-item spacing, line spacing, and section insets.
• Item size and spacing must be calculated together, not independently.
• Use UICollectionViewDelegateFlowLayout when spacing should be dynamic.
• Section insets handle outer margins; inter-item spacing handles gaps between cells.
• Most spacing bugs are really sizing bugs in disguise.