格ゲーなどでおなじみの、ライフゲージ等横棒ゲージの表示・連動方法です。
Sliderという機能を使うと、とても簡単に設置できます。
成果物
![gage3](https://sunagitsune.com/wp-content/uploads/2021/08/gage3.gif)
ゲージを作り、ゲーム内のパラメータと連動させます。
ゲージの実装
スライダーの作成
![gage1](https://sunagitsune.com/wp-content/uploads/2021/08/gage1.gif)
弾をあまり連発できても面白くないので、間欠的にしか撃てなくしたんですが、「打てるようになるタイミング」をキャラの色で表現したところなんかしっくりこないので、
![slider1](https://sunagitsune.com/wp-content/uploads/2021/08/slider1.png)
気力的な何かのゲージを作ることにします。ヒエラルキーで+(Create)→UI→Sliderと進みます。
![slider2](https://sunagitsune.com/wp-content/uploads/2021/08/slider2.png)
Canvasをまだ作ってない場合、大体こんな感じで巨大なキャンバスとスライダーが作られるはずなので、
![slider3](https://sunagitsune.com/wp-content/uploads/2021/08/slider3.png)
Canvasのレンダーモードをスクリーンスペース-カメラにし、
![slider4](https://sunagitsune.com/wp-content/uploads/2021/08/slider4.png)
Main Cameraをセットして、表示順も前に出しておきます。
![slider5](https://sunagitsune.com/wp-content/uploads/2021/08/slider5.png)
好きな位置に配置し、サイズなどを調節します。
ハンドルとゲージ内の〇の除去
![slider6](https://sunagitsune.com/wp-content/uploads/2021/08/slider6.png)
初期状態で表示されてるハンドルはゲーム内でプレイヤーが左右に動かすことができ、直接Valueを変更することができます。音量調節などではこのままでいいんですが、
![slider7](https://sunagitsune.com/wp-content/uploads/2021/08/slider7.png)
今回は非表示にしたいので、ヒエラルキーのSlider配下にあるHandle Slide Areaをクリックして、
![slider8](https://sunagitsune.com/wp-content/uploads/2021/08/slider8.png)
無効にしときます。これでハンドルは表示されなくなります。
![slider10](https://sunagitsune.com/wp-content/uploads/2021/08/slider10.png)
初期状態のスライダーは最大値と最小値にValueを動かしても、左右にちょっとpadding的な余裕がある=ゲージが全て埋まらないので、
![slider11](https://sunagitsune.com/wp-content/uploads/2021/08/slider11.png)
ヒエラルキーでFill Areaに入り、
![slider12](https://sunagitsune.com/wp-content/uploads/2021/08/slider12.png)
Rect Transformの左と右の値を0にします。
![slider17](https://sunagitsune.com/wp-content/uploads/2021/08/slider17.png)
さらにFill Area配下のFillにあるRect Transformの幅を0にすれば、
![slider13](https://sunagitsune.com/wp-content/uploads/2021/08/slider13.png)
ゲージの中にある〇を消すことができます。このへんはお好みですが。
スクリプトとゲージの連動
![slider14](https://sunagitsune.com/wp-content/uploads/2021/08/slider14.png)
大体準備ができたので、最後にSliderのMax ValueとMin Valueを設定します。今回は最大50、最低0としました。
![slider15](https://sunagitsune.com/wp-content/uploads/2021/08/slider15.png)
プレイヤーキャラのスクリプトで名前空間でusing UnityEngine.UI;、クラス内でpublic Slider 変数名;を宣言します。
![slider16](https://sunagitsune.com/wp-content/uploads/2021/08/slider16.png)
作ったスライダーをセットして、
![slider18](https://sunagitsune.com/wp-content/uploads/2021/08/slider18.png)
スライダーの変数名.valueの値を足したり引いたりしてやれば、
![gage2](https://sunagitsune.com/wp-content/uploads/2021/08/gage2.gif)
「弾を撃てるタイミング」のゲージが完成します。
ライフゲージも作る
![slider19](https://sunagitsune.com/wp-content/uploads/2021/08/slider19.png)
同様にライフゲージも作っていきます。名前は別にしておいて、
![slider20](https://sunagitsune.com/wp-content/uploads/2021/08/slider20.png)
その他同様にセットしていきますが、どっちがどっちかわかりづらいので、
![slider21](https://sunagitsune.com/wp-content/uploads/2021/08/slider21.png)
fillにあるImage内の色を変更してやり、
![slider22](https://sunagitsune.com/wp-content/uploads/2021/08/slider22.png)
隣と差別化します。
![gage3](https://sunagitsune.com/wp-content/uploads/2021/08/gage3.gif)
実行結果です。最大値は5としました。
![](https://sunagitsune.com/wp-content/uploads/2021/07/computer-1343393_1280-160x90.jpg)
やりたいことから逆引きするUNITYの使い方まとめ
Unityをやりたいことから学習していけるよう、機能・用途別にまとめたページです。C#の命令別の逆引きは現時点で作っていません。2019の時期に書き始めているので、それより前のバージョンについては言及しません。
コメント