UIView图层上的阴影

Question

我已经制作了一条路径来掩盖我的观点:

let path = // create magic path (uiview bounds + 2 arcs)
let mask = CAShapeLayer()
mask.path = path.cgPath
view.layer.masksToBounds = false
view.layer.mask = mask

到目前为止一切都好.

现在我想添加一个跟随路径的阴影,它可能吗？

我尝试了几种方式,最后一种是:

mask.shadowPath = path.cgPath
mask.shadowColor = UIColor.red.cgColor
mask.shadowOffset = CGSize(width: 10, height: 2.0)       
mask.shadowOpacity = 0.5

但这会产生局部阴影和原始视图的颜色.

使用调试视图层次结构

有什么建议？

最终结果应与此类似,但阴影"跟随"路径上的弧.

Answer 1

当您向图层添加蒙版时,它会剪切该蒙版之外的任何内容 - 包括阴影.要实现此目的,您需要在蒙版视图下方添加一个"阴影"视图,该视图与蒙版具有相同的路径.

或者为遮罩视图添加阴影图层superview.

let view = UIView(frame: CGRect(x: 50, y: 70, width: 100, height: 60))
view.backgroundColor = .cyan

let mask = CAShapeLayer()
mask.path = UIBezierPath(roundedRect: view.bounds, cornerRadius: 10).cgPath
view.layer.mask = mask

let shadowLayer = CAShapeLayer()
shadowLayer.frame = view.frame
shadowLayer.path = UIBezierPath(roundedRect: view.bounds, cornerRadius: 10).cgPath
shadowLayer.shadowOpacity = 0.5
shadowLayer.shadowRadius = 5
shadowLayer.masksToBounds = false
shadowLayer.shadowOffset = .zero    

let container = UIView(frame: CGRect(x: 0, y: 0, width: 200, height: 200))
container.backgroundColor = .white
container.layer.addSublayer(shadowLayer)
container.addSubview(view)

如果你打算在其他地方使用它,你可以创建一个ShadowMaskedView包含阴影层和蒙版视图 - 可能带有路径属性.