17

일반 모서리에서 둥근 모서리로 CALayer를 전환하는 애니메이션을 만들려고합니다. UIBezierPath를 사용하기 때문에 위쪽 모서리 만 둥글게하고 싶습니다.CALayer 경로가있는 CABasicAnimation이 애니메이션을 적용하지 않습니다.

UIRectCorner corners = UIRectCornerTopLeft | UIRectCornerTopRight; 

UIBezierPath* newPath = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:corners cornerRadii:CGSizeMake(8.0f, 8.0f)]; 
UIBezierPath* oldPath = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:corners cornerRadii:CGSizeMake(0.0f, 0.0f)]; 

CAShapeLayer* layer = [CAShapeLayer layer]; 
layer.frame = self.bounds; 
layer.path = oldPath.CGPath; 

self.layer.mask = layer; 

CABasicAnimation* a = [CABasicAnimation animationWithKeyPath:@"path"]; 
[a setDuration:0.4f]; 
[a setFromValue:(id)layer.path]; 
[a setToValue:(id)newPath.CGPath]; 

layer.path = newPath.CGPath; 
[layer addAnimation:a forKey:@"path"]; 

을하지만이 프로그램을 실행할 때, 모서리는 둥글게된다, 그러나 즉시 일에는 animation-가 없다 : 여기에 코드입니다. 그래서 비슷한 질문을 보았습니다. 그러나 그들은 내 문제를 해결하지 못했습니다.

Animating CALayer's shadowPath property

iPhone CALayer animation

는 난 그냥 문제를 일으키는 하나 개의 작은 것은 잘못된 일을 해요 확신 해요,하지만 내 인생 내가 그것을 알아낼 수 없습니다.

솔루션 :

- (void)roundCornersAnimated:(BOOL)animated { 
    UIRectCorner corners = UIRectCornerTopLeft | UIRectCornerTopRight; 

    UIBezierPath* newPath = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:corners cornerRadii:CGSizeMake(8.0f, 8.0f)]; 
    UIBezierPath* oldPath = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:corners cornerRadii:CGSizeMake(0.0001f, 0.0001f)]; 

    CAShapeLayer* layer = [CAShapeLayer layer]; 
    layer.frame = self.bounds; 

    self.layer.mask = layer; 

    if(animated) { 
     CABasicAnimation* a = [CABasicAnimation animationWithKeyPath:@"path"]; 
     [a setDuration:0.4f]; 
     [a setFromValue:(id)oldPath.CGPath]; 
     [a setToValue:(id)newPath.CGPath]; 

     layer.path = newPath.CGPath; 
     [layer addAnimation:a forKey:@"path"]; 
    } else { 
     layer.path = newPath.CGPath; 
    } 
} 

정말 내가 할하는 데 필요한 모든 애니메이션 가치 '에서'적절한 설정했다.

+1

솔루션 대신 질문의 일부의 답변으로 좋은 것입니다,하지만 어쨌든 도움이 +1 : – buildsucceeded

답변

10

경로가없는 모양 레이어를 만든 다음 경로를 추가하는 동작을 시도하는 것처럼 보입니다. 모양 레이어는 특별한 경우이므로 그렇게하지 마십시오.

애니메이션 앞뒤의 모양 레이어에 패스가 있어야하며 패스의 앞뒤에 같은 수의 포인트가 있어야합니다.

코너 반경이 0 인 둥근 직사각형 패스를 수동으로 (일련의 측면 및 코너 호를 사용하여) 생성 한 다음, 라운딩 할 모서리에 대해 반지름이 0이 아닌 새 패스를 작성해야합니다. 해당 경로를 애니메이션으로 설치하십시오.

경로가 정확히 같은 수의 점이 있어야하기 때문에 작동하지 않을 수도 있습니다. 그리고 반지름이 0 일 때 호가 점으로 단순화 될 것으로 생각됩니다.

방금 ​​모서리를 선택할 수있는 사각형을 만드는 UIBezierPath 호출을 발견했습니다. 호출은 bezierPathWithRoundedRect입니다. byRoundingCorners : cornerRadii :

이렇게하면 원하는만큼 둥근 모서리가있는 사각형이 만들어집니다. 그러나 경로 애니메이션에서 작동하는지 확실하지 않습니다. 반지름이 0 인 2 개의 둥근 모서리를 사용하여 모든 모퉁이를 반올림해야 할 수도 있습니다. 그렇게하면 경로의 애니메이션이 올바르게 작동하도록 반올림 된 사각형 패스와 같은 수의 점을 가진 패스가 생성 될 수 있습니다. 당신은 그것을 시도해야합니다.

layer.path = newPath.CGPath; 

후 :

+0

감사 있도록합니다. 당신이 옳았. 애니메이션의 올바른 '시작'값을 설정하면됩니다. –

4

봅니다 넣어

[layer addAnimation:a forKey:@"path"]; 
관련 문제