用另一个动画打断 UIView 动画时移除延迟
Remove delay when interrupting UIView animation with another animation
我正在用另一个动画打断飞行中的动画。它工作正常,但在动画更改之前有明显的延迟。
当我在 动画到 5 后单击 重置为 1 时,顶部的正方形继续扩大一秒钟然后缩小。对于底部的正方形,我强制动画以 layer.removeAllAnimations()
停止,它立即缩小......但是,它从完整的 5 倍比例值而不是当前值开始。
这是我的代码:
class ViewController: UIViewController {
let resetButton = UIButton(type: .system)
let finishButton = UIButton(type: .system)
let squareView = UIView(frame: CGRect(x: 100, y: 100, width: 30, height: 30))
let referenceSquareView = UIView(frame: CGRect(x: 100, y: 100, width: 30, height: 30))
let squareView2 = UIView(frame: CGRect(x: 100, y: 300, width: 30, height: 30))
let referenceSquareView2 = UIView(frame: CGRect(x: 100, y: 300, width: 30, height: 30))
override func viewDidLoad() {
super.viewDidLoad()
resetButton.frame = CGRect(x: 200, y: 80, width: 160, height: 20)
finishButton.frame = CGRect(x: 200, y: 140, width: 160, height: 20)
view.addSubview(resetButton)
view.addSubview(finishButton)
view.addSubview(referenceSquareView)
view.addSubview(squareView)
view.addSubview(referenceSquareView2)
view.addSubview(squareView2)
referenceSquareView.transform = CGAffineTransform(scaleX: 5, y: 5)
referenceSquareView2.transform = CGAffineTransform(scaleX: 5, y: 5)
squareView.backgroundColor = UIColor.blue
referenceSquareView.backgroundColor = UIColor.red
squareView2.backgroundColor = UIColor.blue
referenceSquareView2.backgroundColor = UIColor.red
resetButton.setTitle("Reset to 1", for: .normal)
resetButton.setTitleColor(.blue, for: .normal)
resetButton.addTarget(self, action: #selector(resetTo1(_:)), for: .touchUpInside)
finishButton.setTitle("Animate to 5", for: .normal)
finishButton.setTitleColor(.blue, for: .normal)
finishButton.addTarget(self, action: #selector(animateTo5(_:)), for: .touchUpInside)
}
@objc func resetTo1(_ sender: UIButton!) {
UIView.animate(withDuration: 3) {
self.squareView.transform = CGAffineTransform(scaleX: 1, y: 1)
}
self.squareView2.layer.removeAllAnimations() /// removing animations for the bottom square
UIView.animate(withDuration: 3) {
self.squareView2.transform = CGAffineTransform(scaleX: 1, y: 1)
}
}
@objc func animateTo5(_ sender: UIButton!) {
UIView.animate(withDuration: 3) {
self.squareView.transform = CGAffineTransform(scaleX: 5, y: 5)
}
self.squareView2.layer.removeAllAnimations() /// removing animations for the bottom square
UIView.animate(withDuration: 3) {
self.squareView2.transform = CGAffineTransform(scaleX: 5, y: 5)
}
}
}
有什么方法可以立即更改动画?
当您调用 self.squareView2.transform = CGAffineTransform(scaleX: 5, y: 5) 时,squareView2 立即具有变换值 5,无需等待 3 秒(即使您将持续时间更改为 3600 秒)。您在应用程序中看到的矩形大小增加的动画只是一个动画层。因此,如果您调用 removeAllAnimations,它会立即显示变换值为 5 的 squareView2。
要解决此问题,我认为您可以改用计时器。将标志 scale 设置为 1。然后,当您点击“Animate to 5”时,每 0.3 秒将 scale 增加 0.5。所以如果你想停止,只需使计时器无效并安排另一个计时器来减少 scale value
我正在用另一个动画打断飞行中的动画。它工作正常,但在动画更改之前有明显的延迟。
当我在 动画到 5 后单击 重置为 1 时,顶部的正方形继续扩大一秒钟然后缩小。对于底部的正方形,我强制动画以 layer.removeAllAnimations()
停止,它立即缩小......但是,它从完整的 5 倍比例值而不是当前值开始。
这是我的代码:
class ViewController: UIViewController {
let resetButton = UIButton(type: .system)
let finishButton = UIButton(type: .system)
let squareView = UIView(frame: CGRect(x: 100, y: 100, width: 30, height: 30))
let referenceSquareView = UIView(frame: CGRect(x: 100, y: 100, width: 30, height: 30))
let squareView2 = UIView(frame: CGRect(x: 100, y: 300, width: 30, height: 30))
let referenceSquareView2 = UIView(frame: CGRect(x: 100, y: 300, width: 30, height: 30))
override func viewDidLoad() {
super.viewDidLoad()
resetButton.frame = CGRect(x: 200, y: 80, width: 160, height: 20)
finishButton.frame = CGRect(x: 200, y: 140, width: 160, height: 20)
view.addSubview(resetButton)
view.addSubview(finishButton)
view.addSubview(referenceSquareView)
view.addSubview(squareView)
view.addSubview(referenceSquareView2)
view.addSubview(squareView2)
referenceSquareView.transform = CGAffineTransform(scaleX: 5, y: 5)
referenceSquareView2.transform = CGAffineTransform(scaleX: 5, y: 5)
squareView.backgroundColor = UIColor.blue
referenceSquareView.backgroundColor = UIColor.red
squareView2.backgroundColor = UIColor.blue
referenceSquareView2.backgroundColor = UIColor.red
resetButton.setTitle("Reset to 1", for: .normal)
resetButton.setTitleColor(.blue, for: .normal)
resetButton.addTarget(self, action: #selector(resetTo1(_:)), for: .touchUpInside)
finishButton.setTitle("Animate to 5", for: .normal)
finishButton.setTitleColor(.blue, for: .normal)
finishButton.addTarget(self, action: #selector(animateTo5(_:)), for: .touchUpInside)
}
@objc func resetTo1(_ sender: UIButton!) {
UIView.animate(withDuration: 3) {
self.squareView.transform = CGAffineTransform(scaleX: 1, y: 1)
}
self.squareView2.layer.removeAllAnimations() /// removing animations for the bottom square
UIView.animate(withDuration: 3) {
self.squareView2.transform = CGAffineTransform(scaleX: 1, y: 1)
}
}
@objc func animateTo5(_ sender: UIButton!) {
UIView.animate(withDuration: 3) {
self.squareView.transform = CGAffineTransform(scaleX: 5, y: 5)
}
self.squareView2.layer.removeAllAnimations() /// removing animations for the bottom square
UIView.animate(withDuration: 3) {
self.squareView2.transform = CGAffineTransform(scaleX: 5, y: 5)
}
}
}
有什么方法可以立即更改动画?
当您调用 self.squareView2.transform = CGAffineTransform(scaleX: 5, y: 5) 时,squareView2 立即具有变换值 5,无需等待 3 秒(即使您将持续时间更改为 3600 秒)。您在应用程序中看到的矩形大小增加的动画只是一个动画层。因此,如果您调用 removeAllAnimations,它会立即显示变换值为 5 的 squareView2。
要解决此问题,我认为您可以改用计时器。将标志 scale 设置为 1。然后,当您点击“Animate to 5”时,每 0.3 秒将 scale 增加 0.5。所以如果你想停止,只需使计时器无效并安排另一个计时器来减少 scale value