UICollectionView container padding - ios

Question

I am trying to add padding to the container of a UICollectionView. I would like it to appear as such that there is a 10pt padding all around. So in the example screen, there is a 10pt padding on the bottom from:
layout.minimumInteritemSpacing = layout.minimumLineSpacing = 10;
I am using a UICollectionViewFlowLayout to layout the cells. I have also tried a "trick" where I add a 10pt view on top, but the content doesn't appear to scroll through the view since they are separate.

Answer 1

Please try to put following code inside viewDidLoad():
collectionView!.contentInset = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)
This will add padding to every side of the collectionView.
PS: I know the question is here for a while but it might help somebody ;)

Answer 2

It seems like the sectionInset property of your UICollectionViewFlowLayout is what you need to modify.
You can use a UIEdgeInsetsMake to create a UIEdgeInsets with margins for top, left, right, and bottom, and set this to the sectionInset property.
Here's the documentation for UICollectionViewFlowLayout: https://developer.apple.com/library/ios/documentation/uikit/reference/UICollectionViewFlowLayout_class/Reference/Reference.html

Answer 3

I used a couple of methods from the UICollectionViewDelegateFlowLayout delegate to accomplish what I was looking for. I was attempting to add 'padding' to cells that had a shadow. This was to ensure they had the effect of 'floating,' and were not touching the edges of the UICollectionView.
First, call the sizeForItemAt indexPath method and give the cells a size:
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
return CGSize(width: collectionView.bounds.width * 0.80, height: collectionView.bounds.height * 0.98)
}
Then, call the insetForSectionAt section method, and set the insets for the cells:
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
return UIEdgeInsets(top: 20, left: 25, bottom: 20, right: 25)
}

Answer 4

If you're using configurations, set the contentInsetsReference on the layout's configuration to follow layoutMargins, then set layoutMargins on the collectionView itself.
var config = UICollectionLayoutListConfiguration(appearance: .insetGrouped)
config.headerMode = .supplementary
let layout = UICollectionViewCompositionalLayout.list(using: config)
layout.configuration.contentInsetsReference = .layoutMargins
collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout)
collectionView.layoutMargins = .init(top: 16, left: 64, bottom: 16, right: 64)

Answer 5

In case you're using a UICollectionLayoutListConfiguration, it seems that to get smaller margins with certain appearances, you've to do that on section level like this:
private func createLayout() -> UICollectionViewLayout {
let layout = UICollectionViewCompositionalLayout() { (sectionIndex, layoutEnvironment) -> NSCollectionLayoutSection? in
// Create a list configuration as usual
var config = UICollectionLayoutListConfiguration(appearance: .sidebarPlain)
config.headerMode = .supplementary
// Change the section's contentInsets to adjust the side margins
let section = NSCollectionLayoutSection.list(using: config, layoutEnvironment: layoutEnvironment)
section.contentInsets.leading = 10
section.contentInsets.trailing = 10
return section
}
return layout
}
Based on feedback from Apple (https://developer.apple.com/forums/thread/679863)