CollectionView header content under status bar

Question

Here's a collection view constrained to top, left, right, and bottom of the superview with safe area layout guide enabled:

I want my collection view header to be shown under the status bar. I've achieved this for iPhone 4 - 8+ screen dimensions by unchecking Safe Area Layout Guide in the size inspector for the controller's main view, and adding the following code:

collectionView.contentInset = UIEdgeInsets(top: -20, left: 0, bottom: 0, right: 0)

This looks great for non iPhone X view sizes:

However, for the iPhone X, this leads to the following output:

The iPhone X has its own dimensions for the status bar. Adjusting the top inset further does work, but will over-offset the other device sizes. I am wondering if there's an more elegant way to achieve this behaviour.

Menes

Answer 1

Found a solution:

collectionView.contentInset.top = -UIApplication.shared.statusBarFrame.height

Menes

Answer 2

The previous solutions work, but this might be the easiest one:

collectionView.contentInsetAdjustmentBehavior = .never

Tip

Indeed, but this will cause the bottom to go under the bottom safe area. This is not something that you might want. – Poleyn

Answer 3

This will do

collectionView.contentInsetAdjustmentBehavior = .never

Voltmer

this must be marked as accepted answer, you are my hero! – Albumose

Answer 4

You should use safeAreaInsets for iphone X

if #available(iOS 11.0, *) {
    if let top = UIApplication.shared.keyWindow?.safeAreaInsets.top {
        collectionView.contentInset = UIEdgeInsets(top: -top, left: 0, bottom: 0, right: 0)
    }
} else {
    // Fallback on earlier versions
    collectionView.contentInset.top = -UIApplication.shared.statusBarFrame.height
}

Westerman

Answer 5

Add 2 constraints:

1) view - superview

2) view - safeArea

Margarethe