Fading out an UIButton when touched

Question

Hi guys,

I've got a Selected-state and a Normal-state for an UIButton that both are UIImages. When a button is touched, I'd like it to hit the selected-state and then animate back to the normal-state over the period of one second. I've set the following animation when the UIButton* btn is pressed, but it just switches right back to deselected state again. How should I go about achieving this?

[btn setSelected:YES];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1.0f];
[btn setSelected:NO];
[UIView commitAnimations];

Cheers

Nik

Answer 1

Since selected is not an animatable property, that won't work (as you've found out). My solution would be to have the selected state of the btn be in a separate UIImageView directly below the button in the exact same location. Then in the action for tapping the button:

- (void) tapButton:(UIButton *)btn {
    btn.alpha = 0;
    [[UIApplication sharedApplication] beginIgnoringInteractionEvents];
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:1];
    [UIView setAnimationDelegate:[UIApplication sharedApplication]];
    [UIView setAnimationDidStopSelector:@selector(endIgnoringInteractionEvents)];
    btn.alpha = 1;
    [UIView commitAnimations];
}

Note I also added the begin/endIgnoringInteractionEvents calls so the user can't tap on the button while it's fading back to its normal state. If you want to allow that, replace the begin/end calls with [UIView setAnimationBeginsFromCurrentState];