如何为带渐变遮罩的UIView添加中心圆形遮罩？

当然可以实现，你需要把渐变遮罩层和圆形遮罩层组合到一个容器图层中，再将这个容器图层作为视图的mask。具体实现代码和说明如下：

// 1. 保留原有渐变遮罩层代码
let maskLayer = CAGradientLayer()
maskLayer.frame = CGRect(x: 0, y: 0, width: 200, height: 200)
let innerColor = UIColor(white: 1.0, alpha: 1.0).cgColor
let outerColor = UIColor(white: 1.0, alpha: 0.0).cgColor
maskLayer.colors = [outerColor, innerColor, innerColor, outerColor]
maskLayer.locations = [0.0, 0.20, 0.80, 1.00]
maskLayer.startPoint = CGPoint(x: 0.5, y: 0)
maskLayer.endPoint = CGPoint(x: 0.5, y: 1)

// 2. 创建中心圆形遮罩层
let circleMaskLayer = CAShapeLayer()
// 以视图中心为圆心绘制圆形路径，半径可按需调整
let center = CGPoint(x: maskLayer.frame.midX, y: maskLayer.frame.midY)
let radius: CGFloat = 60
let circlePath = UIBezierPath(arcCenter: center, radius: radius, startAngle: 0, endAngle: .pi * 2, clockwise: true)
circleMaskLayer.path = circlePath.cgPath
circleMaskLayer.fillColor = UIColor.white.cgColor // 不透明填充保证圆形区域有效
circleMaskLayer.frame = maskLayer.frame

// 3. 创建容器图层组合两个遮罩
let containerMaskLayer = CALayer()
containerMaskLayer.frame = maskLayer.frame
containerMaskLayer.addSublayer(maskLayer)
// 设置混合模式为destination-in，只保留渐变层与圆形层重叠的不透明区域
circleMaskLayer.compositingFilter = "destination-in"
containerMaskLayer.addSublayer(circleMaskLayer)

// 4. 将容器图层设为视图的遮罩
self.myView.layer.mask = containerMaskLayer

关键说明： #

• 渐变层：维持你原本的逻辑，实现上下边缘渐变透明、中间区域完全显示的效果。
• 圆形层：通过UIBezierPath绘制中心圆形，填充不透明白色确保该区域在遮罩中为有效显示区。
• 混合模式：destination-in的作用是只保留下方图层（渐变层）与当前图层（圆形层）重叠的不透明部分，最终实现“既在渐变显示区内，又在圆形范围内”的区域才会显示的效果。

如果你的需求是圆形区域完全不受渐变遮罩影响（圆形区域全程显示，其他区域按渐变规则），可以调整图层添加顺序和混合模式：先添加圆形层，再添加渐变层并设置渐变层的compositingFilter = "destination-over"即可。

内容的提问来源于stack exchange，提问作者Gizmodo