Swift高级分享 - 简单明了的在Swift中添加动画

15 篇文章 0 订阅

向应用添加动画可能是一种很好的方式,可以让用户高兴,并通过动作吸引他们注意某些信息或动作。当部署在正确的位置时,动画可以真正使应用程序看起来更加精致和易于使用。

iOS在创建动画时提供了一套不同的API,每个动画都面向某些用例,每个都提供不同级别的控制和自定义。一个这样的API UIView.animate,它使我们能够通过简单地将它们包装在一个闭包中来自动动画对UI的更改。

对于Swift,有更好的见解,想要更好的探讨,可以进入iOS技术群,一起探讨交流

点击此处进交流群 有技术的来闲聊 没技术的来学习

例如,在这里我们使用该API通过修改其center位置的x组件向右移动100个点,持续时间为0.3秒:

let button = UIButton()

UIView.animate(withDuration: 0.3) {
    button.center.x += 100
}

只要有可能,放在传递闭包中的所有代码都将包含在动画中。这意味着我们可以通过在同一个闭包中分配多个属性来轻松地同时为多个事物制作动画 - 就像这里我们也将按钮的宽度设置为200点的动画:

UIView.animate(withDuration: 0.3) {
    button.center.x += 100
    button.frame.size.width = 200
}

该UIView.animateAPI有许多不同的重载,这为我们提供的选项执行我们的动画时,通过附加参数。例如,通过传递completion闭包,我们能够对动画完成时做出反应。这里我们通过在动画完成后将按钮的背景颜色更改为红色来实现:

UIView.animate(withDuration: 0.3, animations: {
    button.center.x += 100
    button.frame.size.width = 200
}, completion: { _ in
    button.backgroundColor = .red
})

我们可以通过在animate调用中添加更多参数来继续自定义动画。在这里,我们将动画的开始延迟0.5秒,同时还将曲线应用于动画,这将使其轻松进出执行的更改 - 而不是线性执行(这是默认设置):

UIView.animate(withDuration: 0.3,
               delay: 0.5,
               options: .curveEaseInOut,
               animations: {
    button.center.x += 100
    button.frame.size.width = 200
}, completion: { _ in
    button.backgroundColor = .red
})

自iOS 10以来可用的另一个动画API UIViewPropertyAnimator,它提供了与上述UIView.animateAPI 相同的功能,但让我们对制作的动画有了更大程度的控制。

可以通过多种不同方式创建属性动画制作者,其中一种方式与我们之前的动画代码非常相似 - 它接受一个duration动画curve和一个包含生成动画的代码的闭包,如下所示:

let animator = UIViewPropertyAnimator(
    duration: 0.3,
    curve: .easeInOut) {
    button.center.x += 100
    button.frame.size.width = 200
}

属性动画师的一个好处是,在动画开始之前修改动画非常简单。例如,如果我们想要在满足特定条件的情况下将按钮向下移动100点 - 我们可以addAnimations在if声明中调用我们的动画师:

if viewHasAdditionalContent {
    // Animations added this way will be performed alongside
    // the animator's original animations (a delay can optionally
    // be applied as well).
    animator.addAnimations {
        buttonB.center.y += 100
    }
}

使用属性动画制作者之间的关键区别在于UIView.animate,生成的动画不会立即开始。相反,我们控制着何时启动它,我们通过调用startAnimation我们的动画师来实现这一点 - 就像这样:

animator.startAnimation()
我们甚至可以在动画正在进行时暂停动画 - 如果用户决定是否取消动作,或者我们正在构建某种形式的交互动画,这可能非常有用。要做到这一点,我们所要做的就是调用pauseAnimation它以当前状态冻结:

animator.pauseAnimation()
要再次恢复动画,我们只需再拨打一次电话即可startAnimation。

双方UIView.animate并UIViewPropertyAnimator可以以建立各种将在视图上进行动画是伟大的工具。虽然专门的视图 - 例如UITableView和UICollectionView- 提供了他们自己的,更具体的动画API - 虽然像Core Animation这样的框架提供了更多的低级访问,但使用本文中提到的API可能是一个很好的入门方式。

谢谢阅读!?

超越基础

准备好探索在Swift中使用动画的更高级方法了吗?看看这些文章:

小编这里有大量的书籍和面试资料哦(点击下载

原文地址 https://www.swiftbysundell.com/basics/animations

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值