StepCircleView.swift 3.05 KB
//
//  StepCircleView.swift
//  Twear
//
//  Created by yangbin on 2022/1/6.
//

import UIKit

class StepCircleView: UIView {
    
    private lazy var bgLayer: CAShapeLayer = CAShapeLayer()
    // 延迟初始化进度条层,采用 stroke 来绘制边框
    private lazy var progressLayer: CAShapeLayer = CAShapeLayer()
    
    var value: Int = 0 {
        didSet {
            progressLayer.strokeEnd = CGFloat(value)/100
        }
    }
    
    @IBOutlet weak var stepLabel: UILabel!
    
    @IBOutlet weak var locLabel1: UILabel!
    @IBOutlet weak var locLabel2: UILabel!
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        initFromNib()
        setupUI()
    }
    
    
    required init?(coder: NSCoder) {
        super.init(coder: coder)
        initFromNib()
        setupUI()
    }
    override class func awakeFromNib() {
        super.awakeFromNib()
       
    }
    
    private func setupUI() {
        locLabel1.text = LocString("步数")
        locLabel2.text = LocString("步")
        // 0.25 透明度的白色背景
        bgLayer.fillColor = nil
        bgLayer.strokeColor = LineColor.cgColor
        bgLayer.lineWidth = 10
        bgLayer.lineCap = .round
        layer.addSublayer(bgLayer)
        
        // 边框全白,边框宽度为 4
//        progressLayer = CAShapeLayer()
        progressLayer.fillColor = nil
        progressLayer.strokeColor = UIColor.rgbColorFromHex(0x1DDCC5).cgColor
        progressLayer.lineWidth = 10
        layer.addSublayer(progressLayer)
        
        
        let radius = bounds.height / 2 - 5
        let end = CGFloat(Double.pi * 2) + CGFloat(Double.pi / 2 * 0.3)
        bgLayer.path = UIBezierPath(arcCenter: CGPoint(rect: bounds), radius: radius,
                                    startAngle: CGFloat(Double.pi / 2 * 1.7), endAngle: end,
                                    clockwise: true).cgPath
        
//        = progressPath.cgPath
        // 设置 start 从 12点钟方向开始(默认是3点钟方向)
        // end = 360度 * progress - start
        // 设置为 顺时针 方向
        
        let progressPath = UIBezierPath(arcCenter: CGPoint(rect: bounds), radius: radius,
                                          startAngle: CGFloat(Double.pi / 2 * 1.7), endAngle: end,
                                          clockwise: true)
        progressLayer.lineCap = .round
        progressLayer.path = progressPath.cgPath
        progressLayer.strokeEnd = 0
    }
    
    private func initFromNib() {
        if let view = UINib(nibName: "StepCircleView", bundle: Bundle(for: type(of: self))).instantiate(withOwner: self, options: nil).first as? UIView {
            view.frame = bounds
            self.addSubview(view)
        }
    }
    
    override func layoutSubviews() {
        refreshUI()
    }
    
    private func refreshUI() {

        
    }
    /*
    // Only override draw() if you perform custom drawing.
    // An empty implementation adversely affects performance during animation.
    override func draw(_ rect: CGRect) {
        // Drawing code
    }
    */

}