CAShapeLayerパスのグリッチ/フリッカーのアニメーション化（楕円から矩形および背面へ）

Question

CAShapeLayerのパスの値を楕円から矩形に変更する明示的なアニメーションを作成するときに問題が発生しています。私のキャンバスコントローラのIセットアップで

基本CAShapeLayerとルートビューのレイヤに追加します。次に

CAShapeLayer *aLayer; 
aLayer = [CAShapeLayer layer]; 
aLayer.frame = CGRectMake(100, 100, 100, 100); 
aLayer.path = CGPathCreateWithEllipseInRect(aLayer.frame, nil); 
aLayer.lineWidth = 10.0f; 
aLayer.strokeColor = [UIColor blackColor].CGColor; 
aLayer.fillColor = [UIColor clearColor].CGColor; 
[self.view.layer addSublayer:aLayer]; 

、私はパスをアニメーション化するとき、私は最後の数フレームで奇妙なグリッチ/ちらつきを取得形状が矩形になるときのアニメーション、最初の数フレームでは矩形からアニメーション化されます。次のようにアニメーションが設定されている：

CGPathRef newPath = CGPathCreateWithRect(aLayer.frame, nil); 
[CATransaction lock]; 
[CATransaction begin]; 
[CATransaction setAnimationDuration:5.0f]; 
CABasicAnimation *ba = [CABasicAnimation animationWithKeyPath:@"path"]; 
ba.autoreverses = YES; 
ba.fillMode = kCAFillModeForwards; 
ba.repeatCount = HUGE_VALF; 
ba.fromValue = (id)aLayer.path; 
ba.toValue = (__bridge id)newPath; 
[aLayer addAnimation:ba forKey:@"animatePath"]; 
[CATransaction commit]; 
[CATransaction unlock]; 

私はなど、さまざまなフィルモードで遊んで、CATransactionをロック/アンロックのような多くの異なるものを試してみました...

をここでグリッチのイメージがあります： http://www.postfl.com/outgoing/renderingglitch.png

私が経験しています何のビデオはここで見つけることができます： http://vimeo.com/37720876

Answer 1

残念ながら、これは、そうでない場合は畏怖の制限がありますCAShapeLayersのいくつかのアニメーション可能なパスプロパティ。

基本的に、2つのパスの間の補間を試みます。デスティネーションパスとスタートパスのコントロールポイント数が異なると、問題が発生します。カーブと直線エッジにはこの問題があります。

楕円を1つの楕円の代わりに4つの曲線として描画することで、エフェクトを最小限に抑えることはできますが、依然として適切ではありません。私は曲線からポリゴンにスムーズに行く方法を見つけていない。

ほとんどの方法で最後の部分のフェードアニメーションに移行できますが、これはうまく見えません。

Answer 2

私は、石英-devのリストからこのフィードバックを受け取っ：

デビッド・ダンカンは書きました：あなたのようになどからアニメーション化されたとき シェイプレイヤーのパスをアニメートする

のみ動作することが保証されます。矩形は 行のシーケンスですが、楕円は円弧のシーケンスです（CGPathApplyを使用して生成された シーケンスを見ることができます）。そのため、アニメーション は非常によく見えるか、うまく動作するとは限りませんまったく。レンダリングが 長方形のように見えるさせるようなパラメータを持つ

これを行うには、あなたは基本的にあなたが楕円を作成するために使用するのと同じ曲線を使用して ことにより、矩形のアナログを作成する必要がありますが、 。これは難しいことではありません。また、 CGPathAddEllipseInRectをガイドとしてCGPathApplyから取得したパスに を使用することもできますが、正しく調整するには 調整が必要になることがあります。