使用Swift 4在iOS中自定义循环进度栏

在开始之前，让我先向您展示我们所需的输出！

当点击圆圈时，进度动画应该开始！

开始编码前要考虑的几件事！

• 我们需要两层，一层用于循环层，另一层用于进度层。
• 圆环层和进度层都可以从相同的UIBezierPath中绘制。
• 通过使用strokeEnd属性，我们可以处理Progress Animation。
• 通过点击圆圈，进度动画应该开始！

让我们拍摄我们的Xcode：]

• 创建一个新的Xcode项目并使用您喜欢的名称创建一个新的swift文件！

 导入UIKit 

  class CircularProgressView：UIView { 

  //首先创建两个图层属性 

 私人var circleLayer = CAShapeLayer（） 
 私人var progressLayer = CAShapeLayer（） 

 覆盖init（frame：CGRect）{ 

  super.init（frame：框架） 

  createCircularPath（） 

  } 

 需要初始化吗？（编码器aDecoder：NSCoder）{ 

  super.init（编码器：aDecoder） 

  createCircularPath（） 

  } 

  func createCircularPath（）{ 

 让CircularPath = UIBezierPath（arcCenter：CGPoint（x：frame.size.width / 2.0，y：frame.size.height / 2.0），半径：80，startAngle：-.pi / 2，endAngle：2 * .pi，顺时针：正确） 

  circleLayer.path = CircularPath.cgPath 

  circleLayer.fillColor = UIColor.clear.cgColor 

  circleLayer.lineCap = .round 

  circleLayer.lineWidth = 20.0 

  circleLayer.strokeColor = UIColor.black.cgColor 

  progressLayer.path = CircularPath.cgPath 

  progressLayer.fillColor = UIColor.clear.cgColor 

  progressLayer.lineCap = .round 

  progressLayer.lineWidth = 10.0 

  progressLayer.strokeEnd = 0 

  progressLayer.strokeColor = UIColor.red.cgColor 

  layer.addSublayer（circleLayer） 

  layer.addSublayer（progressLayer） 

  } 

  func progressAnimation（持续时间：TimeInterval）{ 

 让CircularProgressAnimation = CABasicAnimation（keyPath：“ strokeEnd”） 

  CircularProgressAnimation.duration =持续时间 

  CircularProgressAnimation.toValue = 1.0 

  CircularProgressAnimation.fillMode = .forwards 

  CircularProgressAnimation.isRemovedOnCompletion =否 

  progressLayer.add（circularProgressAnimation，forKey：“ progressAnim”） 

  } 

  }