2012-05-25 36 views
0

我正在嘗試做一個帶有反彈效果的簡單水平翻轉動畫。CATransform3DMakeRotation動畫槽零(從-45到+45角度)?

[UIView animateWithDuration:0.4 delay:0 options:UIViewAnimationCurveEaseIn animations:^{ 
    front.layer.transform=CATransform3DMakeRotation(DEGREES_TO_RADIANS(90), -1.0,0.0,0.0); // flip halfway 
} 
completion:^(BOOL finished) { // swap view 
    front.alpha=0; 
    back.alpha=1; 
    [UIView animateWithDuration:0.5 animations:^{ // flip remaining + bounce 
     back.layer.transform = CATransform3DMakeRotation(DEGREES_TO_RADIANS(45), 1.0,0.0,0.0); // final + 45 
    } 
    completion:^(BOOL finished) { 
     [UIView animateWithDuration:0.25 animations:^{ 
      back.layer.transform = CATransform3DMakeRotation(DEGREES_TO_RADIANS(-22.5), 1.0,0.0,0.0); // bounce back 
     } 
     completion:^(BOOL finished) { 
      [UIView animateWithDuration:0.125 animations:^{ 
       back.layer.transform = CATransform3DMakeRotation(0, 1.0,0.0,0.0); // final 
      }]; 
     }]; 
    }]; 
}]; 

除了'反彈'以外,它的效果很好。 -22.5旋轉轉變爲0並​​且返回到22.5,而不是繼續到-22.5。

我已經嘗試過各種值,並且還包括一箇中間嵌套塊,在消極之前將反彈轉換爲「0」。沒有幫助。旋轉總是動畫爲正面而不是負面角度。

就像測試一樣,將'final + 45'改變爲負角度並不會停止所需角度的動畫。所以角度本身就沒問題。

問題似乎是從零開始或向低谷零做'逆時針'旋轉。小於零的值總是轉換爲正角。

如果上述方法是實現反射效果的正確技術,那麼將如何構建通過CATransform3DMakeRotation從正(45)旋轉到負角(-45)的(嵌套)層動畫?

回答

2

您正在圍繞x軸旋轉。沒有透視對你的變換,你會如何看到正面和負面角度之間的區別?沒有視角,正面和負面的旋轉看起來是一樣的(降低高度)。您可以通過設置.m34來更改變換矩陣的第三行和第四列中的值,以便apply perspective to your transform。搜索「Core Animation透視圖」,你會發現一個很好的解釋。

我在上面運行你的代碼(在一個簡單的視圖中,用橙色填充)。 爲了更容易地看到旋轉以及正角度和負角度之間的差異,我對其進行了更改,使其圍繞z軸旋轉。

這些是我在動畫中拍攝的四張截圖。正如你所看到的,消極的角度是有效的,除非我誤解了你想要做的事情。

0 degrees 45 degrees -25 degrees 0 degrees

+0

謝謝!當用z訪問測試時,我可以看到旋轉確實工作正常。當您在x軸上「反彈」視圖時,我會加入視角,看看我是否被視錯覺所矇蔽。然而,看起來這樣... – Frans

+0

工作。彈跳效果現在很好用! – Frans