user2640633
user2640633

Reputation:

On button tap change same button image to another image, then fade back to original image

I have a simple question. I want to tap a button and once tapped have that button quickly fade to a black & white version of the same image then dissolve back to the original color image over 5 seconds. While this is happening i want the button to be disabled to prevent over tapping. I know how to disable the button. I just don't know how to do the rest.

I don't know where to start to begin offering my code.

Upvotes: 0

Views: 107

Answers (2)

KlimczakM
KlimczakM

Reputation: 12934

To animate from one image to another you can use this:

let animationDuration = 5.0
button.imageView?.animationImages = [UIImage(named: "image1.png")!, UIImage(named: "image2.png")!]
button.imageView?.animationDuration = animationDuration
button.isUserInteractionEnabled = false
button.imageView?.startAnimating()

To reenable button after this time you can use this:

DispatchQueue.main.asyncAfter(deadline: .now() + animationDuration) {
    button.isUserInteractionEnabled = true
}

Upvotes: 1

user2640633
user2640633

Reputation:

Might not be the most effective but its what worked for me

@IBOutlet weak var logoIndicator: UIButton!



override func viewDidLoad() {
    super.viewDidLoad()


}



@IBAction func logoEraseAll(sender: AnyObject) {

    onTapped()



}

func onTapped(){

    let afterTapped = UIImage(named: "grey.png") as UIImage!
    self.logoIndicator.setImage(afterTapped, forState: .Normal)
    logoIndicator.enabled = false
    delay(2) {
        self.transitionBack()
    }
}
func delay(delay:Double, closure:()->()) {

    dispatch_after(
        dispatch_time( DISPATCH_TIME_NOW, Int64(delay * Double(NSEC_PER_SEC))), dispatch_get_main_queue(), closure)
}

func transitionBack(){

    UIView.transitionWithView(logoIndicator, duration: 2, options: .TransitionCrossDissolve, animations: {
        self.logoIndicator.setImage(UIImage(named: "color.png"), forState: .Normal)
        }, completion: nil)

    logoIndicator.enabled = true
}




}

Upvotes: 0

Related Questions