Unity備忘録43頁目「インベントリ内の表示」

江上宿六です。

 

インベントリにアイテムを入れたり出したり出来るように(多分)なったので

次はゲーム内でそのインベントリを表示して、指定したアイテムを取り出したり

出来るようにします。 インベントリの表示に使うのは過去にも使ったUIです。

まずはヒエラルキーにUIのImageを追加しましょう。 Create→UIからImageを選択。

UI用のCanvasが追加され、その子としてImageが追加されます。

既にCanvasが存在する場合は恐らくそのCanvasの子として追加されると思います。

f:id:y6yegami:20190718114232p:plain

相変わらず凄いサイズのCanvasですが、今回はCanvasの下側にImageを配置して

色や透明度なんかも変更してみました。 このImageの上にインベントリ内にある

アイテムのアイコンを表示させていきたいわけです。

f:id:y6yegami:20190718132023p:plain

続けてCreate→UI→Imageとして表示されるアイコンの雛形を作りPrefabにします。

Prefabにしたらシーン上から削除しておきます。 後々必要に応じてInstantiateし

画像を設定する事でアイコンが表示出来るわけです。 このアイコンの雛形は

背景のImageの子オブジェクトとして運用します。

f:id:y6yegami:20190718133243p:plain

インベントリの指定位置のアイコン情報を取得する関数です。 少し関数が

深くなってて分かりにくいですが、インベントリの指定位置にあるアイテムの名前を

取得し、データベースと照らし合わせてそのアイテムのアイコンを返すものです。

f:id:y6yegami:20190718134239p:plain

Instantiate部分です。 先ほどのPrefabをInstantiateしたらImageのspriteを

先ほどの関数を使ってインベントリ0番目のアイコンを取得して設定したら

背景Imageと親子関係を設定します。 あと画像サイズによって自動でscaleが

変わってしまう事があるのでscaleを指定しました。

f:id:y6yegami:20190718142045p:plain

因みにUIをスクリプトでいじる場合はこの一文が必要な事があるので注意です。

 

このInstantiateを呼ぶタイミングなのですが、常にインベントリが表示されている

タイプのものならアイテム取捨のタイミングで呼び出してやったり、インベントリを

開け閉めするタイプなら開けるタイミングで呼び出してやるというのが考えられます。

f:id:y6yegami:20190718135418g:plain

開け閉めするタイプ。 開ける時にInstantiateして閉じる時にDestroyしています。

f:id:y6yegami:20190718140335p:plain

アイテムが沢山ある時Destroyするのが大変そうに思えますが、foreach文を使うと

簡単に全ての子をDestroy出来ます。 ここのinventoryBGというのは背景Imageです。

 

同様にアイテムが沢山ある時にInstantiateする位置を指定するのが面倒だという

事もあると思います。 そういう時はアイコンの親、今回でいう背景画像の所に

GridLayoutGroupというコンポーネントを追加してみると良いと思います。

f:id:y6yegami:20190718140903p:plain

Paddingはオフセット位置で、その他アイコンのサイズ(CellSize)、行間(Spacing)

等を設定しておくと、その子オブジェクトはそのルールに従って配置されるので

面倒な事を考えなくてもよくなったりします。

f:id:y6yegami:20190718141541p:plain

適当に子オブジェクトを複製してみたらこんな感じです。 楽だと思います。

 

とりあえずこんな感じですかね。 なんか今回は説明が雑な気がする。

次回はインベントリを開いている時の操作関係とか。 実際にアイテムを選択して

取り出してみるとか出来たら良いですね。

 

それと上のgifでインベントリが開いている時に時間が止まっていますが。

f:id:y6yegami:20190718135719p:plain

このようにTime.timeScaleの値をいじる事で時間の流れを変えられたりするようです。

スローとか倍速とかも出来るかも知れません、試していませんが。