前言

最近忙于新版APP的研发,在项目开始之初便打算使用swift 来写了，在OC 迁 swift过程中重写了很多OC中的框架，网络请求框架，蓝牙框架等等，在这期间踩了很多的坑，最坑的是在网络请求的框架封装的过程遇到过网络请求成功但是数据为空的，还有在蓝牙解析数据收到数据为Data类型数据处理问题。不过还好，这些问题一一解决了，又在新的APP中遇到表盘的需求，就想和有同样需求的伙伴分享一下，算是对我以前OC版本制作表盘的一个补充。

正文

先看一下效果:

效果图

大家会发现和我以前分享OC版本有一点点区别
主要分一下几个步骤进行

1.创建内层弧线

let cicrle = UIBezierPath(arcCenter: view.center,
                                  radius: 100,
                                  startAngle: -(CGFloat(M_PI*9)/8),
                                  endAngle: (CGFloat(M_PI)/8),
                                  clockwise: true)
        let shapeLayer = CAShapeLayer()
        shapeLayer.lineWidth = 10.0
        shapeLayer.lineCap = "round"
        shapeLayer.fillColor = UIColor.white.cgColor
        shapeLayer.strokeColor = UIColor(colorLiteralRed: 185/255.0, green: 243/255.0, blue: 110/255.0, alpha: 1.0).cgColor
        shapeLayer.path = cicrle.cgPath
        
        self.view.layer.addSublayer(shapeLayer)

2.创建刻度

 let perAngle: CGFloat = CGFloat(M_PI*5)/4/50
        
        for i in 0...50 {
            
            let startAngle = -(CGFloat(M_PI*9)/8) + perAngle*CGFloat(i)
            let endAngle = startAngle + perAngle/5
            
            let tickPath = UIBezierPath(arcCenter: view.center,
                                        radius: 140,
                                        startAngle: startAngle,
                                        endAngle: endAngle,
                                        clockwise: true)
            
            let perLayer = CAShapeLayer()
            if i%5 == 0{
                print(i)
                perLayer.strokeColor = UIColor.orange.cgColor
                perLayer.lineWidth = 10.0
                
            }else{
                
                perLayer.strokeColor = UIColor.orange.cgColor
                perLayer.lineWidth = 5.0
            }
            
            perLayer.path = tickPath.cgPath
            
            self.view.layer.addSublayer(perLayer)
        }

3.创建刻度值Label

        let textAngle = Float(M_PI*5)/4/10
        
        for i in 0...10 {
            
            let point = calculateTextPositon(view.center,-Float(M_PI)/8+textAngle*Float(i))
            let tickString = "\(labs(10-i)*10)"
            
            let label = UILabel(frame: CGRect(x: point.x - 8, y: point.y - 7, width: 23, height: 14))
            label.text = tickString
            label.font = UIFont.systemFont(ofSize: 10)
            label.textColor = UIColor.gray
            label.textAlignment = .center
            view.addSubview(label)
        }
    /// 计算文本的位置
    private func calculateTextPositon(_ ArcCenter: CGPoint,_ angle: Float) -> CGPoint{
    
        let x = 155 * cosf(angle)
        let y = 155 * sinf(angle)
    
        return CGPoint(x: ArcCenter.x + CGFloat(x), y: ArcCenter.y - CGFloat(y))
    }

4.创建进度曲线

        /// 进度曲线
        let progressPath = UIBezierPath(arcCenter: view.center,
                                        radius: 120,
                                        startAngle: -(CGFloat(M_PI*9)/8),
                                        endAngle: (CGFloat(M_PI)/8),
                                        clockwise: true)
        progressLayer.lineWidth = 30.0
        progressLayer.fillColor = UIColor.clear.cgColor
        progressLayer.strokeColor = UIColor.cyan.cgColor
        progressLayer.path = progressPath.cgPath
        progressLayer.strokeStart = 0
        progressLayer.strokeEnd = 0.5
        view.layer.addSublayer(progressLayer)

5.模拟进度变化

 timer = Timer.scheduledTimer(timeInterval: 2.0, target: self, selector: #selector(timesTest), userInfo: nil, repeats: true)

@objc func timesTest(){
    
        let a = CGFloat(arc4random()%100)
        
        UIView.animate(withDuration: 0.3) { 
            self.progressLayer.strokeEnd = a*0.01
        }
    }

通过以上的代码，你会很清爽的实现一个表盘需求的实现，你会发现swift语言代码的简洁性，OC 的版本由于时间原因没有放一份代码，swift版本分享一个简版的demo,具体在需求中，可以将其封装后再使用。
demo 地址:
https://github.com/markdashi/panelShare.git