Hako.png(402 byte) プレイヤーのHPを表示できるようにする

プレイヤーのHPを表示できるような、体力バーをつくってみます。
今回の講座は、各種状態表示に応用することができます。
(この講座は「プレイヤーがダメージを受けられるようにする」を見てから読むといいです)

もくじ

  1. ステップ1:オブジェクトをつくってアニメーションを編集
  2. ステップ2:ステータスマップをつくってオブジェクトを配置
  3. ステップ3:マップを読み込むためのオブジェクトを作成する
  4. ステップ4:HPバーのイベントを編集する



ステップ1:オブジェクトをつくってアニメーションを編集

Floppy.png(261 byte)サンプル画像
objtut02_02.png(1114 byte)
まずは、HPを示すバーを作成しましょう。
今回の講座でも、サンプル画像を用意しました。
自分で画像を用意してもいいですが、画像の用意が面倒な方などは、
右の画像をご利用ください。

それでは、オブジェクトを新規作成します。
名称を「HPバー」として作成し、用いる画像の大きさに合わせてオブジェクトの大きさを
設定してください。
なお、サンプル画像を利用する方は、縦、横ともに16[px]としましょう。

画像1:フリーサイズ設定

(クリックで拡大)
次に上記の画像を参考に、「フリーサイズを有効にする」にチェックをつけ、つづいて
「画像を並べて表示」にもチェックを入れてください。

ワンポイント
「フリーサイズを有効にする」ようにすると、配置オブジェクトの大きさをゲーム実行時および
マップ編集時に変えることができるようになります。
また、「画像を並べて表示」を設定すると、配置オブジェクトが拡大した時に元の画像を
引き延ばすのではなく、元の画像を並べるように表示することができます。

詳しくは、オブジェクト制作講座「サイズ変更可能なオブジェクトをつくるには?」を
参照してください。

つづいてアニメーションを作成します。
以下より、サンプル画像を用いて説明しますので、自身で画像を用意した方は、適宜読み替えて
ください。

画像2:アニメーション新規作成ボタン

(クリックで拡大)

まずは、通常の手順でアニメーション新規作成ボタンを押し、アニメーション新規作成
ウインドウを表示させます。
(アニメーション新規作成ボタンは、上記赤枠部分に示す部分にあります。)

画像3:アニメーション編集

(クリックで拡大)

アニメーション編集ウインドウ上で、以下のように編集を行います。
  1. 上図画像@部分から、使用する画像を選択します。
  2. 上図画像A部分から、使用するフレームを選択します。
    サンプル画像を使用の場合は、右上にあるオレンジ色の絵をクリックします。
  3. 画像B部分の「領域分割を有効にする」にチェックを入れ、分割部分の幅と高さを入力します。
    サンプル画像を使用している方は、上図のとおりに数値を入力してください。
  4. 名称を付けて、決定ボタンを押します。

領域分割とは
詳しくは制作講座の「領域分割モード」の項を参照してください。

ここまでできたら、アニメーションの設定は完了です。

ステップ2:ステータスマップをつくってオブジェクトを配置

作ったオブジェクトをマップに配置する前に、マップを新規作成します。
チュートリアル7にある作業を終えている場合は、このステップを読み飛ばしても大丈夫です。)

HPバーは、プレイヤーの移動にかかわらず、常に
画面上の同じ場所に表示されている必要が
ありますね。そこで、プレイヤーが存在するマップと、
HPバーを置くマップを別々にし、2つのマップを同時に
表示させることにします。

このようにすることで、たとえばプレイヤーが
動き回っても、HPバーは画面上の同じ場所に表示
できるようになります。
また、たとえば「マップ1」から「マップ2」へ移動した
場合でもHPバーを表示し続けることができるように
なります。



マップグループについて
マップグループは、上記のような動作をさせるのに使用する機能のことです。
詳しくは、ヘルプファイルの「マップグループ」を参照してください。


画像:ステータスマップの新規作成

(クリックで拡大)

まずは、マップを新規作成しましょう。
名称を「ステータスマップ」とし、マップの大きさは画面サイズと同様にしておきます。
画面サイズと同様にするには、上図の赤枠部分のボタンをクリックします。

つづいて、「マップグループ」を設定します。

画像:マップグループの新規作成

(クリックで拡大)

編集は以下の手順で行います。
  1. 上図@部分をクリックし、編集ダイアログを表示させます。
  2. 表示されたダイアログのA部分をクリックし、名称を「ステータス」としてマップグループを作成します。
  3. 上図B部分に、作成したマップグループが表示されていることを確認します。
  4. OKボタンを押して、ダイアログを閉じます。

つづいて、作成したステータスマップに、マップグループ「ステータス」を割り当てます。

画像:マップにマップグループを割り当て

(クリックで拡大)

編集は以下の手順で行います。
  1. 上図@部分をクリックし、設定ダイアログを表示させます。
  2. A部分から、作成した「ステータス」マップグループを設定します。
  3. B部分「カメラ固定」設定にチェックをつけます。
  4. OKボタンを押して設定を完了します。

「カメラ固定」について
カメラ固定設定は、マップ上でカメラを動かさないときに使用します。
今回は、ステータスマップ上でカメラを動かしてはいけないので、カメラ固定を設定しました。

なお、カメラ固定でないマップを2つ以上同時に実行することはできません。
(マップスクロールが正常にできないなどの不具合が発生します。)

これにて、マップグループの設定は完了です。
作成したステータスマップに、HPバーオブジェクトを配置しておきましょう。


ステップ3:マップを読み込むためのオブジェクトを作成する

作成したステータスマップを読み込むために、オブジェクトを作成します。
適当な名称でオブジェクトを新規作成したら、イベント開始条件「配置オブジェクト発生時」に
以下のようにイベントを組みます。

コマンド1:マップを読み込むイベント
マップをよみこむ
設定するイベントパラメータ:
パラメータ名称 設定する値
設定するマップ 作成した「ステータスマップ」を設定します。
ゲーム進行
死亡フラグを立てる(消滅させる)
設定するイベントパラメータ:
パラメータ名称 設定する値
操作対象配置オブジェクト 「自分自身」を設定します。
オブジェクト

ここまでできたら、このオブジェクトをゲーム開始時に読み込むマップに配置しましょう。



うまくいっていれば、実行時にプレイヤーが動いてもHPバーは画面上から動かないことが
確認できます。


ステップ4:HPバーのイベントを編集する

まずは、配置オブジェクトが読み込まれたときに、以下のような動作をさせることを考えます。
  • HPバーが重力によって落下しないようにする
  • はじめのバーの長さをプレイヤーHPから決定するようにする
それでは、HPバーオブジェクトの「配置オブジェクト発生時」イベント開始条件を編集します。
編集前に、このイベント開始条件のイベントデータベースに、「初期HP」という名称で
整数値データアイテムを作成しておいてください。


以下のようにイベントを組んでいきます。

コマンド2:HPバーが発生した時のイベント
重力の発生を設定する
設定するイベントパラメータ:
パラメータ名称 設定する値
重力を発生させる 「いいえ」を設定します。
オブジェクト→速度・モーション・重力系
配置オブジェクトの各種値をデータベースに代入
設定するイベントパラメータ:
パラメータ名称 設定する値
代入対象オブジェクト値 「HP」とします。
代入先データアイテム さきほど作成したイベントデータベース内の「初期HP」データアイテムを設定します。
代入対象オブジェクト 共有データベースなどに設定しておいたプレイヤー配置オブジェクトデータアイテムを設定します。
よくわからない場合は、制作講座の「武器をつくる:ステップ3」の一部に共有データベースにプレイヤー配置オブジェクト データアイテムを作成・設定する手順が記載されていますので参考にしてください。
データベース
配置オブジェクトの幅を設定する
設定するイベントパラメータ:
パラメータ名称 設定する値
(参照データアイテム) イベントデータベース内の「初期HP」データアイテムを設定します。
倍率 適当に倍率を設定します。サンプル画像を用いた場合は16くらいがいいかも。
操作対象配置オブジェクト 「自分自身」を設定します。
オブジェクト→サイズ

上記イベントでは、以下のような処理をしています。
  • まずは重力の影響を受けないように設定
  • 初期HPに代入されたHP情報を用いて配置オブジェクトの幅を設定

ワンポイント
上記イベントコマンド「配置オブジェクトの幅を設定する」は、指定した配置オブジェクトの幅を
変更するためのものです。
設定される幅は、以下の式で決定されます。

設定される幅 =「変更後の幅」×「倍率」


つぎに、HPバーの長さを変更するユーザー定義イベント開始条件を作成します。
名称を「バーを更新」とし、ユーザー定義イベント開始条件を作成しましょう。

左の画像を参考に、作成したイベント開始条件の
イベントデータベースを編集します。
作成するデータアイテムの種別は整数値です。

このデータアイテムは、引数機能を用いるために
作成します。


つづいて、作成したイベント開始条件のイベントを以下のように編集します。
コマンド3:HPバーの長さを変更するイベント
配置オブジェクトの幅を設定する
設定するイベントパラメータ:
パラメータ名称 設定する値
(参照データアイテム) イベントデータベースに追加したデータアイテム「設定する値」を設定します。
倍率 適切な倍率を設定します。(サンプル画像を用いている場合は16くらいがいいかも)
操作対象配置オブジェクト 「自分自身」を設定します。
オブジェクト→サイズ

つづいて、バーの長さをどのタイミングで変更するかを考えます。

プレイヤーは、ダメージを与えるオブジェクト
(敵とか)にあたると、HPを減らす処理を実行する
必要がありますね。
今回は、この処理の部分に、さきほど作成した
HPバーの長さを更新するイベント開始条件を呼び出す
処理を追加します。


ちなみに、講座「プレイヤーがダメージを受けられるようにする」では、HPを減らす
処理を実装しました。
上記の講座でHP処理を記述した方は、制作したユーザー定義イベント開始条件「ダメージ処理」の
中に、処理を追加するようにします。

今回は、講座「プレイヤーがダメージを受けられるようにする」の「ダメージ処理」
イベント開始条件に追加した時の例を以下に示します。
(追加した部分の行番号をオレンジ色で表示しています)

ユーザーのみなさんがHPの処理を組んだ場合は、下のイベントコマンドのオレンジ色の行番号部分を
参考にしてみてください。

コマンド4:ダメージ処理イベント改良版
ヒットポイントを設定する
設定するイベントパラメータ:
パラメータ名称 設定する値
設定モード 「加算」とします。
(参照データアイテム) イベントデータベース内の「HP増減量」データアイテムを設定します。
操作対象配置オブジェクト 「自分自身」とします。
オブジェクト
配置オブジェクトの各種値をデータベースに代入
設定するイベントパラメータ:
パラメータ名称 設定する値
代入対象オブジェクト値 「HP」とします。
代入対象データアイテム イベントデータベースの「現在のHP」とします。
代入対象オブジェクト 「自分自身」とします。
データベース操作
他配置オブジェクトイベント開始条件を呼び出す
設定するイベントパラメータ:
呼び出し先配置オブジェクトをマップから設定し、呼び出す開始条件を「バーを更新」とします。

つづいて、「設定する値」パラメータの「参照データベース」を、HP情報が格納されているデータアイテムに設定します。
データベース操作
条件分岐
設定するイベントパラメータ:
  • 比較対象1:イベントデータベース内「現在のHP」データアイテム
  • 比較対象2:整数値「1」
  • 比較演算子:以上
とします。
フロー制御→繰り返し実行セット
繰り返し処理
設定するイベントパラメータ:
  • 比較対象1:イベントデータベース内の繰り返し数
  • 比較対象2:イベントデータベース内のカウンター
  • 比較演算子:以上
とします。
フロー制御→繰り返し実行セット
配置オブジェクトの透明度を設定する
設定するイベントパラメータ:
パラメータ名称 設定する値
透明度 0を設定します。
操作対象配置オブジェクト 「自分自身」を設定します。
オブジェクト→表示
指定時間イベントを待機する
設定するイベントパラメータ:
パラメータ名称 設定する値
待機時間 適当に設定します。(50ミリ秒ぐらいがいいかな)
フロー制御
配置オブジェクトの透明度を設定する
設定するイベントパラメータ:
パラメータ名称 設定する値
透明度 255を設定します。
操作対象配置オブジェクト 「自分自身」を設定します。
オブジェクト→表示
指定時間イベントを待機する
設定するイベントパラメータ:
パラメータ名称 設定する値
待機時間 適当に設定します。(50ミリ秒ぐらいがいいかな)
フロー制御
プログラム計算
設定するイベントパラメータ:
イベントデータベース内のイベントデータアイテム「カウンタ」に1を足すように数式を組みます。
参考画像
プログラム計算ボタンで追加
繰り返し実行終了点
イベントパラメータの設定はありません。
フロー制御→繰り返し実行セット
条件分岐終了点
イベントパラメータの設定はありません。
フロー制御→条件分岐セット


ここまでできたら、ダメージを与えるオブジェクトをマップ上に配置して実行してみましょう。


主人公がなんらかのダメージを受けた時、HPバーの長さが短くなれば成功です。

===(講座おわり)===



←もくじへもどる