【UE4 UE5】スタート画面を作ろう！

## スタート画面を作ろう
これを見よう☆
自分より詳しく解説しているよ（それでも見てね！）

https://qiita.com/mml/items/33b7e24cb693e3875d48#%E3%83%A1%E3%83%8B%E3%83%A5%E3%83%BC%E3%81%AE-widget-%E3%81%AE%E4%BD%9C%E6%88%90

<br>
<br>
<br>
<br>
<br>
<br>

メモみたいなもんなんでちょっと雑かも
こういうのを作るよ→「https://gyazo.com/f38fde5b80e50d1d1b398273219f6a73 」
<br>
<br>
マップを作る、**「StartGame_Maps」** って名前にしたよ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/6335b4d6-b64a-2135-efbd-f49ebf378d00.png)
<br>
<br>
テクスチャをインポート（[素材はAward君のをお借りしました](https://www.udemy.com/course/unreal-engine-4-award/)）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/f58e2941-3223-4c79-da23-66f632542c3f.png)
（なくてもOK、今回は付けるよ）
<br>
<br>
**「Start_UI」** を作成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/85a97608-6652-4e73-7856-e931c4c3e24d.png)

こうして

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/9a22feda-fb6d-a1a9-444f-355cdba35e7c.png)

こうする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/8330ae04-05d5-c99b-185d-7a6d9d53563b.png)

## 説明すると
背景が「Image」を置いて「Appearance」から「Brush」→「Image」を選択

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/3fb98dbe-00b8-9465-4499-7eef074af055.png)
（[高画質Ver](https://gyazo.com/718a8b01cf22362aef36b333daeddd08)）
<br>
<br>
こうする

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/34b84800-2ce9-ca1a-39aa-0115a9214bff.png)

「Text」を配置
https://i.gyazo.com/650eaaa09b40a45749e9b5076b629635.mp4

（フォントはお任せで）
https://i.gyazo.com/0df83a2c75f0c516088a5690ef5e6446.mp4
<br>
<br>
<br>
## 音を設定
ボタンを選択して「Sound」と検索（音源は自分ダウンロードしてください、）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/578ddc78-4fcc-940f-870b-d68dfbf948d3.png)
（[UE4はMP3非対応なのでWAVに変換しましょう](https://online-audio-converter.com/ja/)）
<br>
<br>
<br>
## クレジットを作成
ほとんどの人がフリー素材をお借りしてゲームを作っていると思います、
クレジットの表記が必要な素材も有ると思うのでここで作成します。
<br>
先程の **「Start_UI」** を複製して **「Credit_UI」** を作成しましょう。
Award君のイラストを差し替え、Quitのテキストを「Back」にしましょう
<br>
<br>
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/e26fe433-b77f-8058-bd46-95a332fb1677.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/1eeed5c0-8d3f-4a3e-42e5-40ff8e7e3bcc.png)
（ブループリントとか、の最初の方で「On Clicked」の配置方法がわかります
<br>
<br>
<br>
<br>
## ブループリントとか
そしたら、これをこうして（Creditも忘れずに）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/40a6135e-7dda-28a2-c2ee-b6e3e1cba498.png)
こうじゃ（[高画質Ver](https://i.gyazo.com/b5d9fe2d4e33df784fa666d3cc4577e3.png)）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/b2062703-937b-69f2-9869-577ef5ab5fd0.png)
<br>
<br>
レベルブループリントを開き、画像のようにしましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/c188099b-f10c-94ce-c7cf-e849286efe73.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/69641971-fe93-a1a7-4597-354d9b8b55e1.png)
（[高画質Ver](https://i.gyazo.com/65f4f5e376f8d99ef9d8e2dbfcf1896f.png)）
<br>
<br>
ゲームモードを作成、名前を「Start_GameMode」にして
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/70112d67-8022-f30e-eb34-daf64acb2b3f.png)

GameModeを変えましょう
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/66efd8d2-0393-c00e-3791-05f7c40c0f88.png)
<br>
<br>
<br>
## うまくいかないんだけど...
ここを変えましたか？
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2843707/c4cb7e54-8a3c-b814-98d7-6277dd7c07a7.png)
https://i.gyazo.com/99dc94f6c5d396f821c55b4c22942775.mp4
<br>
<br>
## ・最後に
いいねしてね
フォローしてね
「https://twitter.com/MapleSyrup77」
<br>
<br>

## ・宣伝

Noto

https://note.com/ggrks_ue4

Discord鯖　　(気軽に進捗上げてね、デバッグ募集とかもOK！)

http://discord.gg/xBMBWbrRDS

Twitter　(今すぐフォローしやがってくださいませ)
https://twitter.com/MapleSyrup77
<br>
<br>
<br>
## ・参考

https://www.udemy.com/course/unreal-engine-4-award/

53, UI～UIの表示～
54. UI～Start画面の作成～
65. スコア～UI画面の作成～
66. スコア～配列・Loop・AddChild～