2015-10-15 92 views
1

我有一個CAShapeLayer,我在那裏爲一個圓圈設置了動畫。動畫首先順時針「取消」圓形,然後順時針重繪圓形。排序的「旋轉圈」。放置它的另一種方法:移動路徑筆劃結束點以開始,然後將起始點移動到結尾。排隊CAAnimations時出現毛刺

動畫本身的作品,但它不時產生小故障。當它被認爲是「未提取的」時,它會在整個圓圈內看到一個短暫的瞥見。

爲什麼會發生這種情況,您如何解決?

感謝,

// Shape creation 
layer.path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, self.width - 2 * OUTER_BORDER_WIDTH, self.width - 2* OUTER_BORDER_WIDTH)].CGPath; 

// Animation queuing 
-(void) applyNextAnimation 
{ 

    CABasicAnimation* animation; 

    if (self.animatingOpening) 
    { 
     animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"]; 
     animation.fromValue = [NSNumber numberWithFloat:0.0f]; 
     animation.toValue = [NSNumber numberWithFloat:1.0f]; 
     self.animatingOpening = NO; 
    } 
    else 
    { 
    animation = [CABasicAnimation animationWithKeyPath:@"strokeStart"]; 
     animation.fromValue = [NSNumber numberWithFloat:0.0f]; 
     animation.toValue = [NSNumber numberWithFloat:1.0f]; 
     self.animatingOpening = YES; 
    } 

    animation.duration = 1.0f; 
    animation.autoreverses = NO; 
    animation.delegate = self; 
    animation.removedOnCompletion = YES; 
    [self.outerCircleLayer addAnimation:animation forKey:@"stroke"]; 
} 

// Animation stop callback 
-(void) animationDidStop:(CAAnimation *)anim finished:(BOOL)flag 
{ 
    if (self.isAnimating) 
    { 
     [self applyNextAnimation]; 
    } 
} 

回答

1

它閃爍監守你沒有設置層上的相應屬性。所以當動畫完成時,該圖層的模型仍處於預動畫狀態,這就是您在這兩個動畫之間瞬間看到的內容。

這將讓你實現你想要的...

if (self.animatingOpening) 
{ 

    self.outerCircleLayer.strokeStart = 0.0; 

    animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"]; 
    animation.fromValue = [NSNumber numberWithFloat:0.0f]; 
    animation.toValue = [NSNumber numberWithFloat:1.0f]; 
    self.animatingOpening = NO; 
} 
else 
{ 
    self.outerCircleLayer.strokeStart = 1.0; 

    animation = [CABasicAnimation animationWithKeyPath:@"strokeStart"]; 
    animation.fromValue = [NSNumber numberWithFloat:0.0f]; 
    animation.toValue = [NSNumber numberWithFloat:1.0f]; 
    self.animatingOpening = YES; 
} 

animation.duration = 1.0f; 
animation.autoreverses = NO; 

,幾乎工作,但你從將未拉伸狀態轉變爲啓動動畫繪製狀態,你會發現一個更微妙的毛刺。圓的起點在開始時有一個小的逆向動畫。這是一個通過將strokeStart從1.0設置爲0.0而觸發的隱式動畫:您需要擺脫這種動畫,以便所有動畫效果都在您的控制之下。你可以通過CATransaction按鈕disableActions設置爲YES來實現這一目標最簡單的:

[CATransaction setDisableActions:YES]; 

(添加它略高於if (self.animatingOpening)

+0

好極了!我添加了'[CATransaction setDisableActions:NO];'在if-else語句的末尾保留了一個動畫,這裏沒有顯示。 (另一層) –

+1

很高興它是有用的。我看到你正在處理一些涉及高頻傳感器數據存儲的有趣問題,所以我在其他問題中增加了一些想法。 – foundry