PHP

    【PHP】ブラウザで遊べるRPG風の戦闘ゲームの作り方

    PHPでブラウザで遊べるRPG風の戦闘ゲームを作ってみました。

    このゲームは、ブラウザにボタンを表示して「ボタンが押されると相手に攻撃し、敵を倒すと回復する」というように状態に応じてゲームのように表示するウェブページウェブアプリです。

    この記事では、PHPで簡単なWebアプリを作ってみたいという方に向けて「RPGの戦闘風ゲームの作り方」を紹介します。

    PHPとは

    まず、PHPとは何か?から説明します。

    PHPの目的は、HTMLソースを出力することです。

    通常、Webページを表示するには、HTMLファイルが必要です。

    作ったHTMLファイルをサーバーにアップしておくことで、そのサーバーにアクセスするとWebページが表示されます。

    誰がいつアクセスしても表示される内容は変わりません。

    一方、PHPファイルは、通常のHTMLを表示する機能に加えて、計算したり、条件を判断する機能(プログラムが組める)があるので、表示する内容を状況に応じて変更できます。

    例えば、webページを開いた時間を判断して「おはよう」や「こんにちは」と表示を変えることもできます。

    プログラムで書くと以下のような感じになります

    if (時間が朝だったら) {

      echo "<p>おはよう</p>";

    } 
else {

      echo "<p>こんにちは</p>"

    }

    このように、条件によって表示する内容(HTMLソース)を変えられることがPHPの特徴です。

    プログラムはいつ動き出すのか?

    PHPのプログラムは、HTTP通信がある度に実行されます。

    HTTP通信とは、簡単に言うとインターネットの通信だと思ってください。

    今回作ったアプリでは、画面にボタンがあり、そのボタンを押すと、サーバーに送信されるしくみになっています。

    サーバーに送信する時にプログラムが動くので、表示内容が変更でき、ゲームのように画面を写すことができます。

    今回作ったアプリの概要を説明します。

    PHPバトルゲームの概要

    今回作ったアプリは、RPGの戦闘ゲームです。

    以下のような仕様となっています。

    • ボタンを押すと、モンスターに攻撃する(モンスターのHPを減らす)
    • モンスターからの攻撃を受ける(自分のHPを減らす)
    • モンスターの体力が1以上残っていたら戦闘を続ける
    • モンスターの体力が0になったら戦闘終了(自分のレベルを上げる)
    • 戦闘が終了すると「HPを回復する」か「次のモンスターと戦う」を選べる

    プログラムの流れ

    1. ウェブページにアクセスがあると、最初のページを表示します。
    2. 次に、ボタンが押されると、データが送信されます。データを元に計算して表示します。
    3. 敵を倒したら(変数の値が0以下になったら)トップページに戻るためのリンクを表示します。

    この流れで、ゲームっぽいウェブページを作っています。

    最初に表示されるページを作成

    まずは、一番最初に表示するページを作ります。

    キャラクターの初期パラメータ表示とフォームを作っていきます。

    基本的な画面表示

    // 基本画面表示

    echo 'ゆうしゃ' . '<br>' . "\n";

    echo 'LV:'. $player_lv . '<br>' . "\n";
    
echo 'HP:'. $player_hp . '<br>' . "\n";
    
echo '<br>' . "\n";
echo $msg . "\n";
    
echo '<br>' . "\n";
echo '<br>' . "\n";
    
    


// フォームボタン

    echo '<form method="post">'. "\n";

    echo '<input type="hidden" name="player_lv" value="'.$player_lv.'">'. "\n";

    echo '<input type="hidden" name="player_hp" value="'.$player_hp.'">'. "\n";

    echo '<input type="hidden" name="monster_hp" value="'.$monster_hp.'">'. "\n";
    
echo '<input type="submit" name="battle" value="たたかう">'. "\n";
    
echo '</form>'. "\n";

    echo は文字を出力(HTMLにする)する命令です。

    ソースの構成要素は3つです。

    1. プレイヤーの名前、HP、レベルなどのパラメータ表示
    2. メッセージの表示
    3. フォーム

    フォームの <input type=”hidden”> は、画面には表示されませんが、データを送信できるタグです。

    HTMLフォームのしくみ

    フォームで送信(ボタンがクリック)されると、サーバーにデータが送信されます。それと同時にPHPのプログラムが実行されます。

    これによって、プレイヤーのHPや敵のHPを計算して画面の表示を変更しています。

    formタグには必須の属性が2つあります。

    <form action="index.php" method="post">
    action属性

    データ送信先のファイルパスを指定します。データの送信と同時にここで指定したファイルへ画面遷移します。

    method属性

    データの送信方法を指定します。getかpostです。

    フォームによって送信されたデータは、PHPであらかじめ用意されたスーパーグローバル変数 $_POST[‘inputで指定したname’] に保存されます。

    if (isset($_POST["monster_hp"])) {
        $monster_hp = $_POST["monster_hp"];
    }

    このようにすることで、送信されたデータをPHPの変数で使うことができます。

    条件によって表示内容を変える

    条件によって、表示するHTMLを変えるプログラムを作ります。

    例えば、敵を倒した時は「次のモンスターと戦う」ボタンを表示する、というようなことです。

    // HPを計るための変数
    var $monster_hp = 10;
    
    if (モンスターに攻撃したら) {
        // モンスターのHPを5減らす
        $monster_hp = $monster_hp - 5;
    }
    
    // モンスターのHPが0以下になった場合
    if ($monster_hp <= 0) {
        // 戦闘終了フラグをたてる
        $isFinish = True;
        // メッセージを決める
        $msg .= "モンスターを倒した!";
    }
    
    // メッセージを表示する
    echo $msg;
    
    
    // 戦闘終了フラグが立っていたら
    if ($isFinish == True) {
        // 次のモンスターと戦うボタンを表示
        echo '<input type="submit" name="next" value="次のモンスターと戦う">';
    }

    このような流れで、ゲーム風ウェブページを作りました。

    よかったら遊んでいってください。

    ブラウザで遊べるRPG風の戦闘ゲーム

    記事を読んでくださりありがとうございました。

    この記事が参考になった、おもしろかったという方は、

    広告をクリックしていただけると励みになります。

    よろしくお願いします!!