iPhone UIButton Flip and Expand

Question

I am trying to make a simple button the changes size and expands and then shrinks on subsequent clicks.

It somewhat works, the final button after the flip looks correct - it is circular and a different size. The problem is that during transition, I get this strange non-circular effect. See this link for a visual of this problem --> http://screencast.com/t/rJaSJ0nGq.

How can I make the transition smooth and always look circular? I don't want the rounded rectangle appearance that is present in the screencast.

Here is my button-clicked method:

// Handle when a user presses the button
- (IBAction)bubblePressed:(id)sender {

    // Expand the bubble if it's pressed or de-expand it if
    // already expanded
    if ( buttonResized ) {

        CGRect tempFrame=self.expandMe.frame;
        tempFrame.size.width=100;//change acco. how much you want to expand
        tempFrame.size.height=100;
        [UIView beginAnimations:@"" context:nil];
        [UIView setAnimationDuration:BUTTON_FLIP_TIME];
        self.expandMe.frame=tempFrame;

        // Round the buttons
        self.expandMe.clipsToBounds = YES;
        self.expandMe.layer.cornerRadius = self.expandMe.frame.size.width / 2;//half of the width
        self.expandMe.layer.borderColor=[UIColor clearColor].CGColor;
        self.expandMe.layer.borderWidth=2.0f;

        // Flip the button
        [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.expandMe cache:YES];

        [UIView commitAnimations];

    }
    else {

        CGRect tempFrame=self.expandMe.frame;
        tempFrame.size.width=200;//change acco. how much you want to expand
        tempFrame.size.height=200;
        [UIView beginAnimations:@"" context:nil];
        [UIView setAnimationDuration:BUTTON_FLIP_TIME];
        self.expandMe.frame=tempFrame;

        // Round the buttons
        self.expandMe.clipsToBounds = YES;
        self.expandMe.layer.cornerRadius = self.expandMe.frame.size.width / 2;//half of the width
        self.expandMe.layer.borderColor=[UIColor clearColor].CGColor;
        self.expandMe.layer.borderWidth=2.0f;

        // Flip the button
        [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.expandMe cache:YES];

        [UIView commitAnimations];

    }

    // Flip the variable that tracks flipping
    buttonResized = !buttonResized;

}

Answer 1

In the end I found this --> https://github.com/ole/OBShapedButton. It is a great class and MIT licensed.