UIView.animate和完成问题

Question

I have trouble with UIView.animate.

The functionality I want is (seemingly) simple: There is one button, when you keep it pressed, the whole screen is slowly filled by a different color from the bottom (achieved by a UIView called bar that moves upwards to the top, eventually filling the whole screen). When the bar reaches the top, the background changes its color to the color of the bar and the bar moves back to its original state, hidden from view, and changes its color. When the person releases the button before the bar reaches the top, the bar moves down again very quickly.

Right now I have solved it as follows:

  @IBAction func buttonPressed(_ sender: Any) {        
    UIView.animate(withDuration: 3, animations: {
        self.bar.frame.origin.y = 0
    }, completion: {(finished: Bool) in
        if self.bar.frame.origin.y == 0 {

            self.backColor = self.barColor
            self.view.backgroundColor = UIColor(rgb: self.colors[self.backColor])

            self.changeBarColor()
            self.bar.backgroundColor = UIColor(rgb: self.colors[self.barColor])

            self.bar.frame.origin.y = self.view.frame.size.height

        }
    })

}


@IBAction func buttonReleased(_ sender: Any) {

    UIView.animate(withDuration: 0.5, animations: {
            self.bar.frame.origin.y = self.view.frame.size.height
    })
}

The trouble appears when the user releases the button and presses it again before the 3 seconds of the original animation is over. Suddenly everything inside the completion block is executed. I tried mitigating the problem with the if statement, but this does not seem to work.

What I believe needs to happen is that when the user releases the button before the first animation is finished, the animation needs to be cancelled. Could someone point me in the right direction?

I have attached a video to illustrate the problem:

Video of Problem

Answer 1

The issue you are facing is because the previous animation is still executing. The key is to remove the previous animation.

@IBAction func buttonPressed(_ sender: Any) {     

if self.bar.frame.origin.y != self.view.frame.size.height
{
    view.layer.removeAllAnimations()
    UIView.animate(withDuration: 3, animations: {
        self.bar.frame.origin.y = 0
    }, completion: {(finished: Bool) in
         self.backColor = self.barColor
         self.view.backgroundColor = UIColor(rgb: self.colors[self.backColor])
         self.changeBarColor()
         self.bar.backgroundColor = UIColor(rgb: self.colors[self.barColor])
         self.bar.frame.origin.y = self.view.frame.size.height
    })
}
else
{   
    UIView.animate(withDuration: 3, animations: {
        self.bar.frame.origin.y = 0
    }, completion: {(finished: Bool) in
        if self.bar.frame.origin.y == 0 {

            self.backColor = self.barColor
            self.view.backgroundColor = UIColor(rgb: self.colors[self.backColor])

            self.changeBarColor()
            self.bar.backgroundColor = UIColor(rgb: self.colors[self.barColor])

            self.bar.frame.origin.y = self.view.frame.size.height

        }
    })
}
}

@IBAction func buttonReleased(_ sender: Any) {
    view.layer.removeAllAnimations()
    UIView.animate(withDuration: 0.5, animations: {                
            self.bar.frame.origin.y = self.view.frame.size.height
    })
}