UICollectionView间距边距

我有一个显示照片的UICollectionView 。 我已经使用UICollectionViewFlowLayout创build了collectionview。 它运作良好，但我想间隔边缘。 是否有可能做到这一点使用UICollectionViewFlowLayout或必须实现我自己的UICollectionViewLayout ？

Answer 1

您可以为您的UICollectionView使用collectionView:layout:insetForSectionAtIndex:方法，或设置附加到您的UICollectionView的UICollectionViewFlowLayout对象的sectionInset属性：

 - (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{ return UIEdgeInsetsMake(top, left, bottom, right); } 

要么

 UICollectionViewFlowLayout *aFlowLayout = [[UICollectionViewFlowLayout alloc] init]; [aFlowLayout setSectionInset:UIEdgeInsetsMake(top, left, bottom, right)]; 

Answer 2

要在整个 UICollectionView上添加间距：

 UICollectionViewFlowLayout *flow = (UICollectionViewFlowLayout*) collection.collectionViewLayout; flow.sectionInset = UIEdgeInsetsMake(topMargin, left, bottom, right); 

玩同一行的元素之间的间距（如果你是水平滚动的话），以及它们的大小：

 flow.itemSize = ...; flow.minimumInteritemSpacing = ...; 

Answer 3

在Interface Builder中设置插图，如下面的截图所示

会导致这样的事情：

Answer 4

只是为了纠正这个页面中的一些错误信息：

1- minimumInteritemSpacing ： 在同一行中的项目之间使用的最小间距。

默认值：10.0。

（对于垂直滚动的网格，此值表示同一行中的项目之间的最小间距。）

2- minimumLineSpacing ： 网格中各项之间使用的最小间距。

参考： http : //developer.apple.com/library/ios/#documentation/uikit/reference/UICollectionViewFlowLayout_class/Reference/Reference.html

Answer 5

Swift 3.1

  let itemSpacing: CGFloat = 3 let itemsInOneLine = 3 flow.sectionInset = UIEdgeInsetsMake(0, 0, 0, 0) let width = UIScreen.main.bounds.size.width - itemSpacing * (itemsInOneLine - 1) //collectionView.frame.width is the same as UIScreen.main.bounds.size.width here. flow.itemSize = CGSize(width: floor(width/itemsInOneLine), height: width/itemsInOneLine) flow.minimumInteritemSpacing = 3 flow.minimumLineSpacing = 3 

Answer 6

在UICollectionViewFlowLayout -Object上使用setMinimumLineSpacing:和setMinimumInteritemSpacing: ：。

Answer 7

为了把CollectionItem之间的空间使用这个

在viewdidload中写这两行

 UICollectionViewFlowLayout *collectionViewLayout = (UICollectionViewFlowLayout*)self.collectionView.collectionViewLayout; collectionViewLayout.sectionInset = UIEdgeInsetsMake(<CGFloat top>, <CGFloat left>, <CGFloat bottom>, <CGFloat right>) 

Answer 8

使用collectionViewFlowLayout.sectionInset或者collectionView:layout:insetForSectionAtIndex:是正确的。

但是，如果您的collectionView有多个部分，并且想要为整个collectionView添加边距，我推荐使用scrollView contentInset：

 UIEdgeInsets collectionViewInsets = UIEdgeInsetsMake(50.0, 0.0, 30.0, 0.0); self.collectionView.contentInset = collectionViewInsets; self.collectionView.scrollIndicatorInsets = UIEdgeInsetsMake(collectionViewInsets.top, 0, collectionViewInsets.bottom, 0); 

Answer 9

要为指定的单元格添加边距，可以使用此自定义stream布局。 https://github.com/voyages-sncf-technologies/VSCollectionViewCellInsetFlowLayout/

 extension ViewController : VSCollectionViewDelegateCellInsetFlowLayout { func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForItemAt indexPath: IndexPath) -> UIEdgeInsets { if indexPath.item == 0 { return UIEdgeInsets(top: 0, left: 0, bottom: 10, right: 0) } return UIEdgeInsets.zero } } 

Answer 10

Swift 4.0，Xcode 9

虽然这个线程已经包含了一堆有用的答案，但我想根据William Hu的回答添加一个Swift 4.0版本。

它还解决了原始答案的问题，即不同行之间的间距有时不匹配同一行中的项目之间的间距。 此外，通过设置最小宽度，代码将自动计算一行中的项目数量，并将该样式应用于stream程布局。

 // Create flow layout let flow = UICollectionViewFlowLayout() // Define layout constants let itemSpacing: CGFloat = 1 let minimumCellWidth: CGFloat = 120 let collectionViewWidth = collectionView!.bounds.size.width // Calculate other required constants let itemsInOneLine = CGFloat(Int((collectionViewWidth - CGFloat(Int(collectionViewWidth / minimumCellWidth) - 1) * itemSpacing) / minimumCellWidth)) let width = collectionViewWidth - itemSpacing * (itemsInOneLine - 1) let cellWidth = floor(width / itemsInOneLine) let realItemSpacing = itemSpacing + (width / itemsInOneLine - cellWidth) * itemsInOneLine / (itemsInOneLine - 1) // Apply values flow.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0) flow.itemSize = CGSize(width: cellWidth, height: cellWidth) flow.minimumInteritemSpacing = realItemSpacing flow.minimumLineSpacing = realItemSpacing // Apply flow layout collectionView?.setCollectionViewLayout(flow, animated: false) 

Answer 11

在每个部分之间添加10px的分隔就写下来

 flowLayout.sectionInset = UIEdgeInsetsMake(0.0, 0.0,10,0); 

Answer 12

 - (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section { return UIEdgeInsetsMake(7, 10, 5, 10); } 

Answer 13

对我来说只有帮助：

 customFlowLayout.itemSize = CGSizeMake(self.view.frame.size.width / 3 - 3, self.view.frame.size.width / 3 - 3); customFlowLayout.scrollDirection = UICollectionViewScrollDirectionVertical; customFlowLayout.minimumInteritemSpacing = 3; customFlowLayout.minimumLineSpacing = 5;` 

minimumLineSpacing是上下图片之间的间距。 minimumInteritemSpacing设置相邻图片之间的最小间距。

但是你也应该看看这里self.view.frame.size.width / 3 - 3 。 前3个是连续多less张图片，第二个3是间距。

有结果