web-dev-qa-db-ja.com

UIBezierPathをアニメーション化する方法

長方形のUIBezierPathを三角形のものにアニメーション化したいのですが、パス上のビューをアニメーション化するのではなく、パス自体をアニメーション化して、ある形状から別の形状に変形させたいと思います。パスがCALayerに追加されます

CAShapeLayer *maskLayer = [CAShapeLayer layer];
maskLayer.fillColor = [[UIColor whiteColor] CGColor];    
maskLayer.path = [self getRectPath];

-(CGPathRef)getTrianglePath
{
    UIBezierPath* triangle = [UIBezierPath bezierPath];
    [triangle moveToPoint:CGPointZero];
    [triangle addLineToPoint:CGPointMake(width(self.view),0)];
    [triangle addLineToPoint:CGPointMake(0, height(self.view))];
    [triangle closePath];
    return [triangle CGPath];
}

-(CGPathRef)getRectPath
{
    UIBezierPath*rect = [UIBezierPath bezierPathWithRect:self.view.frame];
    return [rect CGPath];
}
objective-canimationcalayercgpathuibezierpath
25
Yogev Shelly

私はCoreAnimationの専門家ではありませんが、次のようにCABasicAnimationを定義できます。

CABasicAnimation *morph = [CABasicAnimation animationWithKeyPath:@"path"];
morph.duration = 5;
morph.toValue = (id) [self getTrianglePath];
[maskLayer addAnimation:morph forKey:nil];

最初の行は、レイヤーのpathプロパティを変更するアニメーションを定義することを示しています。 2行目は、アニメーションに5秒かかることを示し、3行目は、アニメーションの最終状態を示しています。最後に、アニメーションをレイヤーに追加します。キーはアニメーションの一意の識別子です。つまり、同じキーで2つのアニメーションを追加すると、最後のアニメーションのみが考慮されます。このキーは、いわゆる暗黙のアニメーションをオーバーライドするためにも使用できます。デフォルトでアニメーション化されるCALayerのプロパティがいくつかあります。より正確には、これらのプロパティの1つを変更すると、変更は0.25の期間でアニメーション化されます。

31
Jan Christiansen