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.

Answer 1

Add 2 constraints:

1) view - superview

2) view - safeArea

Answer 2

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

collectionView.contentInsetAdjustmentBehavior = .never

Answer 3

Found a solution:

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

Answer 4

You should use safeAreaInsets for iphone X

if #available(iOS 11.0, *) {
    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
}