如何更改 UICollectionView 中单元格之间的空间？

Posted 2023-03-10

【中文标题】如何更改 UICollectionView 中单元格之间的空间？

【英文标题】：How to change space between cells in UICollectionView?

【发布时间】：2016-02-26 14:20:39

【问题描述】：

我想减小行中单元格之间的大小。 现在看起来像：

我正在尝试这个，以减小它们之间的大小：

let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
layout.sectionInset = UIEdgeInsets(top: 20, left: 2, bottom: 10, right: 2)
layout.minimumInteritemSpacing = 0
layout.minimumLineSpacing = 0

但这对我没有帮助。我做错了什么？

【问题讨论】：

@patchdiaz 这不是重复的！我试过这个版本，但它不起作用。这就是我提出这个问题的原因

你是对的！已删除 ;)

你想让你的单元格左对齐，即你的右边会有很多空白空间吗？

这个***.com/questions/17229350/…怎么样？

@TimVermeulen 是的，完全正确！我想要一行 3 个项目，右边有 2 px 的空间，除了最后一个

【参考方案1】：

//Objective c
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath 
        return CGSizeMake((collectionView.frame.size.width/3)-20, 100);
    

// Swift 2.0

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize 
    return CGSizeMake((collectionView.frame.size.width / 3) - 20, 100)


// Swift 3.0
override func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
    return CGSize(width: CGFloat((collectionView.frame.size.width / 3) - 20), height: CGFloat(100))

【讨论】：

@ZacharyGover 你能用可靠的来源支持这个“声明”吗？大多数 Apple 模块仍然是用 Objective-C 编写的，并且在今天仍然被广泛使用。

你知道我说的几乎过时了吗？是的，有些东西仍然是围绕 Objective-C 编写的，尽管随着 Apple 更新 Swift，他们正在重写所有内容。尽管这仍然意味着大多数开发人员都在使用 Swift 编写代码。我试图表达的主要观点是给出两个答案，就像你现在所做的那样。因为很快它就会过时，如果未来的人是编程新手，当他们查看这篇文章寻求帮助时，他们将无法理解它。

【参考方案2】：

转到故事板，右键单击集合视图和

并检查单元格之间的最小间距并将其减小到零。

【讨论】：

现在问题可以在 UIcollectionview 单元格中......检查 UICollectionview 单元格中的约束......不应该有任何填充，休息我需要通过你的代码

在故事板中有两个部分，一个是collectionview，在collectionview下有collectionview flow layout ....你检查了两者的最小间距吗？

【参考方案3】：

在您的代码中，您必须为您的集合视图创建一个 IBOutlet，然后按如下方式分配 collectionViewLayout：

let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
layout.sectionInset = UIEdgeInsets(top: 20, left: 2, bottom: 10, right: 2)
layout.minimumInteritemSpacing = 0
layout.minimumLineSpacing = 0
layout.scrollDirection = .horizontal
collectionView!.collectionViewLayout = layout

【讨论】：

你是我的英雄。

还有一点需要补充：确保collectionview滚动方向为“水平”以修复水平单元格间隙。否则 minimumInteritemSpacing 可能不起作用。（在 Xcode 11.2.1 swift 4.2 中测试）

【参考方案4】：

很简单

let layout = contactsCollectionView.collectionViewLayout as? UICollectionViewFlowLayout
layout?.minimumLineSpacing = 8

【参考方案5】：

Swift 5 编程

lazy var collectionView: UICollectionView = 
        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .horizontal

        //Provide Width and Height According to your need
        let width = UIScreen.main.bounds.width / 4
        let height = UIScreen.main.bounds.height / 10
        layout.itemSize = CGSize(width: width, height: height)

        //Make Space as Zero
        layout.minimumInteritemSpacing = 0
        layout.minimumLineSpacing = 0

        return UICollectionView(frame: self.view.frame, collectionViewLayout: layout)
    ()

您可以在 lazy collectionView 块内提供更多自定义。

【参考方案6】：

extension ViewController: UICollectionViewDelegateFlowLayout 
        func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
            let collectionWidth = collectionView.bounds.width
            return CGSize(width: collectionWidth, height: collectionWidth/2)
        
        func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat 
            return 0
        
        func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat 
            return 100
        
    

【参考方案7】：

如果您在StoryBoard 或Xib 中创建CollectionView，则转到StoryBoard 或Xib 并设置这些值来自

【讨论】：

你能给出一些示例代码来说明如何实现这一点吗？\

不，我没有从 XIB 设置它。在 XIB 上，我只是设置了集合视图单元格

【参考方案8】：

（斯威夫特 4）

点击故事板中的集合视图。 在右侧，单击尺寸检查器。 管理和更改像元大小值，您将自行解决。