スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

【ゲーム開発】HP ゲージを減少させていく(超初歩)

毎回カテゴリを何処にするかで迷います。

色々な物に HP は存在しますが、
ダメージを与えていくと HP が減少していく処理。

内部で HP が減るだけなら HP -= Damage; と書けばいいですが
どれだけダメージを与えたのか視覚化しなければプレイヤーは解りません。

ドラクエのような HP が数字で出てるなら意外と楽チンなんですが
HPゲージを設けるとなるとほんのちょっと工夫が要ります。

と言う事で今回の記事は
「画像と連動させて減少していく HP ゲージの実装」を挙げたいと思います。
連動させて~なんてたいそうな事言ってますがやる事は
画像の幅を縮めていくだけです。

この方法は、HPゲージ(画像)の幅(あるいは高さ)を0~100%(0.0~1.0)の状態とし、
残りの HP から比率を計算し、画像の幅を決定すると言うものです。


例えば、横幅(Width)が 640px、縦幅(Height)が 10px のHPゲージを作ったとします。
この HP ゲージは横に変化していくとします。

ボスキャラの HP が1000あると想定します。
一回のダメージで10ダメージあるとすると
100回の攻撃でプログラム的な HP は0になります。
この値と画像の幅を連動させてあげればいい訳なので比率の計算になります。

HpMax = 1000; // ボスの最大HP
NowHp = HpMax; // 現在の残りHP(ダメージを喰らってないので1000)
Width = 640; // 画像の幅最大値

今のHP から、最大HP を割る事で残りHP の比率が計算できます。

NowHp = NowHp/HpMax; // HP の比率計算

今は、1000/1000 なので 1 が結果として出てきます。
この 1 は比率を表しているので、これに Width を掛けます。

NowHp/HpMax * Width;

計算すると 1000/1000 * 640 = 640 と出てきます。
これは、「描画すべき画像幅がいくらなのか」が解ったと言う事です。

そこで、ダメージ判定が入りました。
ダメージは10ですので NowHp -= 10; とします。

今度の計算は 990/1000 になるので 0.99 になります。
この値と Width を掛ければいい事になります。

0.99 * 640 = 633.6 になります。
画像幅(640px)を 0.99 倍するということですね。

計算には小数点が入ってきます。
この方法だと厳密に計算したい時は難しいですが、それっぽい雰囲気だけは出ます。

NowHp が半分になると、
500/1000 * 640 = 320 となります。

なので、描画すべき幅は 320px となる訳ですね。
こうやって比率を計算するだけで画像と連動した HPゲージを実装出来ます。

もし縦に縮めていく HP ゲージを作りたいなら
NowHp/MaxHp * Height でいいですね。


この方法の注意点は、画像を段々と縮めていきますので
グラデーションや、模様が描いてある画像を縮めると、
ぼやけてしまったり画像が荒れてしまったりする点です。

それが嫌だ!と言うのであれば HP ゲージを細かく分けて描画すると言う方法もありです。
一例ですが、Width = 640px の画像を10分割し、
一個のHPを 64px ごとに操作する方法も考えられます(HP ゲージを10回描画する)

一個の画像が縮まっても、他の九個の画像には影響がありませんので
画像の荒れや、ぼやけを抑える事は可能ですが
分割した分だけしっかりと管理する必要が出てきます。


今回のは超初歩と言う事でそんな大したもんは書いてませんが
ちょっとした雰囲気を出したいなら全然実用レベルじゃないかな~と思います。

この記事へのコメント

トラックバック

URL :

検索フォーム
プロフィール

DVDM

Author:DVDM
自作ゲームの開発過程ブログ。
赤髪愛なら誰にも負けない。

 
Pixiv バナー


ブロとも申請フォーム
最新記事
カテゴリ
最新コメント
最新トラックバック
RSSリンクの表示
リンク
ブロとも一覧
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。