Swift UI 集合视图布局

Posted 2023-03-08

【中文标题】Swift UI 集合视图布局

【英文标题】：Swift UI collection view layout

【发布时间】：2015-11-29 13:28:42

【问题描述】：

我试图在我的 SpriteKit 游戏中使用 UIcollectionView 来显示关卡选择场景。集合视图有 6 个部分（开始，世界 1-5），每个部分有 8 个单元（级别 1-8）。它们现在是带有简单 UILabel 的自定义单元格。 我可以使用索引路径的 did 选择项来加载我的关卡，这一切都很好。但是我的问题是以下

集合视图的第一部分是开始屏幕，因此我不希望集合视图显示该部分中的 8 个单元格。该部分应该只显示背景图像和点击开始标签。所以我在 cellForIndexPath 中尝试的是

1) 隐藏该部分中的单元格，但这会导致其他部分中的单元格出现文本标签问题

2）隐藏文本标签并使单元格颜色透明，与1相同的问题

那么基本上我可以做些什么来解决这个问题？

我可以将开始部分放在不同的 SKScene 中，但我更喜欢它全部在集合视图中。 我在想的另一个选择是让每个部分只有一个单元格，屏幕大小，并在除开始部分之外的每个部分添加 8 个 UIButton。 我还需要禁用其中一些单元格/按钮，直到上一级解锁。我不确定有什么更好的方法，8 个单元格作为按钮或 8 个 UIButtons 在 1 个单元格中。

我只是在寻找一个 UICollectionView 解决方案，我已经有了一个替代方案，因为当转换到 tvOS 并使用焦点内容以及通过 30 多个按钮浏览 6 个部分时，它会让我的生活更加轻松

非常感谢您的帮助

【参考方案1】：

你可以在 UICollectionView 中注册更多的一种单元格：

如果您使用的是 Interface builder，请从 Objects 库中添加另一个 Collection View Cell 并设置它的重用标识符 否则，使用self.collectionView?.registerNib(forCellWithReuseIdentifier:) 或self.collectionView?.registerClass(forCellWithReuseIdentifier:) 在 UICollectionViewController 的viewDidLoad 方法中注册 nib 或类

然后当你出列单元格时使用正确的重用标识符：

override func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell 
    var reuseIdentifier = "identifier of cell with 8 button"
    if indexPath.section == 0 
        reuseIdentifier = "identifier of start cell as you set in IB of viewDidLoad"
    
    let cell = collectionView.dequeueReusableCellWithReuseIdentifier(reuseIdentifier, forIndexPath: indexPath)

    // Configure the cell depending on indexPath

    return cell

【讨论】：

非常感谢，这正是我想要的。 UiKit 的新手，所以这对我来说都是全新的。我实际上曾经尝试过这一点，但我的问题是 let cell = ... 行。我是这样写的“let cell = collectionView.dequeueReusableCellWithReuseIdentifier(reuseIdentifier, forIndexPath: indexPath) as!MyCustomCell”。作为！ MyCustomCell 在尝试使用 2 个单元格时给我带来了问题。没有意识到你不需要那条线。再次感谢您

如果我真的可以再问你一个问题。使用你的方式效果很好。如果我决定切换回使用 8 个单元格而不是 1 个带 8 个按钮单元格的单元格，那么在第 1 节 (0) 中是否有类似的技巧来更改单元格大小。我正在使用 flowLayout，所以我在集合视图中定义项目大小，而不是在自定义单元格中。

as! MyCustomCell 表示您想强制将单元格强制转换为 MyCustomCell 类，当您有 2 个不同的单元格时，其中一个（可能）属于另一个类，因此它将失败.您可以在 Interface Builder 中指定单元格的类

你应该自定义实现 UICollectionViewDelegateFlowLayout 的 UICollectionViewDelegate，实现方法 collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize 并根据 indexPath 返回不同的大小

【参考方案2】：

我会选择 8 个单元格作为按钮，而不是将 1 个单元格与一系列 UIButtons 一起使用，这将使事情变得简单并允许您使用 didSelectItemAtIndexPath。您不能只使用 numberOfItemsInSection 在第一部分中仅定义一个单元格吗？

我的方法可能是为您的背景图像使用自定义流布局和补充视图，然后点击开始按钮 - 有点复杂但非常灵活。

【讨论】：

嘿，也谢谢你的帮助。我现在很可能只使用 8 个单元与 Piotrek 建议的具有 2 个自定义单元的组合。我没有完全理解使用 2 个自定义单元创建单元。再次感谢您的帮助