スポンサーサイト

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

Suzukaの使い方

初期設定と、Suzukaの画面について簡単に説明します。(配置は異なる場合があります。)

シンボルリストここに使いたい画像や文字などのファイル(アイテム)を置きます。
アイテムの作成・複製もここから。







メイン画面アイテムを動かすのに最も大切な画面。
動かす方向や距離、時間(フレーム数)、色などなどほとんどをここから設定します。

上部にある虫眼鏡のマークはプレビューで、動き全てを見れます。



上のファイル(F)からプロジェクトのプロパティに行くと初期設定が行えます。

プロジェクトのプロパティ携帯はバージョン:SWF4です。(swf6でも一部を除き可能)
幅・高さは携帯側で勝手に画面幅に縮小してくれますが、画像の大きさにしておけば大丈夫でしょう。
ちなみにオイラの場合、待ち受けは240x320で作ってます。
FPSは1秒間に進むフレームの数です。

スポンサーサイト

トゥイーンを使う

アイテムを動かしてみましょう。目標は下のFLASHです。
クリックしてみてください。

★が左上から右下に動いていると思います。

今回はこの動きをやってみます。(CLICKボタンは除く)

手順は以下の通りです。

*サイズは240x240でやっています。
  1. シンボルリストの下で右クリック→アイテムを追加→テキスト追加。

  2. 右下の初期表示テキストに"★"と入力。

  3. 左上のフォント情報でサイズを"48"と入力。(フォント名、文字色は自由。)

  4. OKを押す。

    これで、シンボルリストにアイテム[★]ができました。
    これをレイヤーに追加します。


  5. アイテム[★]の上で右クリック→レイヤーに追加(又はドラッグ)

    これでは★は止まったままなので、動かすように設定します。


  6. ★の1フレーム目を右クリック→コピー。


  7. 同じ横軸の20フレーム目で右クリック→貼り付け。

  8. 1フレーム目の位置を右下で x=-48,y=-48 に設定。

  9. 20フレーム目の位置を同様に x=240,y=240 に設定。


  10. 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:~) をダブルクリック。
・プロパティ→参照シンボルでアイテムが置き換えられる。

こんな感じです。

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

変数とは

複雑な動作をする際には、アクションスクリプトと織り交ぜて変数を使うことがあります。

この変数とは、文字やスクリプト、URLなどのデータを入れておく文字列のことです。

と、書くと難しく思えるかもしれませんが、意外と簡単。


例えば、数学なんかである x=10 。

これは、" x は 10 です。"ってことですが、これと同じです。


FLASHを作るときは、x に 10 を入れておく場合、
    x = 10 ;
と書きます。

場所はアクションスクリプトと同じ、アクションレイヤーです。


大切なのは、最後の" ; (セミコロン) "で、他にも言えますが、スクリプトの最後には ; をつけることがほとんどです。



さて、この変数の使い方ですが、簡単なものだと
のような使い方です。

見て分かるかもしれませんが、この場合
    gotoAndPlay(10);
と同義です。

これなら最初から gotoAndPlay(10); って書いたほうが早いのですが...。


変数へのデータの入れ方は、スクリプトの書き方に書いていきます。

アイテムを表示

テキストアイテムを追加し、FLASHに表示させましょう。

  1. シンボルリストで右クリック→アイテムを追加→テキスト追加を押す。

  2. 設定は弄らずに初期表示テキストに"文字"と書く。

  3. このとき、更新を押すとプレビュー画面が更新されます。("文字"と表示される。)
  4. OKを押す。

  5. シンボルリストに"文字"と書かれたテキストアイテムを追加できました。
    これをFLASHに表示させましょう。
  6. 作成した[文字]を右クリック→レイヤーに追加を押す。

  7. これで"文字"がキャンバス上に表示されたと思います。

ではプレビューを押しましょう。

キャンバスと同様に"文字"が表示されたと思います。
(すぐに表示されない方はアイテムの開始フレームを 1 にしてください。)


他のアイテム(画像など)も同様にレイヤーに追加することで表示されます。


■今回の要点
・使いたいアイテムはシンボルリストに追加する。
・表示したいアイテムはレイヤーに追加する。

プロフィール

クロワッサン@

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

↓携帯サイトはコチラ

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

カテゴリ

スポンサードリンク

検索フォーム

月別アーカイブ

最新記事

最新コメント

Twitter

Twitter < > Reload

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