広告あり

Unreal Engine コツコツ自習_ゴール画面を作成する【iOSモバイル】

UEコツコツ自習シリーズ
スポンサーリンク

簡単なiPhone向け3Dゲームを作ろう

iPhone向けの3Dゲーム制作の練習シリーズです。

アンリアルエンジンでiPhone向けの3Dゲーム制作方法をまとめていきます。

細かな数値設定などの説明をしない場合もありますので、ご参考程度で確認ください。

※作業環境:UEバージョン5.5.1 Macbook Pro 2019年モデル iPhone11

私の使用したMacの性能だと、作業中の処理落ち、遅延が頻繁に発生しました。
もし同じような端末を使用する場合は、細目に保存することをお勧めします。

ゴール画面作成

目的の場所に着いたらゴール画面を表示して、ゲームをリセットできるようにしていきます。

ゴール用のレベルを作成する

ゴール画面用のレベルを作成していきます。

「MyGame」の「Level」フォルダーを開きます。

右クリックし、「Level」を選択します。

レベル名を「End」にします。

「End」レベルを開きます。

レベルを追加したので、こちらも追加しておくことを忘れずに。

UIを作成する

ゴール画面を作成していきます。

「MyGame」の「UI」を開きます。

右クリックし、「User Interface」の「Widget Blueprint」を選択します。

「Pick Parent Class for New Widget Blueprint」画面が表示されるので「User Widget」をクリックします。

ファイル名を「WBP_End」にします。

「WBP_End」を開きます。

「Palette」の「Canvas Panel」を配置します。

「Palette」の「Text」を配置します。

リスタート用の「Button」と「Text」を配置します。

「Palette」の「Image」を配置し、画面いっぱいに広げて、色などを調整します。

お好みで画像や文字を変更してください。

クリアータイムを表示する

ゴールしたときにクリアータイムを表示したいので、処理を追加していきます。

タイムを入力している「Text」を選択します。

「Details」の「Is Variable」にチェックを入れて、要素名は「TextBlock_1」にします。

画面右上の「Graph」をクリックします。

「Graph」画面に切り替わります。

「My Blueprint」の「VARIABLES」にある「TextBlock_1」をドラック&ドロップします。

「Get TextBlock_1」を選択して、ノードを配置します。

「TextBlock_1」ノードから「SetText (Text)」ノードを呼び出します。

「SetText (Text)」ノードが配置できました。

「Event Construct」ノードと「SetText (Text)」ノードを繋げます。

「Get Game Instance」ノードを配置し、「Cast To GI_MyGame」ノードを呼び出し、「Event Construct」ノードと繋げます。

「Cast To GI_MyGame」ノードから「Get Minite」ノードを呼び出します。

同じように「Get Second」ノードも呼び出します。

こんな感じになります。

適当な位置で右クリックし、「String」の「Append」ノードを呼び出します。

「Append」ノードが配置できました。

「Append」ノードの「Add pin」横の「+」を3回クリックして、「C,D,E」のピンを追加し、下の写真のようにノードを設定、接続します。

上の写真の真ん中のノードは、自動で配置されるAutocastノードです。

「Append」ノードと「SetText (Text)」ノードを繋げます。

「To Text (String)」ノードは自動で配置されます。

ノード処理全体は、こんな感じになります。

これでタイムが表示されるようになりました。

ゴール画面に切り替える

ゴールしたときに「End」レベルに切り替わるようにしていきます。

「MyGame」フォルダーを開きます。

「BP_Goal」を開きます。

「On Component Begin Overlap」ノードに接続されている「Print String」ノードを削除します。

「On Component Begin Overlap」ノードから「Open Level (by Name)」ノードを呼び出します。

「Open Level (by Name)」ノードが配置できました。

「Open Level (by Name)」ノードの「Level Name」を「End」と入力します。

これでプレイヤーがゴールコーンと重なったときに「End」レベルに移行するようになりました。

タイマーをストップする

ゴールしたときにタイマーを停止させます。

「On Component Begin Overlap」ノードと「Open Level (by Name)」ノードの間に、「Clear Timer by Function Name」ノードを配置します。

「Clear Timer by Function Name」ノードが配置できました。

「Other Actor」と「Object」を繋いで、「Function Name」に「CountUp」と入力します。

これでタイマーは停止できました。(後ほど他の方法を説明します。)

UIを表示する

「End」レベルにゴール画面を表示していきます。

「End」レベルを開いた状態で、「分岐マーク?」をクリックし、「Open Level Blueprint」を選択します。

「End」レベルのブループリント画面に切り替わります。

「Event BeginPlay」ノードから「Create Widget」ノードを呼び出し、「Add to Viewport」ノードも配置します。

「Create Widget」ノードの「Class」は、「WBP_End」にします。

リスタート処理を追加する

ゴール画面が表示された後のゲーム再スタートするボタン処理を追加していきます。

「WBP_End」を開き、配置しておいた「Button」要素を選択します。

「Details」の「Events」を確認します。

「On Clicked」の横にある「+」をクリックします。

「On Clicked」ノードが配置されます。

「On Clicked」ノードから「Open Level (by Name)」ノードを呼び出します。

「Open Level (by Name)」ノードが配置できました。

「Open Level (by Name)」ノードの「Level Name」を「Main」と入力します。

これでボタンを押すことで、ゲームが再スタートできるようになりました。

もしレベルの切り替えが、うまくいかないときは「Open Level (by Object Reference)」ノードを使用してみてください。

タイマーを停止させる別の方法

タイマーを停止させる別のやり方も試してみます。

「Content」の「ThirdPerson」の「Blueprins」の「BP_ThirdPersonGameMode」を開きます。

「Set Timer by Event」ノードを見つけます。

「Set Timer by Event」ノードの「Return Value」から「Promote to variable」を選択します。

変数が作成され「Set」ノードが配置されるので、変数名を「Timer Event」にします。

「BP_Goal」を開きます。

既に配置している「Clear Timer by Function Name」ノードを削除し、「Get Game Mode」ノードを配置します。

こんな感じになります。

「Get Game Mode」ノードから「Cast To BP_ThirdPersonGameMode」ノードを呼び出します。

「Cast To BP_ThirdPersonGameMode」ノードを「On Component Begin Overlap」ノードの先に配置し繋げます。

「Cast To BP_ThirdPersonGameMode」ノードから「Get Timer Event」ノードを呼び出します。

「Get Timer Event」ノードから「Clear and Invalidate Timer by Handle」ノードを呼び出します。

「Clear and Invalidate Timer by Handle」ノードを配置できました。

下の写真のようにノードを繋げます。

この方法でもタイマーを停止できます。

エラー対応

テストプレイすると以下のようなエラーが発生することがあります。

これを改善していきます。

「BP_Goal」を開きます。

先ほど作成した処理を見つけます。

適当な位置で右クリックし、「Get Player Pawn」ノードを呼び出します。

「Get Player Pawn」ノードから「Unbind Event from On Destroyed」ノードを呼び出します。

下の写真のようにノードを繋げます。

これでテストプレイするとエラーが発生しなくなります。

ゲームの流れをテストしたい場合は、一度「Start」レベルを開いてから、テストプレイしてください。

ここまでで、とりあえずゲームは完成としたいと思います。

ゴール画面作成完了

今回はここまでです。

次回は「アプリリリースのための準備」の予定です。

前後記事

他の記事を探す

他の記事も気になる方は、以下の記事の目次を確認ください。

タイトルとURLをコピーしました