问题 如何重复动画(使用UIViewPropertyAnimator)一定次数?
我想为按钮实现脉动效果,因此需要多次重复弹簧效果,问题是我找不到任何关于提供什么参数的信息以及如何做到这一点
let btnView = sayWordBtn.viewWithTag(0)
btnView.transform = CGAffineTransform(scaleX: 0.7, y: 0.7)
let mass: CGFloat = 2.0 // weight of the object
let stiffness: CGFloat = 25.0 //elasticity
let damping: CGFloat = 2*sqrt(mass*stiffness) // point where the system comes to rest in the shortest period of time
let underDamping: CGFloat = damping * 0.5
let initialVelocity: CGVector = CGVector.zero
let springParameters: UISpringTimingParameters = UISpringTimingParameters(mass: mass, stiffness: stiffness, damping: underDamping, initialVelocity: initialVelocity)
let animationDelay = 3
let pulseEffect = UIViewPropertyAnimator(duration: 5, timingParameters: springParameters)
pulseEffect.addAnimations( {[weak self] in
btnView!.transform = CGAffineTransform(scaleX: 1.0, y: 1.0)
})
pulseEffect.isReversed = true
pulseEffect.startAnimation(afterDelay: TimeInterval(animationDelay))
954
2017-09-11 16:01
起源
答案:
iOS 10 介绍一个名为的新对象 UIViewPropertyAnimator
。
你可以做同样的事情 UIView.animation
但是为了实现更复杂的动画,苹果为我们提供了帮助 CoreAnimation
框架。
我们为什么要使用它?
因为 UIViewPropertyAnimator
是一个编写良好且高度可扩展的API。它涵盖了许多与'旧式'相同的功能 UIView
动画,但为您提供对动画的细粒度编程控制。这意味着您可以暂停正在进行的动画,如果您愿意,可以在以后重新启动动画,甚至动态修改动画属性(例如将动画的终点更改为屏幕的右上角,如果之前是底部的话 - 剩下)。
我们创建它的一个实例并创建一个动画,如下所示:
let view = UIView(frame: CGRect(x: 0, y: 0, width: 100, height: 100))
view.alpha = 0.35
view.backgroundColor = .red
self.view.addSubview(view)
let newFrame = CGRect(x: 0, y: 0, width: 50, height: 50)
let viewFrameAnimator = UIViewPropertyAnimator(duration: 1.0,
curve: .linear,
animations: { view.frame = newFrame })
现在我们可以使用以下内容与动画进行交互:
viewFrameAnimator.startAnimation..
viewFrameAnimator.stopAnimation..
viewFrameAnimator.finishAnimation(at:..
继续上面的例子:
viewFrameAnimator.startAnimation()
然后,回到 alpha
等于 1,如果我们需要更多动画选项,我们也可以发布 这个 UIViewPropertyAnimator
公开课:
let viewAlphaAnimator = UIViewPropertyAnimator.runningPropertyAnimator(withDuration: 1.0,
delay: 0.0,
options: [.curveLinear],
animations: { view.alpha = 1.0 })
让我们添加更多动画选项。现在你知道的不仅仅是这个新对象。
怎么重复一遍?
所以让我们开始解释如何重复动画,例如,如果我们想要重复动画 view.alpha = 1.0
对于 3 时间(你可以看到每次重复输出的小闪光灯..)你应该遵循:
let viewAlphaAnimator = UIViewPropertyAnimator.runningPropertyAnimator(withDuration: 1.0,
delay: 0.0,
options: [.curveLinear,.repeat],
animations: { UIView.setAnimationRepeatCount(3);view.alpha = 1.0 })
我希望这可以帮到你。
9
2018-01-20 14:36
答案:
iOS 10 介绍一个名为的新对象 UIViewPropertyAnimator
。
你可以做同样的事情 UIView.animation
但是为了实现更复杂的动画,苹果为我们提供了帮助 CoreAnimation
框架。
我们为什么要使用它?
因为 UIViewPropertyAnimator
是一个编写良好且高度可扩展的API。它涵盖了许多与'旧式'相同的功能 UIView
动画,但为您提供对动画的细粒度编程控制。这意味着您可以暂停正在进行的动画,如果您愿意,可以在以后重新启动动画,甚至动态修改动画属性(例如将动画的终点更改为屏幕的右上角,如果之前是底部的话 - 剩下)。
我们创建它的一个实例并创建一个动画,如下所示:
let view = UIView(frame: CGRect(x: 0, y: 0, width: 100, height: 100))
view.alpha = 0.35
view.backgroundColor = .red
self.view.addSubview(view)
let newFrame = CGRect(x: 0, y: 0, width: 50, height: 50)
let viewFrameAnimator = UIViewPropertyAnimator(duration: 1.0,
curve: .linear,
animations: { view.frame = newFrame })
现在我们可以使用以下内容与动画进行交互:
viewFrameAnimator.startAnimation..
viewFrameAnimator.stopAnimation..
viewFrameAnimator.finishAnimation(at:..
继续上面的例子:
viewFrameAnimator.startAnimation()
然后,回到 alpha
等于 1,如果我们需要更多动画选项,我们也可以发布 这个 UIViewPropertyAnimator
公开课:
let viewAlphaAnimator = UIViewPropertyAnimator.runningPropertyAnimator(withDuration: 1.0,
delay: 0.0,
options: [.curveLinear],
animations: { view.alpha = 1.0 })
让我们添加更多动画选项。现在你知道的不仅仅是这个新对象。
怎么重复一遍?
所以让我们开始解释如何重复动画,例如,如果我们想要重复动画 view.alpha = 1.0
对于 3 时间(你可以看到每次重复输出的小闪光灯..)你应该遵循:
let viewAlphaAnimator = UIViewPropertyAnimator.runningPropertyAnimator(withDuration: 1.0,
delay: 0.0,
options: [.curveLinear,.repeat],
animations: { UIView.setAnimationRepeatCount(3);view.alpha = 1.0 })
我希望这可以帮到你。
9
2018-01-20 14:36
请用
pulseEffect.addCompletion({_ in
// Repeat the logic here
})
您可以在addCompletion块中重复动画逻辑
func animateView() {
btnView.transform = CGAffineTransform(scaleX: 0.7, y: 0.7)
let mass: CGFloat = 2.0 // weight of the object
let stiffness: CGFloat = 25.0 //elasticity
let damping: CGFloat = 2*sqrt(mass*stiffness) // point where the system comes to rest in the shortest period of time
let underDamping: CGFloat = damping * 0.5
let initialVelocity: CGVector = CGVector.zero
let springParameters: UISpringTimingParameters = UISpringTimingParameters(mass: mass, stiffness: stiffness, damping: underDamping, initialVelocity: initialVelocity)
let animationDelay = 3
let pulseEffect = UIViewPropertyAnimator(duration: 5, timingParameters: springParameters)
pulseEffect.addAnimations( {[weak self] in
self?.btnView!.transform = CGAffineTransform(scaleX: 1.0, y: 1.0)
})
pulseEffect.addCompletion({_ in
self.animateView()
})
pulseEffect.isReversed = true
pulseEffect.startAnimation(afterDelay: TimeInterval(animationDelay))
}
您还可以添加逻辑以将动画限制为addCompletion块中的特定数字
2
2018-01-17 05:54
无论出于何种原因,他们都无法使用UIPropertyAnimator指定重复计数。你留下了以下选项:
- 保留一个计数器并在完成处理程序中重复动画
并递减计数器直到计数器达到0
- 动画无限重复,但安排一个计时器,并停止
动画(可选择添加动画以移动到最终
位置)
- 调整弹簧参数,以减少阻尼和
更具弹性,你会得到更多的振荡。
- 使用旧的UIView.animate方法和旧方法
UIView.setAnimationRepeatCount
- 使用CASpringAnimation,因为这是属性动画师正在包装的东西,它确实有重复计数。
1
2018-01-19 06:01
请使用此修改后的代码
let btnView = sayWordBtn.viewWithTag(0)
btnView.transform = CGAffineTransform(scaleX: 0.7, y: 0.7)
let mass: CGFloat = 2.0 // weight of the object
let stiffness: CGFloat = 25.0 //elasticity
let damping: CGFloat = 2*sqrt(mass*stiffness) // point where the system comes to rest in the shortest period of time
let underDamping: CGFloat = damping * 0.5
let initialVelocity: CGVector = CGVector.zero
let springParameters: UISpringTimingParameters = UISpringTimingParameters(mass: mass, stiffness: stiffness, damping: underDamping, initialVelocity: initialVelocity)
let animationDelay = 3
let pulseEffect = UIViewPropertyAnimator(duration: 5, timingParameters: springParameters)
pulseEffect.addAnimations( {[weak self] in
UIView.setAnimationRepeatCount(3)
UIView.setAnimationRepeatAutoreverses(true)
btnView!.transform = CGAffineTransform(scaleX: 1.0, y: 1.0)
})
pulseEffect.isReversed = true
pulseEffect.startAnimation(afterDelay: TimeInterval(animationDelay))
0
2018-01-23 07:31
此代码有效:
func usePropertyAnimator(_ reversed: Bool = false) {
let circleAnimator = UIViewPropertyAnimator(
duration: 2, timingParameters: UICubicTimingParameters())
circleAnimator.addAnimations {
circle.center.y += (reversed ? -1 : 1) * 330
}
circleAnimator.addCompletion { _ in
usePropertyAnimator(!reversed)
}
circleAnimator.startAnimation()
}
usePropertyAnimator()
0
2018-02-23 09:53