在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"; 
}];