iPhone UIViewアニメーションのベストプラクティス
-
08-07-2019 - |
質問
iPhoneでビューの遷移をアニメーション化するためのベストプラクティスと考えられるものは何ですか?
たとえば、アップルの ViewTransitions
サンプルプロジェクトでは、次のようなコードを使用します。
CATransition *applicationLoadViewIn = [CATransition animation];
[applicationLoadViewIn setDuration:1];
[applicationLoadViewIn setType:kCATransitionReveal];
[applicationLoadViewIn setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn]];
[[myview layer] addAnimation:applicationLoadViewIn forKey:kCATransitionReveal];
ただし、次のようなコードスニペットもネット上に浮かんでいます:
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.75];
[UIView setAnimationDelegate:self];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:myview cache:YES];
[myview removeFromSuperview];
[UIView commitAnimations];
最良のアプローチは何ですか?スニペットも提供していただければ幸いです。
注: 2番目のアプローチを正しく動作させることができませんでした。
解決
UIViewリファレンスの beginAnimations:context:
メソッドに関するセクション:
このメソッドの使用は、iPhone OS 4.0以降では推奨されていません。代わりに、ブロックベースのアニメーションメソッドを使用する必要があります。
トムのコメントに基づくブロックベースのアニメーションの例
[UIView transitionWithView:mysuperview
duration:0.75
options:UIViewAnimationTransitionFlipFromRight
animations:^{
[myview removeFromSuperview];
}
completion:nil];
他のヒント
私は後者を多くの素敵な軽量アニメーションに使用しています。 2つのビューのクロスフェードを使用したり、一方を他方の前にフェードインしたり、フェードアウトしたりできます。バナーのように別のビューを撮影したり、ビューを拡大または縮小することができます...
あなたにできることはすべてとは思わない:
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:myview cache:YES];
サンプルは次のとおりです。
[UIView beginAnimations:nil context:NULL]; {
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:1.0];
[UIView setAnimationDelegate:self];
if (movingViewIn) {
// after the animation is over, call afterAnimationProceedWithGame
// to start the game
[UIView setAnimationDidStopSelector:@selector(afterAnimationProceedWithGame)];
// [UIView setAnimationRepeatCount:5.0]; // don't forget you can repeat an animation
// [UIView setAnimationDelay:0.50];
// [UIView setAnimationRepeatAutoreverses:YES];
gameView.alpha = 1.0;
topGameView.alpha = 1.0;
viewrect1.origin.y = selfrect.size.height - (viewrect1.size.height);
viewrect2.origin.y = -20;
topGameView.alpha = 1.0;
}
else {
// call putBackStatusBar after animation to restore the state after this animation
[UIView setAnimationDidStopSelector:@selector(putBackStatusBar)];
gameView.alpha = 0.0;
topGameView.alpha = 0.0;
}
[gameView setFrame:viewrect1];
[topGameView setFrame:viewrect2];
} [UIView commitAnimations];
ご覧のとおり、ビューのアルファ、フレーム、さらにはサイズで遊ぶことができます。遊びましょう。その機能に驚くかもしれません。
違いは、アニメーションの制御に必要な量のようです。
CATransition
アプローチにより、より多くの制御が可能になり、したがってセットアップする項目が増えますタイミング機能。オブジェクトであるため、後で使用するために保存したり、すべてのアニメーションをそのオブジェクトに向けてリファクタリングしたりして、重複するコードを減らすことができます。
UIView
クラスのメソッドは、一般的なアニメーションの便利なメソッドですが、 CATransition
よりも制限されています。たとえば、可能なトランジションタイプは4つのみです(左にフリップ、右にフリップ、上にカール、下にカール)。フェードインしたい場合は、 CATransitionの
フェードトランジションを掘り下げるか、 UIView
のアルファの明示的なアニメーションを設定する必要があります。
Mac OS Xの CATransition
では、トランジションとして使用する任意の CoreImage
フィルターを指定できますが、現在のところ、これを行うことはできません。 CoreImage
が欠けているiPhone。
この簡単なコードを使用して、iOS 5で画像をアニメーション化できます。
CGRect imageFrame = imageView.frame;
imageFrame.origin.y = self.view.bounds.size.height;
[UIView animateWithDuration:0.5
delay:1.0
options: UIViewAnimationCurveEaseOut
animations:^{
imageView.frame = imageFrame;
}
completion:^(BOOL finished){
NSLog(@"Done!");
}];
UIView
のドキュメントで、 ios4 +
+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion
とにかく"ブロック"メソッドは、今日では好まれています。以下に簡単なブロックを説明します。
以下の抜粋を検討してください。 bug2とbug 3はimageViewです。以下のアニメーションは、1秒の遅延後の1秒の長さのアニメーションを示しています。 bug3は、その中心からbug2の中心に移動します。アニメーションが完了すると、「Center Animation Done!」というログが記録されます。
-(void)centerAnimation:(id)sender
{
NSLog(@"Center animation triggered!");
CGPoint bug2Center = bug2.center;
[UIView animateWithDuration:1
delay:1.0
options: UIViewAnimationCurveEaseOut
animations:^{
bug3.center = bug2Center;
}
completion:^(BOOL finished){
NSLog(@"Center Animation Done!");
}];
}
きれいになりました!!!
このリンクで良いチュートリアルを見つけました。これが誰かに役立つことを願っています。
これはスムーズなアニメーションのコードです。多くの開発者にとって役立つかもしれません。
このチュートリアルのコードスニペットを見つけました。
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[animation setAutoreverses:YES];
[animation setFromValue:[NSNumber numberWithFloat:1.3f]];
[animation setToValue:[NSNumber numberWithFloat:1.f]];
[animation setDuration:2.f];
[animation setRemovedOnCompletion:NO];
[animation setFillMode:kCAFillModeForwards];
[[self.myView layer] addAnimation:animation forKey:@"scale"];/// add here any Controller that you want t put Smooth animation.
Swift 3を試してみよう...
UIView.transition(with: mysuperview, duration: 0.75, options:UIViewAnimationOptions.transitionFlipFromRight , animations: {
myview.removeFromSuperview()
}, completion: nil)