前回に引き続き、Core Animationの話をしよう。
Core Animationが始めて紹介されたのは、WWDC 2006のLeopardプレビューにおいてだ。そのときは、iPodのCMである「1000 Songs」をCore Animationで再現したデモを流し、開発者達に大きな興奮を巻き起こした。
1000 SongsのCM
1000 Songsは、iTunesが持つアルバムのカバー画像を使って、アルバムタワーを作り上げていく映像だ。膨大な数の画像が、次々とアニメーションを繰り返していく。
今回は、この1000 Songsデモの再現に挑戦してみよう。
レイヤーを用意する
Core Animationでは、「レイヤー」と呼ばれる構造を基本として、アニメーションを行う。レイヤーは、セルアニメーションのレイヤーと似たようなものだと考えてほしい。複数のレイヤーを重ね合わせて、それらを別々に動かすことでアニメーションを実現するのだ。
まず、背景となるレイヤーを用意しよう。Core Animationのレイヤーは、指定した色で塗りつぶすことができる。今回は、黒で塗りつぶしておこう。
また、画像を表示する領域のレイヤーも、別途用意しておこう。今回の目的は、画像の「タワー」を作り上げることなので、このレイヤーをウォールレイヤーと呼ぶことにする。ウォールレイヤーは、分かりやすいように、グレーで塗りつぶしておく。
背景とウォールレイヤー
