绕底轴旋转 UIImageView - Objective-C/iOS

Question

我有一个 UIImage 视图，我想像翻转时钟一样翻转为平面。这是水平面的第一部分（我将在其中更改图像或添加新视图或其他内容）。我的问题是让视图在底部轴上翻转。它是 100px 的正方形。我怎样才能让它按底部轴旋转。我读过很多堆栈问题和答案，用谷歌搜索，但我的答案都不起作用。这是我最接近的，它似乎通过在视图翻转之前移动视图来翻转，但我无法让它翻转但保持静止。

查看 http://www.voyce.com/index.php/2010/04/10/creating-an-ipad-flip-clock-with-core-animation/ 它将似乎我的轴是正确的，但我显然不正确！

[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 是一个 UIImageView

我需要添加什么才能让它以正确的方式翻转？已经尝试这样做了 2 天了！

编辑：

我用这个分配了 UIImageView：

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

编辑2：

我发现，如果我在加载视图后单击（不是我想要做的）时创建 UIImageView，它也会旋转到我想要的位置。我认为这可能是由于 UINavigationController 有一个高度，因为偏移量似乎与它的高度相同！

Answer 1

你的代码中有一些错误。

首先我不知道为什么将 boxView.center 设置为 (0.5, 1)。其次，您不应该在动画块内设置锚点，第三个 M_PI_2 只是您真正想要的一半动画。

这是解决方案。我使用 UILabel 而不是 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) {
                 }];

Answer 2

我实际上根据语音教程制作了一个小框架。也许这有帮助：

https://github.com/jaydee3/JDFlipNumberView

它包含三个类：

• JDFlipNumberView（单个动画数字）
• JDGroupedFlipNumberView（分组和链接的可选择数量的翻转视图，以获得更大的数字）
• JDDateCountdownFlipView（日期倒计时，只需用日期初始化，设置框架即可。）

无论如何，您只需要执行三个步骤：

1. 初始化课程
2. 设置一个 int 值（或日期）
3. 开始动画