■第01章 : とりあえず物体[MC]を動かしてみる。
[2010年09月04日 更新]
序章からだいぶ日にちが空きました……。すみません。今回が第01章になります。
この第01章を御覧になっている方は少なくとも、「グラフィック」「ボタン」
「ムービークリップ」の違いを多少ご理解していただいている方を前提とします。
まだちょっとワカラナイという方はFlash入門本を片手に少し頑張って下さいね。
入門本などは下記のAmazonさんのバナーか、楽天さんのバナーから本を探して
みてくださいね。
一応復習…。
■グラフィック
┗静止画の集まり。アクションスクリプトなどを記述することはできない。
■ボタン
┗何もしない状態(ニュートラル)、マウスカーソルを置いた状態(マウスオーバー)
クリックした状態(Press)、ヒット領域の3つのイベントと、1つのヒット領域を
編集することでボタンを簡単に作成することができる。ムービークリップを
使用しても同じような効果を作ることが可能である。
■ムービークリップ
┗グラフィックの集まりをコントロールしたり、アクションスクリプトを記述したりと
様々なことができる、Flashのメインと言えるオブジェクト。
ではこれから実際に物体を動かすプログラミングを実際に組んでみましょう。
ここでまず、用意するもの、ですが、簡単なモノでOKです。
いちいち、ゲームのキャラに出てくるような手の込んだキャラを描く必要はありません。
そういうのは時間の無駄って言う奴なので、簡単に、■を描きましょう。
そして次に、描いた物体を選択状態にし、シンボルに変換します。
(ライブラリに登録するのです)
この時、どのオブジェクトとして登録するのがいいのか。
とりあえずテストとして動かすので、単純に「ムービークリップ」でいいでしょう。
下記のイメージを参考に3つの手段からどの方法でも良いので、ムービークリップと
してシンボルに変換して下さい。今後、作業を早めるために「F8」キーを使う方法を
覚えておくと大変便利です。
使い方によっては「グラフィック」にシンボル化し、さらに「ムービークリップ」に
シンボル化するやり方もあります。
下記はシンボルに変換するときのダイアログ(ウィンドウ)が表示されたときのイメージです。
変換時に注意が必要なのは
「オブジェクトの基準点」です。
Flashのどのバージョンからかわかりませんが、Flash MX(Ver6.0)はおそらく
最初の状態(デフォルト)はオブジェクトの基準点が
中央だと思います。
(環境によってはインストール時の基準点が違う場合もあるかもしれません…)
CS3(Ver9)やCS4(Ver10)は何もしなければ、基準点は
左上になります。
この基準点の位置はプロパティから座標指定やアクションスクリプトなどから座標を
変更する場合に影響してきます。
(MXの場合プロパティから指定した位置は基準点が影響しませんが
CS3は影響します)(MX2004以上から影響する???)
MXの場合でもアクションスクリプトからX座標を値で指定すると基準点の
影響が出ます。
下記のイメージは基準点を左上と中央にしてシンボル化した2つのオブジェクトを
XY、共に200で指定したイメージです。
その前にステージからの座標の見方を下記の図で確認しておきましょう。
上記のように基準点がバラバラだと座標指定も上手くできません。
複数の人数でFlashデータを制作する場合はあらかじめ基準点をどこにまとめるかを
指定しないと、座標指定が難しくなることがあります。
最悪、座標を指定する計算式も変わってきます。作るモノによっては後々
解消しづらいバグにもなり得ます。余談ですが、この基準点の設定は
サーティファイのFlashクリエイター能力検定にも出てきましたので
覚えておいて損はないと思います。
では話を戻すとして、シンボル化したオブジェクトを
選択(オブジェクトを一度クリック)し、
アクション画面を
開いて下さい。アクション画面はオブジェクトを選択した状態で右クリックして、
プルダウン?メニューから「アクション」を選択して下さい。
アクション画面を開いたら「プロパティ」を見て下記のイメージのように
「ムービークリップ」「インスタンス:シンボル1」(シンボル名は
シンボル化時に指定した名前が表示されます。)
そしてアクション画面の右上のアイコン?をクリックし、メニューから
エキスパートモードをクリックし、モードをノーマルモードから
エキスパートモードに変更します。
モードをエキスパートモードに変更後、下記のイメージのように
アクション画面左側にあるリストの「アクション」「ムービークリップ制御」から
「onClipEvent」をダブルクリックして下さい。
(バージョンにより表記が異なる場合があります)
ダブルクリックしたら右側の「スクリプトペイン」(スクリプトを書くところ)に
「onClipEvent」が挿入され、()内の詳細を選択する画面が出てくると思います。
その中から「enterFrame」を選択します。(手動で記述でもOKです)
enterFrame(EnterFrame)というのはこのイベント内に書かれたスクリプトを
「毎フレーム」実行という意味です。たとえばフレームレートが12の場合は
1秒間にenterFrame内のスクリプトが12回実行されることになります。
ではまずonClipEventのenterFrame内にちょっとしたスクリプトを書いてみましょう。
コピペでもかまいませんが、ここは実際にキーボードで打ち込んでみて下さい。
onClipEvent(enterFrame){
this._x+=1;
}
コレを試しに実行してみましょう。メインメニューの「制御」から
「ムービープレビュー」を実行するか、「Ctrl」キー+「Enter」キーを押して下さい。
ムービーが実行されるとオブジェクトが右へ移動し続けるはずです。
オブジェクトが画面から消えたら何も変わらないのでオブジェクトの移動が
確認できたらプレビュー画面を閉じましょう。
では次が本題、キーボードの十字カーソルキーで自由に動くスクリプトです。
下記のイメージを参考にしながらスクリプトを書いてみましょう。
onClipEvent (enterFrame) {
if (Key.isDown(Key.LEFT)) {
this._x -= 5;
} else if (Key.isDown(Key.UP)) {
this._y -= 5;
} else if (Key.isDown(Key.RIGHT)) {
this._x += 5;
} else if (Key.isDown(Key.DOWN)) {
this._y += 5;
}
}
こうしてみると、前回の序章サンプルの簡易版という感じになります。(^^;)
下記のサンプルはイメージ上のスクリプトとはチョット違いますが
動きは全く同じです。下記のサンプルが次章の
「変数」を使用しています。
↑上記のflaデータ(Zip圧縮)[01_01]↑
次の回までしばらくお待ちください……。
ご意見、ご感想はGon-Fla.netのコメント掲示板に書き込みください。
2011/03/10 現在スパム対策のためBBSは使用できなくなっております・・・
申し訳ございません。