HaxeFlixelによる開発手順 の変更点


[[トップに戻る>FrontPage]]

* HaxeFlixelによる開発手順 [#w890b8b7]
HaxeFlixelを使って開発する際の一般的(と思われる)手順をまとめてみました。

---

#contents

---

** 1.テンプレートプロジェクト作成 [#rf85ac48]
テンプレート作成コマンドを入力してテンプレートプロジェクトを作成。
#geshi(){{
flixel tpl -n "ProjectName"
}}

** 2.テンプレートプロジェクトを修正 [#zffb61e6]
テンプレートに足りない設定を追加します。例えば「Intellij IDEA」のテンプレートであれば、ライブラリのパスやビルドターゲットの設定がされていないので設定しておきます。

** 3.Main.hxを修正 [#g76eb8c1]
解像度やフレームレートを変更、初期StateをPlayStateに修正、起動時のスプラッシュのスキップをtrueにします。

#geshi(Actionscript){{
/// Main.hx
class Main extends Sprite {
    var gameWidth:Int = 320; // 画面の幅
    var gameHeight:Int = 240; // 画面の高さ
    var initialState:Class<FlxState> = PlayState; // 最初の画面
    var zoom:Float = -1; // -1の場合、自動でズームを行う
    var framerate:Int = 60; // フレームレート
    var skipSplash:Bool = true; // 起動時のスプラッシュ表示
    var startFullscreen:Bool = false; // フルスクリーン描画を行うかどうか
}}

** 4.ゲームオブジェクト追加 [#aeacd802]
FlxSpriteを継承したゲームオブジェクトを追加します。
以下、よくある実装方法です。
#geshi(Actionscript){{
/// Player.hx
class Player extends FlxSprite {
  public function new() {
    super(FlxG.width/2, FlxG.height - 64);
    // 画像の読み込みやサイズ、各種パラメータを設定
  }
  override public function update():Void {
    super.update();
    // キー入力や移動処理・状態遷移
  }
}
}}

** 5.PlayState.hxにゲームオブジェクトを配置 [#yd366837]
PlayState.hxでゲームオブジェクトを配置します。
以下、実装例です。
#geshi(Actionscript){{
/// PlayState.hx
class PlayState extends Flxstate {
  private var _player:Player;
  override public function create() {
    // プレイヤーを生成
    _player = new Player();
    add(_player);
  }
}
}}

** 6.ゲームオブジェクトの動作制御や衝突判定を実装 [#ue4a1487]
PlayState.hxに動作制御や衝突判定などゲームルールを実装していきます。
#geshi(Actionscript){{
/// PlayState.hx
class PlayState extens FlxState {
  private var _player:Player;
  private var _shots:FlxGroup;
  private var _enemys:FlxGroup;
  private var _bullets:FlxGroup;

  overrid public function update():Void {
    if(_player.exists == false) {
      // プレイヤー死亡。ゲームオーバー処理へ
    }
    if(_enemys.getFirstExisting() == null) {
      // 敵が全滅。勝利シーケンスへ
    }
    
    // 衝突判定
    FlxG.collide(_player, _emenys, _hitPlayerVsEnemy); // プレイヤーと敵
    FlxG.collide(_shots, _enemys, _hitShotVsEnemy); // プレイヤーの弾と敵
    FlxG.collide(_player, _bullets, _hitPlayerVsBullet); // プレイヤーと敵弾
  }
  
  // 衝突処理
  private function _cbPlayerVsEnemy(player:Player, enemy:Enemy) {
  private function _hitPlayerVsEnemy(player:Player, enemy:Enemy) {
    player.kill(); // プレイヤー死亡
  }
  private function _cbShotVsEnemy(shot:Shot, enemy:Enemy) {
  private function _hitShotVsEnemy(shot:Shot, enemy:Enemy) {
    shot.kill(); // 自機の弾を消す
    enemy.kill(); // 敵を消す
  }
  private function _cbPlayerVsBullet(player:Player, enemy:Enemy) {
  private function _hitPlayerVsBullet(player:Player, enemy:Enemy) {
    player.kill(); // プレイヤー死亡
  }
}
}}

** 7.タイトル画面を作る [#nb54d209]
MenuStateクラスをタイトル画面として実装します

#geshi(Actionscript){{
/// MenuState.hx
class MenuState extends FlxState {
  override function create():Void {
    _text = FlxText(0, 16, FlxG.width); // テキスト生成
    _text.alignment = "center";
    _text.text = "Hello world";
    add(_text);
  }
  override function update():Void {
  }
  override function destroy():Void {
    _text.destroy();
  }
}
}}

** 8.メインゲームとタイトル画面をつなげる [#w062018c]
メインゲームとタイトル画面をつなげて完成です。

タイトル画面の実装例

#geshi(Actionscript){{
/// MenuState.hx
class MenuState extends FlxState {

  override function update():Void {
    if(FlxG.keys.justPressed.SPACE) {
      // SPACEキーが押されたら、ゲーム開始
      FlxG.switchState(new PlayState());
    }
  }
}
}}

メインゲームの実装例
#geshi(Actionscript){{
/// PlayState.hx
class PlayState extens FlxState {

  override public function update():Void {
    if(_player.exists == false) {
      // プレイヤー死亡。ゲームオーバー処理へ(タイトル画面へ戻る)
      FlxG.switchState(new MenuState());
    }
    if(_enemys.getFirstExisting() == null) {
      // 敵が全滅。勝利シーケンスへ
      _nextLevel();
    }
}
}}