1

I have a circular cashapelayer progress bar, I want to add a glow effect along the path. I have try using shadowcolor, shadowoffset and shadowpath and didnt get the expected result.

let circlePath = UIBezierPath(arcCenter: .zero, radius: (frame.width-10)/2, startAngle: 0, endAngle:CGFloat(Double.pi * 2), clockwise: true)
shapeLayer.path = circlePath.cgPath
shapeLayer.frame =  CGRect(x: frame.width/2, y: frame.height/2, width: 0, height: 0)

shapeLayer.fillColor = UIColor.clear.cgColor
shapeLayer.strokeColor = UIColor(red: 127/255, green: 204/255, blue: 224/255, alpha: 1).cgColor
        //you can change the line width
shapeLayer.lineWidth = 5
shapeLayer.lineCap = .round
shapeLayer.transform = CATransform3DMakeRotation(-CGFloat.pi/2, 0, 0, 1)
shapeLayer.strokeEnd = 0.5
shapeLayer.borderColor = UIColor.red.cgColor
shapeLayer.borderWidth = 0.5

shapeLayer.shadowPath = UIBezierPath(arcCenter: .zero, radius: (frame.width-10)/2, startAngle: 0, endAngle:CGFloat(Double.pi * 2)*0.5, clockwise: true).cgPath
shapeLayer.shadowColor = UIColor(red: 130/255, green: 207/255, blue: 227/255, alpha: 1).cgColor
shapeLayer.shadowRadius = 10
shapeLayer.shadowOffset = .zero
shapeLayer.shadowOpacity = 0.8
layer.addSublayer(shapeLayer)

Desired Effect

enter image description here

What I have so far

enter image description here

dahiya_boy
  • 9,298
  • 1
  • 30
  • 51
Shen Yi
  • 21
  • 4

0 Answers0