对带图案的 UIView 进行动画处理以模仿进度条

Question

我正在尝试在 Swift 中创建进度条动画。我设计了一个图案图像来模拟进度，但无法直接将此动画应用于 UIProgressView。相反，我在顶部放置了一个 UIView 来模仿这种行为。

我做了一张对称的图片：绿色背景，深绿色水平线。

据我了解，由于我无法将其附加到 UIProgressBar 上，因此我添加了一个 UIView 来模仿 ProgressBar。

我们的想法是这样的：

这是我当前的设置：

import UIKit

class SideMenuButtons: UIViewController {
    var progressOverlayView: UIView!
    @IBOutlet weak var energyReloadingIndicator: UIProgressView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        setupUI()
    }
    
    private func setupUI() {
        progressOverlayView = UIView()
        if let patternImage = UIImage(named: "striped-pattern-repeated") {
            progressOverlayView.backgroundColor = UIColor(patternImage: patternImage)
        } else {
            progressOverlayView.backgroundColor = .red
        }
        energyReloadingIndicator.addSubview(progressOverlayView)
        updateProgressOverlayViewWidth()
    }
    
    private func updateProgressOverlayViewWidth() {
        let progress = CGFloat(energyReloadingIndicator.progress)
        let maxWidth = energyReloadingIndicator.frame.width
        let overlayWidth = maxWidth * progress
        let overlayHeight = energyReloadingIndicator.frame.height
        progressOverlayView.frame = CGRect(x: 0, y: 0, width: overlayWidth, height: overlayHeight)
    }
}

如何对progressOverlayView中的图案进行动画处理，以达到连续移动的效果？

Answer 1

基本上，我们可以在图像视图中添加gif图像，并实现动画。

1. 喜欢这个答案 要添加的GIF图像

let jeremyGif = UIImage.gifImageWithName("loader")
loaderImageView = UIImageView(image: jeremyGif)
loaderImageView?.contentMode = .left
loaderImageView?.clipsToBounds = true

正如你所说，带一个计时器

2. timerForIncreaseProgress = Timer.scheduledTimer（timeInterval：1，目标：self，选择器：#selector（increaseProgress），userInfo：nil，重复：true）

 @objc func increaseProgress() {
        progress = progress + 0.05
        progressView.progress = progress
        let maxWidth = progressView.frame.width
        let overlayWidth = Float(maxWidth) * progress
        loaderImageView?.frame = CGRect(x: 0, y: 0, width: Double(overlayWidth), height: 13.0)
        print("progressOverlayView.width \(progressOverlayView.frame.width)")
        if progress >= 1 {
            timerForIncreaseProgress?.invalidate()
            timerForIncreaseProgress = nil
        }
    }

希望对你有帮助