BLOGブログ

2021.11.17UE4/ Blueprint

[UE4]閉じても消えないスコアランキングを作ろう

執筆バージョン: Unreal Engine 4.26

こんにちは、ゲームデザイナーの西尾です。

今回はリザルト画面で使えそうな
スコアランキングを作って行きます。

セーブデータを作ってスコアを保存するため
ゲームを終了してもスコアは初期化されません。

 


【制作手順】

今回はスコアランキングと、セーブデータの読み込みや作成に関するの記事となりますが
説明の為「ポイントやスコアがあるプロジェクト」の作成も行います。

準備その1(スコアカウント)
スコアを作り、カウントします。

準備その2(リザルト画面)
ゲーム終了時のリザルト画面を作ります。

 

①セーブクラスとスコアデータの作成
セーブクラスを作り、保存用の変数を配列で作成します。

②ロード・セーブの処理を作成
スコアのセーブ、ロード、セーブデータが無ければ作る処理を作ります。

③スコアランキングの作成
セーブデータからスコアを表示する処理を作ります。


■準備その1(スコアカウント)

準備その1、その2で作成するのは、「コインを取る」や「敵を倒した数」などのスコアを想定した機能ですので
既にプロジェクトがある方は、[①セーブクラスとスコアデータの作成]までスキップして大丈夫です。

まずはスコアを作り、カウントさせましょう。
プレイヤーBPを開き、Int型の変数を作ります。(変数名:Score)

続いてマウス左クリックのインプットを出し、画像の様に繋ぎます。
左クリックをするとScoreに+1されていくノードの完成です。

 


■準備その2(リザルト画面)

続いてリザルト画面を作ります。
UIというフォルダを作り、ウィジェットを新規作成します。(ウィジェット名:Result)

続いてResultを開き、Textを二つ配置します。
その後VerticalBoxを配置し、その中に配置した2つのテキストを入れます。

テキストは下記の様に設定します。

上のText
・テキスト:今回のスコア
・サイズ:40

下のText
・テキスト:(スコア)
・サイズ:100

下のTextでスコアを表示させます。
Content>Textの右側にあるバインド作成をクリックします。

 

続いて画像の様にBPを組みます。
ThirdPersonCharacterをCastし、先ほど作ったInt型の変数(Score)を呼び出し
ReturnNodeに繋いで表示させます。

 

ThirdPersonCharacterで先ほど作ったUI(Result)を表示させましょう。

BeginPlayとCreateWidgetを配置し、繋げます。(ClassはResultを選択してください。)
CreateWidgetのReturnValueを伸ばし「変数を作成」を選択して変数を作成します。(変数名:Result)
マウス右ボタンのインプットを配置し、「Add to Viewport」と繋ぎます。Targetには先ほど作った変数「Result」を繋げてください。

 

プレイして見て見ましょう。

動画の様に左上にスコアがカウントされていき
最後にリザルトのUIが表示されていれば成功です。

これをベースに「スコアランキング」を作って行きましょう。


■①セーブクラスの作成

Saveというフォルダを作り、セーブクラスを新規作成します(クラス名:MySaveGame)

 

続いてMySaveGameを開き、Int型の変数を配列で作ります。(ScoreBord)
今回はリザルト画面で3つのスコアを表示させたいので
デフォルト値を3つ作り、昇順になる様値を入れていきます。


■②スコアデータのロードとセーブ処理

Result内で、セーブデータの作成、ロード、セーブの処理を作ります。

まずResultを開き、マクロを3つ新規作成します(マクロ名:LoadGame・SaveGame・ScoreUpdate)

 

続いてLoadGameのマクロを開き、画像の様にBPを組みます。
Load Game from SlotのSlotNameには「ranking」と記載します。
またCastToMySaveDataのAsMySaveDataから、変数を新しく作成します(変数名:SaveData)

 

続いて、先ほど作成したマクロ「ScoreUpdate」を開き、以下の画像の様にBPを組みます。

赤枠の「RemoveIndex」は、
指定されたIndexの値を削除するノードで、
配列にデータを多く持たせないために繋いでいます。

今回はIndex「3」の値、つまり配列の4番目を削除していますが、
表示させたいスコアを増やしたい場合は
このIndexの値も増やしてください。

 

次に「SaveGame」を開き、画像の様にBPを組みます。
「Save Game from Slot」の「SlotName」には「ranking」と記載します。

「SaveGame」のマクロにはこのノードしか入れないので
実はマクロにする意味はないのですが
整理の為に作っています。

イベントグラフへ戻り、カスタムイベントを作成します(イベント名:Start)
次に先ほど作った3つのマクロを繋ぎ、以下の様にBPを組みます。

 

最後にThirdPersonCharacterを開き
カスタムイベント「Start」を呼び出します。


③スコアランキング作成

最後にリザルト画面にスコアランキングを作成しましょう。
Resultを開き、Textを追加します。
バインディングを作成しFanction名を「Score_0」と名前を変え、SaveData内の「ScoreBoard」の値を表示させます。

「Score_0」はSaveData内の0番目の値(一番得点の高い値)を表示させているので
「1stScore」のテキストにバインドしています。
同じ手順で赤枠のところを1・2に変更した「Score_1」と「Score_2」を作り
それぞれのテキストにバインドします。

お疲れ様でした。これで完成となります。

 


あとがき

サクッとゲームを制作すると
スコアを競うという仕様になる事が多いかと思いますが
スコアの保存まで手が回りにくい印象があったので、今回ご紹介させていただきました。

過去のスコアをランキングとして表示できれば
ループ式のゲームとして大きな意味合いが生まれます。
「やった!3000点に到達したぞ!」や「お前の記録を塗り替えてやった!」など
出来たらとっても楽しいですよね。

是非実装して、楽しい作品にして頂ければと思います。