Hatena::ブログ(Diary)

w7工廠 このページをアンテナに追加 RSSフィード

2012-01-19

canvasでアニメーションを作ってみた(別企画)とか〜

目的はcanvas描画の際、制作者が毎回記述する「canvas生成・図形描画・アニメーション(タイマー)」を簡略化することです。

(ActionSctipt3.0とjcottonの中間のイメージです)

サンプルはこちら→W7工廠分室|トップページ(「canvasでアニメーションを作ってみた(未完成)とか〜」の中にあります。)


企画としては

・初期位置・終了位置を指定、フレーム単位の変化量を計算してアニメーションする→canvasLib(canvasでアニメーションを作ってみた(未完成)とか〜 - w7工廠

・初期位置・変化量を指定、指定時間中は変化量ずつアニメーションする→canvasflash(今回のもの)

となっていましたが、canvasflashに機能を統合しました。(canvasflash v5.8)

・・・・canvasflashというのもおこがましいので、次のバージョンあたりで名前を変えるつもりです。


2012-06-08

・設置/操作マニュアルをつくりました。

2012-06-08

・バージョン履歴をサンプルサイトに移動しました。

2012-06-01

・canvasflash v5.8に機能を統合したため、canvasLibの開発は終了しました。


不具合

・特定環境でのエラー(ChromeとWindowsとIntel Atomの組み合わせでcanvasの描画がおかしいとか〜 - w7工廠

IE8では動きません(excanvas.jsjQueryとの間でなにかあるらしい)


■流れ

f:id:w7test:20120316154457j:image:w640

■手順(main_motion.jsに命令を記述していきます)

1.canvasを生成します。

2.図形を描画します。(グリッド、画像、四角、丸、テキスト、線描けます)

3.図形の色形位置などを指定します。

4.図形の動きを指定し、どの図形を動かすかを決めます。

5.canvasに図形や図形の動きを登録します。

6.スタート・ストップ指示します。

スパム対策のためのダミーです。もし見えても何も入力しないでください
ゲスト


画像認証

トラックバック - http://d.hatena.ne.jp/w7test/20120119/1326947368