以前作ったBORDER LINEというFlashのミニゲームをwonderflに投稿しました。今さらになってwonderflにはまっている自分。。
BORDER LINE – wonderfl build flash online
wonderflというサイトはブラウザ上でAction Scriptを組めるという素晴らしいサイトですが、既存のFlashを投稿するには色々と手を加えないといけない部分が多く、非常に苦労したので、そのときの注意点を3つほど挙げておきたいと思います。
1. タイムラインアニメーションは使えない
いや、使えないというわけではないのですが、ちょっと大変かなと思います。
サイト上ではActionScriptしか組めないので、Flashのツール上で作るトゥイーンアニメーションなどはどうしても使えないからです。なので動きを付けたい時は、定期的に実行されるenterFrame関数を作り、その中でオブジェクトを移動するスクリプトを書く必要があります。
トゥイーンアニメをスクリプトで表現する…なかなか熱いですね。
どうしてもタイムラインアニメーションを使いたい場合は、別途swfを作り、それをwonderflからスクリプト上で読み込めば使えるかと思います(たぶん)。
2. ステージサイズとフレームレートに注意
wonderflのデフォルトのステージサイズは465*465です。フレームレートは30です。特にこだわりが無ければ上記で作ることをおすすめします。自分は、ステージサイズ240*240、フレームレート24で作っていたのであとで調整するのに苦労しました。
変更するときは、下記のような記述をpackage直下(importしている箇所と同じ階層)に記述すると大丈夫でした。
[SWF(backgroundColor="#000000", width="240", height="240", frameRate="24")]
ちなみに背景を変えるのもちょっと苦労しました。色々試したのですが、結局コンストラクタ内で塗りつぶした矩形を置くことで解決しました。
// constructor code
public function Test() {
// background
this.graphics.beginFill(0x000000, 1.0);
this.graphics.drawRect(0, 0, 240, 240);
}
3. フォントの埋め込みが難しい
一番苦労したのがフォントの埋め込みです。通常外部フォントを使う場合フォントを埋め込んだswfを読み込むかと思いますが、まずswfはwonderflには置けないので自分のサーバー上に置くしかない。
そうなると、セキュリティ上wonderfl外のドメインにあるswfを読み込むことになるので、色々と設定が必要になってきます。
そのあたりはこの投稿を参考にしてみるといいかもです。
ちなみに2個目は自分がformしたやつです。オリジナルを参考にしたらどうにかうまくいった例ということで。
ついでに言うと、いくつかのフォントはwonderflにあるライブラリ(net.wonderfl.utils.FontLoader)を利用すれば使えるみたいです。そのあたりの仕様は下記を参考にすると良いかと思います。
