Rotating a UIImageView around the bottom axis - Objective-C/iOS

I have a UIImage view that I want to flip to being flat like a flip clock does. This is the first part to the horizontal plane (where I will change the image or add a new view or something). My problem is getting the view to flip on the bottom axis. it's 100px square. How can I get it to rotate by the bottom axis. I have read many many stack problems and answers, googled it and what ever answers I have don't work. This is the closest I have which seems to flip by moving the view before it does so and I can't get it to flip but stay still.

Looking at the Applying the Animation section of http://www.voyce.com/index.php/2010/04/10/creating-an-ipad-flip-clock-with-core-animation/ it would seem that I have the axis correct, but I clearly don't!

[UIView beginAnimations:nil context:nil];

[UIView setAnimationDelegate:self];
[UIView setAnimationDuration:1];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];

boxView.center = CGPointMake(0.5, 1);

boxViewImage.layer.anchorPoint = CGPointMake(0.5, 1);
boxViewImage.layer.transform = CATransform3DMakeRotation(M_PI_2,-1.0,0,0); 

[UIView commitAnimations];

boxViewImage is a UIImageView

What do I need to add to get it to flip in the right way? Been trying to do this for 2 days now!

EDIT:

I allocated the UIImageView with this:

CGRect frameRect = CGRectMake(0, 0, 100,100);
boxViewImage = [[UIImageView alloc] initWithFrame:frameRect];
boxViewImage.image =  [UIImage imageNamed:@"1.png"];
[self.view addSubview:boxViewImage];

EDIT 2:

I have discovered that if I create my UIImageView when I click (not what I want to do) after the view is loaded, it rotates where I want it too. I think that it might be due to the UINavigationController having 开发者_Go百科a height, as the offset seems to be the same as it's height!

You've got few things wrong in your code.

First I have no idea why do you set boxView.center to (0.5, 1). Second you shouldn't set anchor point inside animation block and third M_PI_2 is just half animation you really want.

Here is the solution. I used UILabel instead of UIImageView.

UILabel *testLabel = [[[UILabel alloc] initWithFrame:CGRectMake(20, 20, 100, 100)] autorelease];
testLabel.backgroundColor = [UIColor blackColor];
testLabel.text = @"Test";
testLabel.textColor = [UIColor whiteColor];
[self.view addSubview:testLabel];
testLabel.layer.anchorPoint = CGPointMake(0.5, 1);    

[UIView animateWithDuration:1.0
                      delay:0.0
                    options:UIViewAnimationOptionCurveEaseInOut | UIViewAnimationOptionAllowUserInteraction
                 animations:^{
                     testLabel.layer.transform = CATransform3DMakeRotation(M_PI, -1, 0, 0);                          
                 }
                 completion:^(BOOL finished) {
                 }];

I actually made a small framework out of the voice tutorial. Perhaps that helps:

https://github.com/jaydee3/JDFlipNumberView

It contains three classes:

• JDFlipNumberView (a single animated digit)
• JDGroupedFlipNumberView (a grouped and chained choosable number of flipviews for higher numbers)
• JDDateCountdownFlipView (a date countdown, just init with a date, set a frame and there you go.)

In any case, you just need to do three steps:

1. Init the class
2. Set an int value (or a date)
3. Start the animation