Line circle with shadow swift

Question

I created line circle with shadow, but when I tried to change shadowRadius, the shadow was not showing

let path = UIBezierPath(ovalIn: rect)
let shapeLayer              = CAShapeLayer()
shapeLayer.path             = path.cgPath
shapeLayer.fillColor        = UIColor.clear.cgColor
shapeLayer.strokeColor      = UIColor.white.cgColor
shapeLayer.lineWidth        = 1
shapeLayer.shadowOpacity    = 0.9
shapeLayer.shadowColor      = UIColor.white.cgColor
shapeLayer.shadowOffset     = .zero
shapeLayer.shadowRadius     = 10.0
//shapeLayer.shadowPath       = path.cgPath

layer.addSublayer(shapeLayer)

line circle with default corner radius

line circle with corner radius 10.0

Can someone help me?

Yes, but I want bigger shadow with radius more than 20.0. And when I set this radius, I did not see shadow — YuraChudnick, Jul 17 '18 at 10:35

score 7 · Accepted Answer · answered Jul 17 '18 at 12:01

If you want to create the effect off a "stronger" shadow, you can do so by using a shadow path that has been stroked to be larger than the path that's "casting the shadow". This can be achieved using copy(strokingWithWidth:lineCap:lineJoin:miterLimit:transform:):

shapeLayer.shadowPath = path.cgPath.copy(strokingWithWidth: width, lineCap: .round, lineJoin: .round, miterLimit: 0)

This is what such a shadow (in red) looks like, both with and without any blur (shadow radius):

stroked shadow path with and without blur

You can configure the shadowBlur and the width of the stroked shadow path to achieve the effect that you're after. Below are some examples:

A few variations of shadow radius and shadow path stroke width

Line circle with shadow swift

1 Answers1