スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

スプライトを使う

今回は"スプライト"を利用してアイテムを動かしてみましょう。目標は下のFLASHです。
クリックしてみてください。

前回に加え、★が回転して動いていると思います。

今回はこの動きをやってみます。

手順は以下の通りです。

*サイズは240x240でやっています。
*前回の.csfファイルを用います。
  1. シンボルリスト下部で右クリック→アイテムを追加→スプライト追加。

  2. サイズを 幅:48,高さ:48 に設定(★のサイズと同じ)し、OKを押す。
    今回はスプライト名を"★_回転"とします。

  3. スプライトをクリックすると、上部に編集ボタンがあるのでクリック。


  4. すると、右のレイヤー画面がスプライト(★_回転)になります。
    ここの使用方法は、通常のレイヤー画面と変わりません。

  5. アイテム[★]をレイヤーに移動。


  6. ここから、細かい設定を行います。

  7. [★]の1フレーム目で位置を、x=24,y=24 , 制御点(X)=24,制御点(Y)=24 に設定。


  8. ちなみに"X:"をクリックすると制御点が画面の中心に、"制御点(X)"をクリックすると制御点がアイテムの中心に設定されます。意外と使います。

    制御点はアイテムの中心となる点です。★のサイズは48x48なので、おおよそ(24,24)が中心となります。

  9. ★の1フレーム目をコピーし、14フレーム目に貼り付ける。

  10. 右下で"角度"を 336 (°)と設定。(*追記参照)


  11. 1フレーム目に戻り、トゥイーンにチェックを入れる。


  12. まずここまででプレビューを見てみましょう。

    ★が回転していますか?
    (制御点をおおよそにとったので、綺麗な回転になっていないかもしれませんが、そこは妥協。)

    では、メインのレイヤー画面に戻りましょう。

  13. レイヤー上部の ★_回転 (ID:~) をダブルクリック。


  14. ここからは、前回のアイテム[★]がレイヤーにあると仮定して、時間短縮な方法で説明します。
    無い方は、アイテムを動かしてみよう-トゥイーン-の 5.~10. を参照してください。(下の方法も試してくださいね^^)

  15. 前回に作ったレイヤーにある[★]を右クリック→プロパティ(又はダブルクリック)。

  16. 参照シンボルを"スプライト|★_回転"にし、OKをクリック。


  17. すると、テキストアイテム[★]がスプライト[★_回転]に置き換わります。

これで完成です。

虫眼鏡ボタンで早速プレビュー。

回転した★が左上から右下へ移動していたら成功です^^


■今回の要点
・複数の動きを行いたいときは"スプライト"を使う。
制御点はアイテムの中心になる。
・スプライトからメインに戻るには、 スプライト名 (ID:~) をダブルクリック。
・プロパティ→参照シンボルでアイテムが置き換えられる。

こんな感じです。

スプライトはとってもよく使うので、動きを混ぜたいときはぜひ使ってください^^
(今回のもテキストアイテム[★]の角度を変えれば回転しますが)
*何故 336°?
数学のお時間です。

★を1回転させるのに14フレームを336°にしました。

1回転なら360°なはずなんですが・・・。

言ってみれば簡単で、

14フレームの次は1フレームに戻りますよね?

で、1フレーム目は 0°→ 0°= 360°。

1フレームを15フレーム(360°)とみなすと、360÷15=24°なので1フレームに24°回転すればいい感じになるわけです。

なので、14フレームには 24×14=336°と入れました。

これは通常使いませんのでかるーく流してくださいw

多分、アクションスクリプトというもので行うと思います(オイラ的には)。

Comment

(編集・削除用)
管理者にだけ表示を許可

Trackback

URL
http://moepict.blog109.fc2.com/tb.php/4-6f397e05
この記事にトラックバック(FC2Blog User)

プロフィール

クロワッサン@

Author:クロワッサン@
FLASHへの質問はコメントにて。

↓携帯サイトはコチラ

QRコード
*FLASHと画像で萌えサイト

カテゴリ

スポンサードリンク

検索フォーム

月別アーカイブ

最新記事

最新コメント

Twitter

Twitter < > Reload

Copyright © クロワッサン@
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。