在X方向旋转两个UIImageView

Question

我想旋转两个图像，我把一个图像放在另一个后面，但是当我用下面的代码旋转它们时，后面的图像会在前面图像上方 ，我指定它们的ZPOstion，但它们没有改变

这个链接，我的观点之前，旋转http://i39.tinypic.com/ivv2ah.png

后旋转http://i43.tinypic.com/ic05xj.png

这是如何发生的

[UIView animateWithDuration:0.2 animations: 
    ^{ 
     CALayer *myLayer=self.image2.layer; 
     CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.x"]; 
     animation.fromValue = [NSNumber numberWithFloat:(1 * M_PI/Down)]; 
     animation.toValue = [NSNumber numberWithFloat:(1 * M_PI/UP)]; 
     animation.repeatCount =0; 
     animation.duration=0.2; 
     [animation setRemovedOnCompletion:NO]; 
     animation.timingFunction = [CAMediaTimingFunction 
            functionWithName:kCAMediaTimingFunctionLinear]; 
     [self.image2.layer addAnimation:animation forKey:@"transform.rotation.x"]; 
     CATransform3D transform = CATransform3DIdentity; 
     transform.m34 = (1/500.0f); 
     transform = CATransform3DRotate(transform, (1 * M_PI/UP), 1, 0,0); 
     myLayer.transform=transform; 
    } 
    completion:^(BOOL finished) 
    { 
     self.image2.postion=@"UP"; 
    }]; 


    [UIView animateWithDuration:0.2 animations: 
    ^{ 
     CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.x"]; 
     animation.fromValue = [NSNumber numberWithFloat:(1 * M_PI/Down)]; 
     animation.toValue = [NSNumber numberWithFloat:(1 * M_PI/UP)]; 
     animation.repeatCount =0; 
     animation.duration=0.2; 
     [animation setRemovedOnCompletion:NO]; 
     animation.timingFunction = [CAMediaTimingFunction 
            functionWithName:kCAMediaTimingFunctionLinear]; 
     [card.layer addAnimation:animation forKey:@"transform.rotation.x"]; 
     CATransform3D transform = CATransform3DIdentity; 
     transform.m34 = (1/500.0f); 
     transform = CATransform3DRotate(transform, (1 * M_PI/UP), 1, 0,0); 
     card.layer.transform=transform; 
    } 
    completion:^(BOOL finished) 
    { 
     card.postion=@"UP"; 
    }]; 

CArdImage是自定义的UIImageView，这就是我改变

- (id)initWithFrame:(CGRect)frame 
{ 
self = [super initWithFrame:frame]; 
if (self) 
{ 
    self.layer.anchorPoint=CGPointMake(0.5, 1.0); 
    CATransform3D transform = CATransform3DIdentity; 
    transform.m34 = (1/500.0f); 
    transform = CATransform3DRotate(transform, (1 * M_PI/2.5), 0.5, 0,0); 
    self.layer.transform=transform; 
    self.postion=@"UP"; 
    } 
    return self; 
} 

Answer 1

一个可能的原因是，动画不相互同步。尝试将两个动画块放在一起：

[UIView animateWithDuration:0.2 animations: 
^{ 
    CALayer *myLayer=self.image2.layer; 
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.x"]; 
    animation.fromValue = [NSNumber numberWithFloat:(1 * M_PI/Down)]; 
    animation.toValue = [NSNumber numberWithFloat:(1 * M_PI/UP)]; 
    animation.repeatCount =0; 
    animation.duration=0.2; 
    [animation setRemovedOnCompletion:NO]; 
    animation.timingFunction = [CAMediaTimingFunction 
           functionWithName:kCAMediaTimingFunctionLinear]; 
    [self.image2.layer addAnimation:animation forKey:@"transform.rotation.x"]; 
    CATransform3D transform = CATransform3DIdentity; 
    transform.m34 = (1/500.0f); 
    transform = CATransform3DRotate(transform, (1 * M_PI/UP), 1, 0,0); 
    myLayer.transform=transform; 

    // second animation code 
    CABasicAnimation *animation2 = [CABasicAnimation animationWithKeyPath:@"transform.rotation.x"]; 
    animation2.fromValue = [NSNumber numberWithFloat:(1 * M_PI/Down)]; 
    animation2.toValue = [NSNumber numberWithFloat:(1 * M_PI/UP)]; 
    animation2.repeatCount =0; 
    animation2.duration=0.2; 
    [animation2 setRemovedOnCompletion:NO]; 
    animation2.timingFunction = [CAMediaTimingFunction 
           functionWithName:kCAMediaTimingFunctionLinear]; 
    [card.layer addAnimation:animation2 forKey:@"transform.rotation.x"]; 
    CATransform3D transform = CATransform3DIdentity; 
    transform.m34 = (1/500.0f); 
    transform = CATransform3DRotate(transform, (1 * M_PI/UP), 1, 0,0); 
    card.layer.transform=transform; 
} 
completion:^(BOOL finished) 
{ 
    self.image2.postion=@"UP"; 
    card.postion=@"UP"; 
}];