iOSでアニメーションを行う方法<UIKit編>2014.03.31技術ブログiOSでアニメーションを行う方法<UIKit編>初めまして。当社でアプリ開発を行っている、新人エンジニアのなめ橋です。これから、開発で覚えた技術的なことや気になったニュースなどを記事にしていきたいと思います。わかりやすくて面白く、読み応えのあるブログにできるよう頑張りますので、宜しくお願いします。第1回目の今回は、iOSでアニメーションを行う方法についてです。私自身、今までもiOSでのアプリ開発は行ってきたのですがアニメーションに関してはほとんど触れることがありませんでした。今回、担当したプロジェクトでアニメーション作成に携わることとなったので、勉強したことをまとめていこうと思います。iOSでアニメーションを行うには何種類か方法があるのですが、まずは1番簡単なUIKitを使う方法から始めてみます。プロジェクトを作成まずは準備としてアプリケーションプロジェクトを作成します。Xcodeのバージョンは5.1を使用します。Xcode→File→New→Projectを選択。Applicationを選択しプロダクトネームを入力。XIBにチェックを入れクラスを作成。(今回はAnimationViewとします)AnimationViewをAppDelegateに宣言し、windowのrootViewControllerに設定。5番目の段階で、APPDelegateはこのようになります。YES;}これで実行したところ、XIBによって作成した画面が表示されました。次に、XIBを利用してLabelとButtonをViewに配置します。こんな感じになるはずです。配置完了後、LabelをAnimationView.hにプロパティとして宣言いたします。XIB上のLabelを右クリックし、そのままAnimationView.hかAnimationView.mにドラッグし変数名を入力してください。(今回はmoveLabelとしました。Insideイベントも定義します。今回はanimationStartという名前で宣言しました。この段階でAnimationView.hとAnimationView.mファイルはこのようになります。アニメーションの作成いよいよ本題です。アニメーションを作成してみます。今回作成するアニメーションはLabelの位置を移動させるという最も単純なアニメーションです。ネタバレになってしまいますが先にコードを見てみます。_moveLabel.frame.size};}];これだけです。上記をSTEP.2で作成したButtonのイベントハンドラに定義することで、ボタンを押下するとアニメーションが実行されます。この方法は複数あるアニメーション作成方法の中で、おそらく一番簡単かつ細かな設定が可能なアニメーションを行う方法です。メソッド解説それでは詳しく見てみましょう。このanimateKeyframesWithDuration:delay:options:^animations:^completion:メソッドはiOS7から対応しています。それ以前のOSバージョンではこの方法によるアニメーションは実行できないので注意が必要です。引数は以下のようになっております。第二引数のdelayは、アニメーションが開始される時間を指定時間だけ遅らせるものです。第四・第五引数が本メソッドで最も便利になった箇所です。今までは、アニメーション終了後に特定の動作をさせたいときは、アニメーションの終了を通知するメソッドをオーバーライドし、その中でアニメーションの切り分けをした後、処理を記述する必要がありました。このメソッドの登場で切り分けが不要となり、またブロック構文にて「アニメーション処理」と「終了後の処理」が記述可能となったため、コードの可読性が上がりました。※CABasicAnimationを使用した方法でもブロック構文での処理は可能です。上記のコードでアニメーションは出来ました。以下が上記アニメーションの実際の動作になります。正直なところ、アニメーションを作成する前は、座標計算や描画関連の設定等が必要なのかなぁ等と考えてましたが想像していたよりも全然簡単に実現することができました。その他のアニメーションメソッドについてまた、UIViewには他にも以下のようなアニメーションを行うメソッドが用意されております。delay:usingSpringWithDamping:initialSpringVelocity:options:animations:completion:※バネ風のアニメーションを行います。usingSpringWithDamping:揺れ動く大きさを指定(0~1)initialSpringVelocity:に初速の速さを指定3番目のメソッドに関しては、バウンドするアニメーションを実装したいときにとても使い勝手がいいと感じました。実際の動作とコードは以下のようになります。_moveLabel.frame.size};}];以上でUIKitを用いたアニメーションの方法を終わります。indexともに世界をアップグレードできる、そんな日を夢見て。