根据 UIProgressView 状态同步描边填充动画？

Posted 2023-03-13

【中文标题】根据 UIProgressView 状态同步描边填充动画？

【英文标题】：Sync a stroke fill animation based on a UIProgressView status?

【发布时间】：2019-05-02 20:10:57

【问题描述】：

目前我们有一个可以正常工作的圆形进度条，出于测试目的，它是通过点击手势激活的。

 func createCircleShapeLayer() 
    let center = view.center
    if UIDevice.current.userInterfaceIdiom == .pad 
        let circlePath = UIBezierPath(arcCenter: center, radius: 150, startAngle: -CGFloat.pi / 2, endAngle: 2 * CGFloat.pi, clockwise: true)
        circleShapeLayer.path = circlePath.cgPath
     else 
        let circlePath = UIBezierPath(arcCenter: center, radius: 100, startAngle: -CGFloat.pi / 2, endAngle: 2 * CGFloat.pi, clockwise: true)
        circleShapeLayer.path = circlePath.cgPath
    
    circleShapeLayer.strokeColor = UIColor.green.cgColor
    circleShapeLayer.lineWidth = 20
    circleShapeLayer.fillColor = UIColor.clear.cgColor
    circleShapeLayer.lineCap = CAShapeLayerLineCap.round
    circleShapeLayer.strokeEnd = 0
    view.layer.addSublayer(circleShapeLayer)

    //tap gesture used for animation testing
    view.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(anitmateCirleProgress)))


@objc func anitmateCirleProgress() 
    let strokeAnimation = CABasicAnimation(keyPath: strokeEnd)
    strokeAnimation.toValue = 1
    strokeAnimation.duration = 2
    strokeAnimation.fillMode = .forwards
    strokeAnimation.isRemovedOnCompletion = false
    circleShapeLayer.add(strokeAnimation, forKey: "strokeAnimation")

问题是进度条必须能够根据 UIProgressView 的状态填充：例如。

totalProgressView.setProgress(45, 动画: true)

有没有办法根据 UIProgressView 的进度同步动画笔画？

【参考方案1】：

我认为UIProgressView 将进度值从 0 变为 1？如果是这样，您将进度视图设置为 45 的示例代码没有意义。

UIProgressView 和形状图层的 strokeEnd 都使用从 0 到 1 的值，因此您应该能够将进度视图和自定义形状图层的 strokeEnd 设置为相同的小数值并让它们都显示相同完成量。