Flashゲーム作成講座

初心者からクリエイター志望まで Flashゲームの作り方 入門

ゲームの作り方を初心者にも分かりやすく説明します。ゲームクリエイターを目指す方にも役立つ情報を。

敵を表示する その2

前回は敵のシンボルを作り絵を入れました。
また、ステージに表示するとき土台となるシンボルの配置を行いました。

 

 

敵をステージに表示しよう

敵のシンボルを作成しても、まだステージに配置していません。
プログラムの実行中に表示する為には、実体を作ることと
実体をステージに配置する作業が必要です。

 

次のようにプログラムを変更して下さい。

const LINE_MAX = 6;                  // 宝と敵の段数

var enemyArr:Array = [];
var beamFlg:int = 0;

initFunc();

//----------------------------------------------------
// システム関連の初期化
function initFunc() {

    trace("initFunc ---");

    for( var i=0; i < LINE_MAX; i++ ){
        enemyArr[i] = new enemy();   // 敵の作成
        disp.addChild(enemyArr[i]);  // ステージに表示
    }

    initGame();

    // 毎フレームイベントの登録
    stage.addEventListener(Event.ENTER_FRAME, mainloop);
    // マウスイベント 左ボタン押下のイベント登録
    stage.addEventListener(MouseEvent.MOUSE_DOWN, m_down);
}


//----------------------------------------------------
// 毎フレーム処理
function mainloop(event:Event):void {

    // マウスの座標を取得して自機を動かす
    player_mc.x += (player_mc.mouseX / 5);
    
    if( beamFlg == 0 ){              // 0:未発射 1:発射中
        // 未発射なら自機と動きを同期させる
        beam_mc.x = player_mc.x;
    } else {
        // 発射中のとき弾を移動する
        beam_mc.y -= 10;

        if( beam_mc.y < -30 ){       // 画面外へ弾が出たとき
            beamFlg = 0;
            beam_mc.x = player_mc.x;
            beam_mc.y = player_mc.y - 25;
        }
    }
}


//----------------------------------------------------
// ゲーム関連の初期化
function initGame() {

    trace("initGame ---");
    
    beamFlg = 0;                     // 0:未発射 1:発射中

    player_mc.y = 360;               // 自機のy座標(固定)
    beam_mc.x = player_mc.x;
    beam_mc.y = player_mc.y - 25;    // 弾の表示(半分 自機と重ねる)

    for( var i=0; i < LINE_MAX; i++ ){
        // 敵の初期設定
        enemyArr[i].x = 250;
        enemyArr[i].y = (i*42) + 60;
    }
}

//----------------------------------------------------
// マウス左ボタン押されたとき
function m_down(event:MouseEvent):void {

    if( beamFlg == 1 ) return;       // 0:未発射 1:発射中

    beamFlg = 1;

    // 自機の位置に弾を表示する
    beam_mc.x = player_mc.x;
    beam_mc.y = player_mc.y - 25;
}

 

ムービープレビューしてみましょう。

クリックしてビームを撃ってみて下さい。
ビームがUFOの上を通過します。
表示優先の管理が正常に行われていることが分かります。

 

変更点の説明です。

flash クラスを新しく作る方法

1行目、定数の宣言をしています。LINE_MAX が6として扱われます
このように、ただの数値を意味ある言葉に代えて、プログラムを読み易くします。
今回のゲームでは最大6機の敵を表示します。
もし8機に増やしたい時は、この数値を変更するだけで良いというメリットもあります。

3行目、敵を管理するための配列を宣言しています。

14-17行目、敵の実体(インスタンス)を作り、表示登録をしています。
実体を作っただけでは表示されず、どこかに関連付けしないと表示されません。
16行目で dispaddChild を使って関連付け(表示リストへの登録)をしてます。
これでステージに配置された disp を土台として敵を表示することができます。

 

flash 表示位置の指定

63-67行目、敵 enemyArr[] のxy座標を指定しています。
(i*42) は敵を1機表示するたびに42ずつずらして表示するようにしています。

 

 

敵を動かしてみよう

6機の敵を表示しました。
これを左右に動かしてみましょう。

 

次のようにプログラムを変更して下さい。

const LINE_MAX = 6;                  // 宝と敵の段数

var enemyArr:Array = [];
var turn:Vector.<int> = new Vector.<int>(LINE_MAX,true);
var beamFlg:int = 0;
var xSpeed:Number = 0;

initFunc();

//----------------------------------------------------
// システム関連の初期化
function initFunc() {

    trace("initFunc ---");

    for( var i=0; i < LINE_MAX; i++ ){
        enemyArr[i] = new enemy();   // 敵の作成
        disp.addChild(enemyArr[i]);  // ステージに表示
    }

    initGame();

    // 毎フレームイベントの登録
    stage.addEventListener(Event.ENTER_FRAME, mainloop);
    // マウスイベント 左ボタン押下のイベント登録
    stage.addEventListener(MouseEvent.MOUSE_DOWN, m_down);
}


//----------------------------------------------------
// 毎フレーム処理
function mainloop(event:Event):void {

    // マウスの座標を取得して自機を動かす
    player_mc.x += (player_mc.mouseX / 5);

    if( beamFlg == 0 ){              // 0:未発射 1:発射中
        // 未発射なら自機と動きを同期させる
        beam_mc.x = player_mc.x;
    } else {
        // 発射中のとき弾を移動する
        beam_mc.y -= 10;

        if( beam_mc.y < -30 ){       // 画面外へ弾が出たとき
            beamFlg = 0;
            beam_mc.x = player_mc.x;
            beam_mc.y = player_mc.y - 25;
        }
    }

    moveEnemy();                     // 敵の移動
}


//----------------------------------------------------
// 敵の移動
function moveEnemy() {

    for( var i=0; i < LINE_MAX; i++ ){
        // 敵の移動処理
        if( turn[i] == 0 ){
            enemyArr[i].x -= xSpeed;

            // 左際まできたら右移動へ変更
            if( enemyArr[i].x < 20 ){
                turn[i] = 1;
            }
        } else {
            enemyArr[i].x += xSpeed;

            // 右際まできたら左移動へ変更
            if( enemyArr[i].x > 480 ){
                turn[i] = 0;
            }
        }
    }
}


//----------------------------------------------------
// ゲーム関連の初期化
function initGame() {

    trace("initGame ---");

    beamFlg = 0;                     // 0:未発射 1:発射中
    xSpeed = 2.0;                    // 敵の初期移動速度

    player_mc.y = 360;               // 自機のy座標(固定)
    beam_mc.x = player_mc.x;
    beam_mc.y = player_mc.y - 25;    // 弾の表示(半分 自機と重ねる)

    for( var i=0; i < LINE_MAX; i++ ){
        // 敵の初期設定
        enemyArr[i].x = 250;
        enemyArr[i].y = (i*42) + 60;
        turn[i] = 0;                 // 0:左移動 1:右移動 2:右(宝付き)
    }
}

//----------------------------------------------------
// マウス左ボタン押されたとき
function m_down(event:MouseEvent):void {

    if( beamFlg == 1 ) return;       // 0:未発射 1:発射中

    beamFlg = 1;

    // 自機の位置に弾を表示する
    beam_mc.x = player_mc.x;
    beam_mc.y = player_mc.y - 25;
}

 

ムービープレビューしてみましょう。

 

 

変更点の説明です。

flash 変数の宣言をする

4行目、 敵が左右どちら向きで移動中かを判定する為の配列変数を宣言しています。
宣言に Vector を使いました。利点については次のページを参照して下さい。
[ 配列 Vector クラスについて ]

6行目、敵の移動速度を格納する変数です。
移動速度を変数にすることで、ゲームが進むにつれ敵の速度をアップさせるなどの
仕組みが簡単に実現できます。

 

flash 関数にすることで処理内容をまとめる

51行目、このあとに出てくる関数 moveEnemy を呼び出しています。
関数 mainloop は毎フレーム行われるメインとなる関数です。
これから沢山の仕組みをこの関数内に書くことになります。
敵についての処理を1つの関数にまとめた方がプログラムの見易さが向上します。

 

flash 敵を移動させる仕組み

57-77行目、敵の移動を行う関数です。
61行目で移動方向を判定しています。0なら左に向かって移動します。
0以外のときは右に向かって移動します。

ここでの移動処理は仮処理です。
今後、ゲーム内容に合わせたものに変更していきます。

プログラミングの経験が少ない内は、思いついた仕様をそのままプログラムにできない
こともあります。
とりあえず、簡単に実現できる所から作っていくのも1つの手だと思います。

87行目、敵の速度用変数に初期値を代入しています。
97行目、敵の移動方向の初期化を行います。

 

今後、ゲームを作ろうとした時、プログラムを起動した時と、ステージを開始する前とで
それぞれ専用の初期化用関数を作りましょう。
今回のサンプルでは、プログラム起動後には initFunc 関数が1回のみ実行されます。
ゲーム開始前(各ステージ開始前)には initGame 関数が毎回実行されることになります。

 

 

次[ 敵を発生させる ]へ進む