ios中collectionview项的等间距

Question

我使用集合视图控制器来显示图库中的图像。现在我打破了间距。我不能在集合视图中设置相等的间距..

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section {
    return 0;
}

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section {
    return 0;
}

- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
{
    return UIEdgeInsetsMake(0, 0, 0, 0);
}
- (CGSize)collectionView:(UICollectionView *)collectionView
                  layout:(UICollectionViewLayout *)collectionViewLayout
  sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
    return CGSizeMake(106.0f, 106.0f);
}

这是我的代码..单元格宽度 106 但是 imageview 宽度 104.0f 我在图像的左侧给出了2个点间距现在查看我得到的解决方案如下图所示。

请帮助我解决这个问题......

Answer 1

要查看您的收藏单元格的外观，您可以在故事板的帮助下在故事板中尝试此操作。首先只是为了检查，在你的CollectionViewController中添加一些静态单元格，这样你的屏幕就像这样：

不，你可以看到那些细胞和它们之间的间距。在您的情况下，单元格将以不正确的间距显示，如上所示。现在打开此屏幕打开，打开Interface Builder的Size Inspector。它看起来像这样：

现在，您可以在尺寸检查器窗口中看到一些选项。您可以使用Min调整每个单元格的大小以及它们之间的间距。间距选项。最后，从左侧和右侧使用相等的间距，使用“截面插入选项”。当您更改那里的值时，更改将反映在您的控制器视图中。如果你想增加/减少一些数值，你可以得到一个想法。

希望这有帮助。

Answer 2

嘿，你有没有答案？如果不是@iCoder非常好的想法，首先你可以使用界面构建器来了解我们需要多少间距。 然后你可以使用这些flowLayout委托方法以编程方式设置它们。像我一样：

// 1
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
    NSString *searchTerm = self.students[indexPath.row];
    // 2
    CGSize retval =  CGSizeMake(100, 100);
    retval.height = 190;
    retval.width = 170;

    return retval;
}

// 3
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
{
    return UIEdgeInsetsMake(0, 0, 0, 0);
}

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section 
{
    return 10.0;
}

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section 
{
    return 20.0;
}

Answer 3

快捷键5

设置一些小节插图（您的单元格距CollectionView的框架有多远），您要在一行中保留的单元格数以及单元格之间的间隔

let sectionInsets = UIEdgeInsets(top: 20.0, left: 20.0, bottom: 20.0, right: 20.0)
let numberOfItemsPerRow: CGFloat = 4
let spacingBetweenCells: CGFloat = 10

在UICollectionViewDelegateFlowLayout中使用以上所有值：

   func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        let totalSpacing = (2 * sectionInsets.left) + ((numberOfItemsPerRow - 1) * spacingBetweenCells) //Amount of total spacing in a row

        if let collection = self.collectionView{
            let width = (collection.bounds.width - totalSpacing)/numberOfItemsPerRow
            return CGSize(width: width, height: width)
        } else {
            return CGSize(width: 0, height: 0)
        }
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
        return sectionInsets
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
        return spacingBetweenCells
    }

Answer 4

特殊情况：在单元格中添加了阴影+等距技巧（Swift 4.2）

假设您希望集合视图的所有侧面都等距，然后需要阴影整个侧面？

如果在所有侧面以相等的间距应用阴影，则不会正确获得阴影，因为它将被修剪，并且如果根据其更改大小，则会丢失相等的间距... UICollectionview为什么与我一起这样做？ / p>

最终输出

如果您观察到阴影+下面的等距间距是解决方法

逻辑每边15px

您需要根据所需间距设计单元格

1. 为collectionview单元格创建XIB
   
2. 将名为 TopView 的顶级视图添加到0约束（未选中边距）
   
3. 在 TopView
   
中添加另一个名为 ShadowView 的UIView
4. 如果您观察到，我们已经从left中将contentInset设置为5，则将其设置为15。我们需要添加带有10个常量的前导约束
   
5. 如果您观察到，我们已经将contentInset从右边的10设为15，我们需要添加5个常量的尾随约束
6. 如果您观察到，我们已经从top获得5的contentInset以使其达到15，我们需要添加具有10个常量的Top Constraint
   
7. 如果您观察到，我们已经将Bottom的contentInset从10设置为15，我们需要添加5个常数的Bottom Constraint
8. 将阴影添加到 ShadowView

您的View Controller内部

    // VERY IMPORTANT  
    self.collectionView.contentInset = UIEdgeInsets(top: 5, left: 5, bottom: 10, right: 10)
    self.collectionView.dataSource = self
    self.collectionView.delegate = self

    let collectionViewFLowLayout = UICollectionViewFlowLayout()

    collectionViewFLowLayout.itemSize = CGSize(width: (self.view.bounds.width - (self.collectionView.contentInset.left + self.collectionView.contentInset.right)) / 2, height: 220)
    collectionViewFLowLayout.minimumLineSpacing = 0
    collectionViewFLowLayout.minimumInteritemSpacing = 0
    self.collectionView.collectionViewLayout = collectionViewFLowLayout



        // Calulations
        // In CollectionView Cell constraint left 10 + Content Inset (5) = 15 From Left
        // Cell Constriant Right 5 + Cell constraint left 10  = 15 between GAP
        // Cell Constriant Right 5 + Content Inset (10)  = 15  from Right

希望这会有所帮助：）