UICollectionview 上的圆角而不是单个单元格

Posted 2023-02-24

【中文标题】UICollectionview 上的圆角而不是单个单元格

【英文标题】：Rounding corners on UICollectionview and not individual cells

【发布时间】：2016-10-18 16:39:22

【问题描述】：

我想在我的UICollectionView 上设置 2 个圆顶角

我有一个包含我的UICollectionView 的UIView contentView。如果我将UICollectionView 的cornerRadius 设置为true，并将clipsToBound 设置为true，则此方法有效，只是它会将所有4 个角 变圆。

看来我需要申请UIBezierPath，但一旦我这样做了，我就会遇到问题：

如果我将UIBezierPath 应用于UICollectionView 本身，我只能看到我的第一个单元格，而当我滚动到第二个单元格时，我什么也看不到。

[

[UIBezierPath bezierPathWithRoundedRect:self.collectionView.bounds
 byRoundingCorners:UIRectCornerTopLeft cornerRadii:CGSizeMake(9.0,
 9.0)];     
CAShapeLayer *maskLayer = [CAShapeLayer layer];
maskLayer.frame = self.collectionView.bounds;
maskLayer.path = maskPath.CGPath;
self.collectionView.layer.mask = maskLayer;

如果我尝试将 UIBezierPath 应用到 contentView，与上述相同，但我将 self.collectionView 替换为 self.contentView >，边角一点都不圆。

【问题讨论】：

您是否尝试过为整个 collectionView 添加圆角半径并将 clipsToBounds 设置为 YES？

@Rikh 请查看我编辑的问题

你是否为collectionViewCell或collectionView过度使用drawRect？

【参考方案1】：

把你的collectionView所在的view取整一下怎么样？

类似这样的：

let viewFrame = CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height)
let corners: UIRectCorner = .topLeft
let path = UIBezierPath(
    roundedRect: viewFrame,
    byRoundingCorners: corners,
    cornerRadii: CGSize(width: 50, height: 50))
let maskLayer = CAShapeLayer()
maskLayer.frame = viewFrame
maskLayer.path = path.cgPath
view.layer.mask = maskLayer 

【讨论】：

如果我将 UIBezierPath 应用到包含我的 UICollectionView 的 contentView，那么这些角根本不会被圆角。请参阅我编辑的问题。

【参考方案2】：

只要父视图不是我的第一个/顶视图，就可以在UICollectionView 父容器上设置UIBezierPath。我不得不将另一个UIView roundContainerView 添加到我的顶部UIView。

UIView ( Top view. contentView )

  |- UIView ( roundContainerView ) apply UIBezierPath here

       |- UICollectionView ( collectionView )