Implement animation in UIButton

Question

I'm new to cocoa and iphone programming and I want to implement an animation in UIButton. For example, I create a custom UIButton with a square image. Then when I press that UIButton, the square image will flip. Note that the square image is the image of the UIButton.

[UIButton setImage:[UIImage imageNamed:@"square.png"]];

Answer 1

I had the same problem and I solved it in a very similar way. I just subclassed the UIButton and implemented a method like that:

- (void) flipBackgroundImage:(UIImage*) image
{
    [UIView beginAnimations:@"flipbutton" context:NULL];
    [UIView setAnimationDuration:0.4];
    [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self cache:YES];

    [self setBackgroundImage:image forState:UIControlStateNormal];

    [UIView commitAnimations];
}

Works like a charm.

Cheers, anka

Answer 2

Below is the complete code for flipping a button (with background image) when it will pressed. Basically you need two button and a container view.

///// .H file code....


    //Container views used for flipping the bars to show whose turn it is

    UIButton* btn1;
    UIButton* btn2;
UIView *BarContainerView;

///// .M file code....

- (void)viewWillAppear:(BOOL)animated
{

    BarContainerView = [[UIView alloc] initWithFrame:CGRectMake(20, 30, 103, 150)];

btn1 = [[UIButton buttonWithType:UIButtonTypeRoundedRect]retain];
[btn1 addTarget:self action:@selector(btn1_click) forControlEvents:UIControlEventTouchUpInside];
[btn1 setBackgroundImage:[UIImage imageNamed:@"image1.png"] forState:UIControlStateNormal];
btn1.frame = CGRectMake(0, 0, 103, 150);

btn2 = [[UIButton buttonWithType:UIButtonTypeRoundedRect]retain];
[btn2 addTarget:self action:@selector(btn2_click) forControlEvents:UIControlEventTouchUpInside];
[btn2 setBackgroundImage:[UIImage imageNamed:@"image2.png"] forState:UIControlStateNormal];
btn2.frame = CGRectMake(0, 0, 103, 150);

[BarContainerView addSubview:btn1];
[self.view addSubview:BarContainerView];
[self.view bringSubviewToFront:BarContainerView];

}

- (void) btn1_click
{

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.75];
[UIView setAnimationDelegate:self];

[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:BarContainerView cache:YES];

[btn1 removeFromSuperview];
[BarContainerView addSubview:btn2];
[UIView commitAnimations];

}

- (void) btn2_click
{

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.75];
[UIView setAnimationDelegate:self];

[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:BarContainerView cache:YES];

[btn2 removeFromSuperview];
[BarContainerView addSubview:btn1];
[UIView commitAnimations];

}