如何在两个动画之间设置延迟序列

米克兰

我有一个UIImageView我想旋转180度,占用1秒,然后我想在此位置等待1秒,然后将180度旋转回到原始位置,占用1秒。

我该如何完成?我尝试了100种方法,但它会不断回弹而不是回滚

编辑:我忘了补充,我需要无限期地重复

朱塞佩·萨皮恩扎

您可以在UIView.animate上显示的完成处理程序中执行第二个动画

let duration = self.transitionDuration(using: transitionContext)

let firstAnimDuration = 0.5
UIView.animate(withDuration: firstAnimDuration, animations: {
    /* Do here the first animation */
}) { (completed) in

   let secondAnimDuration = 0.5
   UIView.animate(withDuration: secondAnimDuration, animations: { 
       /* Do here the second animation */
   })
}

现在您可能会遇到另一个问题。

如果使用CGAffineTransform旋转视图,并且为每个动画向该view.transform分配此类型的新对象,则将丢失先前的变换操作

因此,根据这篇文章:如何在Swift中应用多个转换,您需要进行转换操作

带有2个动画块的示例

这是一个旋转180度并在1秒后返回原点的示例:

let view = UIView.init(frame: CGRect.init(origin: self.view.center, size: CGSize.init(width: 100, height: 100)))
view.backgroundColor = UIColor.red
self.view.addSubview(view)

var transform = view.transform
transform = transform.rotated(by: 180)

UIView.animate(withDuration: 2, animations: {
    view.transform = transform
}) { (completed) in

    transform = CGAffineTransform.identity
    UIView.animate(withDuration: 2, delay: 1, options: [], animations: { 
        view.transform = transform
    }, completion: nil)
}

.repeat动画和.autoreverse的示例

.animate方法使您能够设置一些动画选项。特别是,结构UIViewAnimationOptions包含:

  1. .repeat,无限期重复您的动画块
  2. .autoreverse,将您的视图恢复为原始状态

考虑到这一点,您可以执行以下操作:

var transform = view.transform.rotated(by: 180)
UIView.animate(withDuration: 2, delay: 0, options: [.repeat, .autoreverse], animations: {
     self.myView.transform = transform
})

但是您需要在两个动画之间进行延迟,因此您需要执行以下操作:

递归动画示例和延迟1秒

只需在ViewController中创建一个动画视图的方法即可。在最后一个完成处理程序中,只需调用该方法即可创建一个无限循环。

最后,您需要在viewDidAppear上调用方法以启动动画。

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

    self.animation()
}


func animation() {
    var transform = view.transform
    transform = transform.rotated(by: 180)

    UIView.animate(withDuration: 2, delay: 0, options: [], animations: {

        self.myView.transform = transform

    }) { bool in
        transform = CGAffineTransform.identity

        UIView.animate(withDuration: 2, delay: 1, options: [], animations: {

            self.myView.transform = transform

        }, completion: { bool in
            self.animation()
        })
    }
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何在两个值之间随机设置变量?

如何在两个项目中的测试文件夹之间设置Maven依赖关系?

如何在两个flexbox之间设置空间

两个动画之间有1秒的延迟

如何在android中的范围搜索栏中设置两个拇指之间的范围?

如何在两个动画画布元素之间通信?

如何在WPF中的两个动画之间创建时间延迟

使用javascript设置两个动画之间的时间延迟

如何在脚本中使用bool参数在两个动画之间开始过渡?

如何在mocha-chai测试中的describe块的两个it块之间插入时间延迟?

如何在两个引导程序列之间放置图标?

如何在WPF中的两个单独的动画之间临时暂停

如何在两个值之间按整数排序列表?

如何在Altair中用序列之间的间距连接两个条形图?

如何在html / css中为两个div设置动画以进行半圆过渡?

在两个连续通话之间延迟

如何在SceneKit中的两个单独的动画之间平滑过渡?

如何使两个事件之间发生延迟

如何显示两个消息之间有延迟?

如何在两个活动之间像卡片翻转那样翻转动画?

如何在两个不同的 css 动画之间交替

如何在 SQLAlchemy 中设置两个表之间的关系?

如何在不获取它们的情况下设置两个对象之间的关系

如何在两个动画之间延迟

如何在 Bot Framework v4 中的两个步骤之间有延迟?

如何在 JavaScript 中获取时间序列上的两个值之间的差异?

在两个来电之间添加延迟

为两个 SVG 属性设置动画时,Css 动画有奇怪的延迟

如何获取两个特定事件之间的事件序列?