ios - 如何在 iOS Swift 中制作加载动画?

标签 ios swift

嗨,我想用 3 UIView 制作动画.主要问题是我无法通过从 layer 中删除动画来停止动画。 .

这是代码:

class HTAnimatedTypingView: UIView {

    @IBOutlet weak var view1: UIView!
    @IBOutlet weak var view2: UIView!
    @IBOutlet weak var view3: UIView!

    func startAnimation(){

        UIView.animate(withDuration: 0.5, delay: 0, options: .repeat, animations: {

        self.view1.frame.origin.y = 0

       }, completion: nil)

        UIView.animate(withDuration: 0.3, delay: 0.5, options: .repeat, animations: {

               self.view2.frame.origin.y = 0

              }, completion: nil)

        UIView.animate(withDuration: 0.2, delay: 1.0, options: .repeat, animations: {

                     self.view3.frame.origin.y = 0

                    }, completion: nil)

    }

    func stopAnimations(){

        self.view1.layer.removeAllAnimations()
        self.view2.layer.removeAllAnimations()
        self.view3.layer.removeAllAnimations()

    }
}

以上代码输出:

enter image description here

预期动画:

enter image description here

如何使其与开始动画和停止动画功能一起使用?提前致谢...

最佳答案

由于您需要在每个动画序列之间添加一些暂停,我个人会使用 关键帧因为它为您提供了一些灵 active :

class AnimationViewController: UIViewController {

    private let stackView: UIStackView = {
        $0.distribution = .fill
        $0.axis = .horizontal
        $0.alignment = .center
        $0.spacing = 10
        return $0
    }(UIStackView())

    private let circleA = UIView()
    private let circleB = UIView()
    private let circleC = UIView()
    private lazy var circles = [circleA, circleB, circleC]

    func animate() {
        let jumpDuration: Double = 0.30
        let delayDuration: Double = 1.25
        let totalDuration: Double = delayDuration + jumpDuration*2

        let jumpRelativeDuration: Double = jumpDuration / totalDuration
        let jumpRelativeTime: Double = delayDuration / totalDuration
        let fallRelativeTime: Double = (delayDuration + jumpDuration) / totalDuration

        for (index, circle) in circles.enumerated() {
            let delay = jumpDuration*2 * TimeInterval(index) / TimeInterval(circles.count)
            UIView.animateKeyframes(withDuration: totalDuration, delay: delay, options: [.repeat], animations: {
                UIView.addKeyframe(withRelativeStartTime: jumpRelativeTime, relativeDuration: jumpRelativeDuration) {
                    circle.frame.origin.y -= 30
                }
                UIView.addKeyframe(withRelativeStartTime: fallRelativeTime, relativeDuration: jumpRelativeDuration) {
                    circle.frame.origin.y += 30
                }
            })
        }
    }

    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white
        view.addSubview(stackView)
        stackView.translatesAutoresizingMaskIntoConstraints = false
        stackView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
        stackView.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true
        circles.forEach {
            $0.layer.cornerRadius = 20/2
            $0.layer.masksToBounds = true
            $0.backgroundColor = .systemBlue
            stackView.addArrangedSubview($0)
            $0.widthAnchor.constraint(equalToConstant: 20).isActive = true
            $0.heightAnchor.constraint(equalTo: $0.widthAnchor).isActive = true
        }
    }

    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        animate()
    }
}

它应该很简单,但是如果您有任何问题,请随时告诉我!

结果如下所示:

enter image description here

关于ios - 如何在 iOS Swift 中制作加载动画?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62208949/

相关文章:

ios - 在NSMutableArray中快速找到子字符串

ios - UIView 子类的大小取决于设备

ios - 无法打开谷歌地图

swift - 在 Swift 中从 WKWebview 获取 HTML

ios - 即使导入了 UIKit,也使用未声明的类型 'UITableViewSection'

iOS13系统UITabBar

ios - 在 Mac OS 或 IOS 上使用 Swift 连接到 RabbitMQ 服务器?

ios - 在使用 Objective - C 制作的 App 中使用 Swift 代码

ios - 将通知负载发送到 UIViewController

swift - 在 UITableView 重新加载时从 SDWebImage 设置图像