kwikのAnimationでPath(パス)に沿ったアニメーションの機能がありますが、ここではFlashで作成したパスアニメーションの情報をKwikにExternal(外部)コードとして、インポートしてみたいと思います。
元ネタは、こちら http://developer.coronalabs.com/code/animation-along-path-flash
FlashのCircular Path Animationはこちらを参照 http://www.cgshelf.com/circularpathanimation.php
1.まずkwikで画面を作ります。PSDファイルを保存して、Flashでインポートします。レイヤーを維持して、インポートします。
2.アニメーションさせたいレイヤーに対して、ガイドレイヤーを作成、モーショントゥイーンを作成します。ここでは、そのムービクリップにobjectとインスタンス名を付けました。
3.フレーム1と最終フレームに、以下のアクションスクリプトを設定して、座標データを取得します。
//フレーム1
var tracking = true;
var xcoords = "";
var ycoords = "";
var rotations = "";
addEventListener(Event.ENTER_FRAME,myFunction);
function myFunction(event:Event) {
if (tracking) {
xcoords += (object.x + ",");
ycoords += (object.y + ",");
rotations +=(object.rotation + ",");
}
}
//最終フレーム
tracking = false
trace( "xcoords = { " + xcoords.slice( 0, -1 ) + " }");
trace( "ycoords = { " + ycoords.slice( 0, -1 ) + " }");
trace( "rotations = { " + rotations.slice( 0, -1 ) + " }");
stop();
4.再生(Test)を実行
出力されたOutputをコピペする
xcoords = { ##### }
ycoords = { ##### }
rotations = { #### }
5.フォトショップ Kwikに戻り、下記のExternal Codeを設定する。アニメーションさせるレイヤー名は、Shape_1です。
local xcoords = { ##### }
local ycoords = { ##### }
local rotations = { #### }
local coordCount = 1
local function moveObject()
if coordCount <= #xcoords then
Shape_1.x = xcoords[ coordCount ]
Shape_1.y = ycoords[ coordCount ]
Shape_1.rotation = rotations[coordCount]
coordCount = coordCount + 1
else
Runtime:removeEventListener( "enterFrame", moveObject )
coordCount = 1
end
end
Runtime:addEventListener( "enterFrame", moveObject )