Swift 3：如何为类似于进度条的视图背景颜色设置动画

Posted 2023-03-15

【中文标题】Swift 3：如何为类似于进度条的视图背景颜色设置动画

【英文标题】：Swift 3: How to animate a view background color similar to a progress bar

【发布时间】：2017-06-02 21:05:48

【问题描述】：

当用户进入包含下图的视图控制器时，我希望根据本例中为 70 的值对蓝色进行动画处理。这意味着，颜色从视图中的 0px 开始加载，并且停止在任何值的数量上。另外，我希望在加载颜色的同时从 0 计数到最终值。是否有任何提示/链接或一些方向可以指出我以实现这一目标？提前致谢！

【参考方案1】：

使用所需的backgroundColor 创建progressView

let progressView = UIView(frame: CGRect(x: 0, y: 0, width: 1, height: 50))
progressView.backgroundColor = .blue
self.view.addSubview(progressView)

调用以下函数以使其宽度与progress成比例

func setProgress(_ progress: CGFloat) 
    let fullWidth: CGFloat = 200
    let newWidth = progress/100*fullWidth
    UIView.animate(withDuration: 1.5) 
        self.progressView.frame.size = CGSize(width: newWidth, height: self.progressView.frame.height)
    

创建一个progressLabel 和一个currentProgress 变量

let progressLabel = UILabel(frame: CGRect(x: 0, y: 100, width: 50, height: 50))
var currentProgress: CGFloat = 0
label.text = String(currentProgress)
self.view.addSubview(progressLabel)

调用以下函数循环更新进度，有延迟，例如：setLabelProgress(initialValue: self.currentProgress, targetValue: 70)

func setLabelProgress(initialValue: CGFloat, targetValue: CGFloat) 

    guard currentProgress != targetValue else  return 

    let range = targetValue - initialValue
    let increment = range/CGFloat(abs(range))
    let duration: TimeInterval = 1.5
    let delay = duration/TimeInterval(range)
    currentProgress += increment
    progressLabel.text = String(describing: currentProgress)

    DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + delay) 
        self.setLabelProgress(initialValue: initialValue, targetValue: targetValue)
    

对于第二个标签调用相同的函数，但交换 initialValue 和 targetValue