为什么我的渐变图层覆盖了我的collectionView单元格？

Question

我有一个带有gradientLayer的collectionView。当我构建并运行项目时，我得到了包含collectionView单元格的gradientLayer。任何人都知道如何解决这个问题？

gradientLayer = CAGradientLayer()
gradientLayer.frame = view.frame
gradientLayer.colors = [#colorLiteral(red: 0.09019608051, green: 0, blue: 0.3019607961, alpha: 1).cgColor ,#colorLiteral(red: 0, green: 0, blue: 0, alpha: 1).cgColor]
gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.0)
gradientLayer.endPoint = CGPoint(x: 0.1, y: 0.5)
homeCollectionView.layer.insertSublayer(gradientLayer, at: 0)

Answer 1

问题是集合视图的子视图（单元格）也会向其添加子图层。并且您的渐变图层最终位于其顶部。

一个简单的解决方案是仅使用渐变图层创建单独的视图，并将集合视图放在其中。为集合视图提供清晰的背景将确保在单元格下方显示渐变图层。

Answer 2

鉴于你的目标是将渐变作为背景，你应该使用UICollectionView的backgroundView来保存它：

let bgView = UIView(frame: homeCollectionView.bounds)

gradientLayer = CAGradientLayer()
gradientLayer.frame = view.frame
gradientLayer.colors = [#colorLiteral(red: 0.09019608051, green: 0, blue: 0.3019607961, alpha: 1).cgColor ,#colorLiteral(red: 0, green: 0, blue: 0, alpha: 1).cgColor]
gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.0)
gradientLayer.endPoint = CGPoint(x: 0.1, y: 0.5)

bgView.layer = gradientLayer
homeCollectionVIew.backgroundView = bgView

我写了没有编译器，所以可能需要一些调整。

确保您的集合视图单元格具有透明背景。