uicollectionview remove top padding

Question

I have a UICollectionView that is the entire view but it lives inside "view" (it is not UICollectionViewController). Adding a cell to this collection view shows it in the following order in storyboard:

This is how it looks in the emulator:

I don't understand how to get rid of that view. All the insets are at zero in Storyboard Size Inspector for collection view. Just to be sure, I also have the following code:

override func viewWillLayoutSubviews() {
    let layout = self.collectionViewProducts.collectionViewLayout as! UICollectionViewFlowLayout

    let containerWidth = UIScreen.main.bounds.size.width - 40.0
    let itemWidth = (containerWidth / 3.0)
    let itemHeight = (itemWidth / 0.75) + 30

    layout.sectionInset = UIEdgeInsets(top: 0.0, left: 0.0, bottom: 0.0, right: 0.0)

    layout.itemSize = CGSize(width: itemWidth, height: itemHeight)
}

How can I get rid of that top padding?

Have you tried adding self.collectionView.contentInset = UIEdgeInsetsZero self.collectionView.scrollIndicatorInsets = UIEdgeInsetsZero. Sorry for Swift 2.3 syntax — webjunkie, Mar 26 '17 at 01:49

Joe · Accepted Answer · 2017-03-26T06:02:34.750

You can fix top padding issue by considering one of the following method.

Method 1: Natural way to fix your problem by setting up your collectionView dimensions properly from StoryBoard.

Method 2: **Updated**

You can validate collection frame in viewDidLayoutSubviews or viewWillLayoutSubviews

  override func viewDidLayoutSubviews() {
     collectionView.frame = CGRect(x: 0, y: 0, width: view.frame.width, height: view.frame.height)
}

Method 3: You can Adjust Scroll View Insets from your StoryBoard Attributes Inspector.

Method 4: You can fix this issue programatically by adjusting CollectionView contentInset.

collectionView.contentInset = UIEdgeInsets(top: **Any Value**, left: 0, bottom: 0, right: 0)

Output with top padding 5:

Output with top padding 44:

Output with top padding 64:

score 3 · Answer 2 · answered Mar 26 '17 at 00:38

3

I think because this viewController is embedded in a navigationController. Let select this viewController in the storyboard and uncheck Adjust Scroll View Insets:

answered Mar 26 '17 at 00:38

Danh Huynh

2,269
1
11
16

score 3 · Answer 3 · answered Mar 26 '17 at 02:08

3

Make your Navigation Controller > NavigationBar translucent by unchecking the Translucent check box in IB > Attribute Inspector, and it will work.

answered Mar 26 '17 at 02:08

Joe

2,828
1
14
21

Struggled with this for way too long and this was the fix! – Cole Roberts Dec 10 '17 at 08:28

Tushar Patil · Answer 4 · 2020-08-23T14:41:16.240

2

There is one more way to resolve this issue and that is selecting collectionView -> scrollView Content Insets -> "Automatic" to "Never".

By default scrollView Content Insets value is Automatic. Please check the below image.

For more details check: UIScrollView.ContentInsetAdjustmentBehavior

https://developer.apple.com/documentation/uikit/uiscrollview/2902261-contentinsetadjustmentbehavior

edited Aug 23 '20 at 14:41

answered Aug 23 '20 at 14:30

Tushar Patil

21
4

A great solution – Behzad Moulodi Jan 19 '21 at 13:26

score 0 · Answer 5 · answered Nov 16 '19 at 16:40

I also had the same problem, and i fixed it with a way totally ridiculous solution.

My collectionView contained several sections which had no title & no item cells.

The top, bottom inset values of the section insets were 10 respectively. so each empty section charged height of 20 pixels.

I had 4 empty sections, and therefore, 80 top margins in the collection view.

Hope you check this as well if none of the above solutions works.

uicollectionview remove top padding

5 Answers5

Linked