애니메이션 CASHapeLayer의 채우기 그리기

저는이 훌륭한 기사 인 http://oleb.net/blog/2010/12/animating-drawing-of-cgpath-with-cashapelayer에 설명 된대로 CAShapeLayer를 사용하여 경로를 그리며 놀았지만 계층 채우기를 애니메이션화하는 방법이 있는지 궁금합니다.애니메이션 CASHapeLayer의 채우기 그리기

예를 들어, 화면에 그려야 할 텍스트가 있지만 텍스트가 아닌 텍스트의 획만 그릴 수 있습니다. 또 다른 예를 들어, 별 모양을 채우고 싶습니다.

CAShapeLayer 또는 다른 개체를 사용하면 가능합니까?

감사합니다.

출처

2011-05-04 Colin Humber

어떤 종류의 애니메이션을 염두에 두시겠습니까? 움직이는 스트로크? 아래에서 위로 또는 왼쪽에서 오른쪽으로 채우시겠습니까? 색이 바래 야? –

-1

예, 가능합니다.

CAShapeLayers에는 애니메이션 가능한 fillColor 속성이 있습니다.

애니메이션으로 이미 완료 한 것처럼 strokeEnd/strokeStart를 변경하는 것과 같은 방식으로 작동합니다.

출처

2012-03-08 00:20:58

대부분의 경우 동일한 코드 일 때 및 toValue에 대해 CABasicAnimation의 값을 다르게 설정하면됩니다.

+ (CABasicAnimation *)animFillColorWithDur:(CGFloat)dur 
            startCol:(UIColor *)start 
            endColor:(UIColor *)end 
            delegate:(id)target{ 

    CABasicAnimation *animFill = 
    [CABasicAnimation animationWithKeyPath:@"fillColor"]; 
    [animFill setDuration:dur]; 
    [animFill setFromValue:(id)start.CGColor]; 
    [animFill setToValue:(id)end.CGColor]; 
    [animFill setRemovedOnCompletion:NO]; 
    [animFill setDelegate:target]; 
    [animFill setFillMode:kCAFillModeBoth]; 

    return animFill; 
}

(가) 단지 CAShapeLayer에 추가 할 수있다 CABasicAnimation을 반환하고 fillColor에 대한

StrokeEnd에 대한 애니메이션

+ (CABasicAnimation *)animStrokeEndWithDuration:(CGFloat)dur 
             delegate:(id)target{ 
    CABasicAnimation *animLine = 
    [CABasicAnimation animationWithKeyPath:@"strokeEnd"]; 
    [animLine setDuration:dur]; 
    [animLine setFromValue:[NSNumber numberWithFloat:0.0f]]; 
    [animLine setToValue:[NSNumber numberWithFloat:1.0f]]; 
    [animLine setRemovedOnCompletion:NO]; 
    [animLine setFillMode:kCAFillModeBoth]; 
    [animLine setDelegate:target]; 
    [animLine setTimingFunction: 
    [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]]; 

    return animLine; 
}

애니메이션 : 나는 나에게 CABasicAnimation을 반환하는 카테고리를 만들었습니다 :

[_myShapeLayer addAnimation:returnedAnimation forKey:@"animKey"]

출처

2014-09-03 14:57:27

애니메이션 CASHapeLayer의 채우기 그리기

답변

관련 문제