集合视图项目重叠

Question

我正在尝试使用垂直方向的流布局设置 NSCollectionView。为了快速测试数据源，我分别从collectionView(_:numberOfItemsInSection:) 和collectionView(_:itemForRepresentedObjectAtIndexPath:) 返回静态数字和视图。

方法如下：

func collectionView(collectionView: NSCollectionView, numberOfItemsInSection section: Int) -> Int {
  return 2
}

func collectionView(collectionView: NSCollectionView,
                    itemForRepresentedObjectAtIndexPath indexPath: NSIndexPath) -> NSCollectionViewItem {
  let item = NSCollectionViewItem()
  let view = NSView()
  item.view = view
  view.wantsLayer = true
  view.layer?.backgroundColor = CGColorCreateGenericGray(0, 0.5)
  view.translatesAutoresizingMaskIntoConstraints = false
  view.widthAnchor.constraintEqualToConstant(100).active = true
  view.heightAnchor.constraintEqualToConstant(100).active = true
  return item
}

基本上，我总是返回 2 个全黑且不透明度为 50% 的 NSCollectionViewItem。当我运行应用程序时，它会将两个视图放在一起。

这是显示两个视图的分解图：

每个项目的大小设置为 50x50，每个方向的最小间距为 10。

我错过了什么？是什么让这些视图被隔开？在documentation 中，它说：

通常，您可以使用此类的属性指定项目的大小及其间距。如果要自定义项目的值，请在指定为集合视图的委托的对象中实现 NSCollectionViewDelegateFlowLayout 协议的方法。

我没有实现这个委托，所以它不应该使用我在界面构建器中输入的值（50x50 和 10 间距）吗？

Answer 1

我仍然不确定到底是什么问题，但我采取了以下措施来解决它：

1. 创建一个带有相关 xib 的 NSCollectionViewItem 子类（让我们调用子类Item）
2. 在界面生成器中将集合视图项添加到文档大纲
3. 将集合视图项的类更改为我的自定义子类 (Item)
4. 将collectionView(_:itemForRepresentedObjectAtIndexPath:)中的代码改为如下：

---

func collectionView(collectionView: NSCollectionView,
                    itemForRepresentedObjectAtIndexPath indexPath: NSIndexPath) -> NSCollectionViewItem {
  return collectionView.makeItemWithIdentifier("Item", forIndexPath: indexPath)
}

现在，我不仅拥有应有的视图布局，而且它们是自定义的，而不仅仅是灰框！关注this 教程帮助我解决了问题。

如果有人想尝试解释实际问题是什么，我将保持开放状态并接受实际回答问题的内容。

Answer 2

我也遇到了同样的问题，假设是同样的事情影响了你，我也找到了解决办法。

当多个 NSCollectionViewItem 子类的实例最终配置为针对同一项目视图时，就会出现所描述的症状。我遇到这种情况的方式非常简单，因为我试图设置一个基于类的项目，但它仍然得到 xib 的支持。像这样的：

1. 创建一个新的 NSCollectionViewItem 子类，指定一个 nibName 和 nibBundle。
2. 创建一个新的 NSView nib。
3. 将集合视图实例拖出，并将其出口连接到视图。
4. 将 File's Owner 类设置为您的子类名称。
5. 将出口连接从 File's Owner 代理拖到视图。
6. 在代码中，使用 NSCollectionView.register(class:...) 设置项目。

现在您已经有了一个可以实例化并自行加载其 nib 的类，这要归功于默认的 NSViewController 机制。但是，当您这样做时，它还会实例化一个 也 指向视图的附加 NSCollectionViewItem 实例。

我的理论是第二种，假的视图项实例在重新布局时最终会被咨询视图定位，并且它默认为 0-0 索引路径，从而导致每个关联的视图被绘制在相同的位置.

修复方法是删除 xib 中伪造的顶级视图项，或者切换到使用基于 register(nib:...) 的方法。