|
2. 入門講座 - 3. 「MoveBall」
跳ね返るボールを作りながら、ムービークリップ、ActionScriptプロパティなどについて勉強しましょう。
2- 3- 0. ボールの用意
今回題材となるボールを用意します。ツールパレットの楕円ツールを選択します。クリック、ドラッグすると楕円が出来るはずです。色や形を整えておきましょう。
2- 3- 1. シンボルに変換
早速ムービークリップに変換します。先ほど用意した楕円を右クリックして、「シンボルに変換」というものを選択しましょう。すると、「シンボルに変換」ウィンドウが開くはずです。「ムービークリップ」を選択し、「OK」を押します。（ここでの名前は「ライブラリ」の名前に用いられます。）
2- 3- 2. インスタンス名
ムービークリップにインスタンス名を付けます。プロパティウィンドウの「＜インスタンス名＞」という欄に「ball_mc」と書いて下さい。
2- 3- 3. レイヤーの追加、ActionScriptの記述
新しいレイヤーを作り、そのレイヤーの１フレーム目を選択します。そのフレームのアクションウィンドウに
ballv = 30;
ballx = ballx + ballv;
ball_mc._x = ballx;
|
と書き込んで下さい。「ballx」「ballv」は変数、「ball_mc._x」はムービークリップ「ball_mc」の「x座標」です。
※「ballv」に代入する数値は自由に設定して構いません。色々試してみましょう。
2- 3- 4. フレームの追加
時計同様、このままではボールは動きません。そこで、「DigitalWatch」と同じようにフレームを追加します。
2- 3- 5. ムービープレビュー
本当に動くか、試してみましょう。
2- 3- 6. 条件分岐
このままでは、ボールは画面の外へ出てしまい戻ってきません。そこでボールが画面枠まできたら跳ね返るようにします。
まずフレームを３つ用意します。
Actionレイヤー - １フレーム目のアクション
//初期位置の設定
ballx = 100;
bally = 120;
//初期移動量（方向）の設定
ballv = 30;
//ball_mcへ代入
ball_mc._x = ballx;
ball_mc._y = bally;
|
Actionレイヤー - ２フレーム目のアクション
//位置の更新
ballx = ballx + ballv;
//条件分岐（枠へ着いたら方向を反転）ボールの大きさ20px*20px
if ( ballx < 10 || ballx > 230 ) {
ballv = ballv*(-1);
}
//ball_mcへ代入
ball_mc._x = ballx;
|
Actionレイヤー - ３フレーム目のアクション
//位置の更新
ballx = ballx + ballv;
//条件分岐（枠へ着いたら方向を反転）ボールの大きさ20px*20px
if ( ballx < 10 || ballx > 230 ) {
ballv = ballv*(-1);
}
//ball_mcへ代入
ball_mc._x = ballx;
//２フレーム目へ戻り再生
gotoAndPlay(2);
|
と書きます。式の意味などは、「//」のあとに書いてあります。「//」はコメントの先頭を表すアクションで、プログラムが複雑になってくると非常に役に立ちます。
「ballx + ballv」に違和感を感じるかと思います。各変数の意味から、「長さ + 長さ/時間」となっているからです。「ballx + ballv * dt」として、フレームレート（fps）が１０の場合、１フレーム目に「dt = 0.1」を加えておくとスッキリしますね。
2- 3- 7. ムービープレビュー
ボールが跳ね返っているように見えるはずです。発展として、y方向（縦）に動かしてみたり、跳ね返り後の速度を減らしたりしてみましょう。
|
