1
00:00:04,130 --> 00:00:05,550
‫やあ､ お帰りなさい｡

2
00:00:05,570 --> 00:00:16,250
‫このビデオでは､ プレイヤーが戦車を動かして爆破を開始するまでの待ち時間を知ることができるカウントダウンタイマーを作成します｡

3
00:00:16,250 --> 00:00:22,280
‫そこで､ ゲーム開始までの残り時間をカウントダウンタイマーで表示することにしました｡

4
00:00:22,280 --> 00:00:25,580
‫では､ エディタに飛び込んで､ この作業を始めてみましょう｡

5
00:00:25,850 --> 00:00:34,160
‫Widget BlueprintのBP Start Game Widgetで､ Widget Editorを表示します｡

6
00:00:34,160 --> 00:00:39,560
‫しかし､ 右上に2つのタブがあることにお気づきでしょうか｡ 1つはデザイナーと書かれたものです｡

7
00:00:39,560 --> 00:00:42,890
‫それが今､ グラフと書いてあるものです｡

8
00:00:42,890 --> 00:00:50,570
‫グラフをクリックすると､ イベント ノードのあるブループリント イベント グラフのように見え､ さまざまなセクションがあるマイ ブループリント

9
00:00:50,600 --> 00:00:53,180
‫タブがここに表示されます｡

10
00:00:53,180 --> 00:00:56,120
‫そして､ ここでブループリント・ロジックができるのです｡

11
00:00:56,120 --> 00:00:57,920
‫これで3つのノードが揃いました｡

12
00:00:57,920 --> 00:01:00,080
‫イベントプリコンストラクションがあります｡

13
00:01:00,080 --> 00:01:07,910
‫これはC++のコンストラクタに似ています｡ そして､ begin playに似たイベントコンストラクトがあります｡

14
00:01:07,910 --> 00:01:13,460
‫そこで､ この時点までに関連するクラスがすべて構築され､ さらにイベントチックを行うため､

15
00:01:13,460 --> 00:01:18,500
‫ゲーム開始時に行うのが適切なのです｡

16
00:01:18,500 --> 00:01:24,020
‫そして､ C++のtick関数と同じように､ ここではデルタ時間にアクセスできるようになっています｡

17
00:01:24,020 --> 00:01:30,650
‫さて､ 最初の2つのノードは使わないので､ それらをハイライトして削除し､ イベントテックを使うことにします｡

18
00:01:30,650 --> 00:01:40,100
‫さて､ このビデオのゴールは残り時間を表示することですが､ 現在C++で3秒のカウントダウン・タイマーを作成しています｡

19
00:01:40,100 --> 00:01:45,260
‫タイマーハンドルを作成し､ ワールドタイマーマネージャーを使用してタイマーを開始しました｡

20
00:01:45,260 --> 00:01:49,010
‫このブループリントで行っていることは､ すべてそれとは無関係です｡

21
00:01:49,040 --> 00:01:57,470
‫ここでは全く別のシステムのロジックを作成しており､ C++で設定したタイマーと一致させるだけです｡

22
00:01:57,470 --> 00:02:02,090
‫つまり､ これはすべてC++側とは別の独立したものなのです｡

23
00:02:02,120 --> 00:02:10,850
‫WBのゲーム開始ウィジェットでは､ C++で変数を追加するのと同じように､ ここで変数を追加することができます｡

24
00:02:10,850 --> 00:02:19,340
‫ブループリントの下にあるaddをクリックし､ 変数を選択すると､ new var underscore zeroという変数ができます｡

25
00:02:19,340 --> 00:02:26,870
‫そして､ この下にある詳細パネル（紛らわしいですが､ 左側にあります）には､ 変数名と変数型が表示されています｡

26
00:02:26,870 --> 00:02:33,380
‫デフォルトでハイライトされているのは､ 変数を作成したらすぐに名前を変更することが想定されているからです｡

27
00:02:33,380 --> 00:02:35,690
‫だから､ このデフォルトの名前は必要ないのです｡

28
00:02:35,690 --> 00:02:37,820
‫これを自分たちの名前にするんです｡

29
00:02:37,820 --> 00:02:39,290
‫カウントダウンと名付けます｡

30
00:02:39,290 --> 00:02:47,360
‫そして､ Countdownはfloat変数Yになります｡ これは､ 残り時間を記録するためのものだからです｡

31
00:02:47,360 --> 00:02:55,400
‫3秒からスタートして､ 1フレームごとに前のフレームからの経過時間を引いていきます｡

32
00:02:55,400 --> 00:02:59,750
‫だから､ 3から下に向かってカウントダウンが行われる｡

33
00:02:59,750 --> 00:03:01,880
‫では､ 「コンパイル」をクリックします｡

34
00:03:01,910 --> 00:03:07,820
‫これで､ コンパイルをクリックしたらすぐに､ 詳細でスクロールダウンしてこのデフォルト値を与えることができます｡

35
00:03:07,820 --> 00:03:10,550
‫パネル､ デフォルトでゼロに設定されています｡

36
00:03:10,550 --> 00:03:16,100
‫3秒のカウントダウンがあるので､ デフォルトで3に設定することにします｡

37
00:03:16,100 --> 00:03:22,040
‫今現在の時間は､ 値が3のCountdownというfloatがあるだけです｡

38
00:03:22,040 --> 00:03:32,660
‫実際には変えていませんが､ ゲームの1フレームごとに､ 前のフレームから経過した時間であるデルタタイムを引き算していきたいと思います｡

39
00:03:32,660 --> 00:03:41,120
‫そうすれば､ カウントダウンは常にデルタ時間でデクリメント更新されるので､ 実行時間のカウントができる｡

40
00:03:41,150 --> 00:03:42,980
‫さて､ その方法はこうです｡

41
00:03:42,980 --> 00:03:50,870
‫My Blueprint」タブからカウントダウンを取り出し､ クリックしてイベントグラフにドラッグし､ リリースします｡

42
00:03:50,870 --> 00:03:53,480
‫さて､ 発売と同時に､ 私には2つの選択肢があります｡

43
00:03:53,480 --> 00:03:56,060
‫カウントダウンを取得し､ カウントダウンを設定します｡

44
00:03:56,060 --> 00:04:02,090
‫Get Countdownをクリックすると､ カウントダウンのメモが表示され､ その出力からクリック＆ドラッグすると､

45
00:04:02,120 --> 00:04:05,240
‫Countdownの値にアクセスできるようになります｡

46
00:04:05,240 --> 00:04:12,310
‫カウントダウンをクリックしてドラッグし､ カウントダウンを設定するをクリックすると､ 設定されたノードができます｡

47
00:04:12,320 --> 00:04:13,910
‫この2つは以前にも見たことがあります｡

48
00:04:13,910 --> 00:04:23,210
‫以前の動画では､ セッターの入力端子にfloatの値を入れると､ その値にカウントダウンが設定されるようになっていました｡

49
00:04:23,210 --> 00:04:30,260
‫では､ 実際にCountdownからDelta time awayを引いて､ それをカウントダウンの値に設定するにはどうしたらいいのでしょうか？

50
00:04:30,260 --> 00:04:37,820
‫さて､ ここでカウントダウン・ノードを取り､ クリックしてドラッグし､ キーボードでマイナス記号をタイプして､

51
00:04:37,850 --> 00:04:41,600
‫サブトラクト・ノードを選択します｡

52
00:04:41,600 --> 00:04:47,660
‫これを選択すると､ floatからfloatを引く､ あるいはsubtractノードができます｡

53
00:04:47,660 --> 00:04:50,960
‫Target is Kismet Math Libraryと書いてあるのがわかると思います｡

54
00:04:50,960 --> 00:04:54,800
‫これは､ Kismet Math Libraryがこのノードを支えていることを物語っています｡

55
00:04:54,800 --> 00:04:58,100
‫すべてのノードは､ C++のコードをコアにしています｡

56
00:04:58,310 --> 00:05:01,460
‫このノードが行うことは､ 2つの入力を受け取ることです｡

57
00:05:01,490 --> 00:05:03,500
‫フロート入力を受け持つ｡

58
00:05:03,560 --> 00:05:05,370
‫そして､ 1秒間のフロート入力が必要です｡

59
00:05:05,390 --> 00:05:09,560
‫さて､ このままでは渡している変数が何も変化しない｡

60
00:05:09,590 --> 00:05:16,700
‫単純に計算をして､ 引き算の結果であるその値を返すことになる｡

61
00:05:16,730 --> 00:05:24,140
‫そこで､ イベントティックノードからデルタタイムと呼ばれる出力ピンを取り出し､

62
00:05:24,140 --> 00:05:31,910
‫それをそのまま減算ノードの2番目の入力に接続したいと思います｡

63
00:05:31,970 --> 00:05:38,520
‫つまり､ カウントダウンからデルタタイムを引いて､ その結果を表示しているのです｡

64
00:05:38,540 --> 00:05:43,660
‫現在､ 初期状態ではカウントダウンは3秒で､ デルタタイムは非常に小さな値になっています｡

65
00:05:43,670 --> 00:05:47,900
‫最後のフレームから経過した時間（秒）です｡

66
00:05:47,900 --> 00:05:50,000
‫だから､ これは微々たるものでしょう｡

67
00:05:50,000 --> 00:05:56,490
‫つまり､ これを最初に実行したときの結果は､ 3からほんの少し引いたものになります｡

68
00:05:56,510 --> 00:06:01,880
‫そして､ その結果と同じ値をcountdownの値として､ 毎フレーム設定したいのです｡

69
00:06:01,880 --> 00:06:06,500
‫つまり､ 各フレームのカウントダウンが少しずつ引かれていくわけです｡

70
00:06:06,500 --> 00:06:10,940
‫そうすれば､ 3秒からのカウントダウンを下降させ続けることができます｡

71
00:06:10,940 --> 00:06:18,490
‫そこで､ この減算ノードの戻り結果を､ セットカウントダウン・ノードの入力に差し込むことにします｡

72
00:06:18,500 --> 00:06:25,070
‫さて､ イベント､ ティック実行ピンからカウントダウン設定用入力ピンに実行線を接続しなければ､

73
00:06:25,070 --> 00:06:28,400
‫これは何もしません｡

74
00:06:28,400 --> 00:06:34,070
‫つまり､ これは毎フレーム､ カウントダウンからデルタタイムを引き､ その結果を受け取り､

75
00:06:34,070 --> 00:06:37,850
‫カウントダウンをその新しい値に設定しているのです｡

76
00:06:37,880 --> 00:06:41,000
‫では､ print stringノードでどのような挙動をするか見てみましょう｡

77
00:06:41,000 --> 00:06:47,210
‫そこで､ セッタータイプのprint stringからドラッグして､ print stringノードを取得することにします｡

78
00:06:47,210 --> 00:06:53,390
‫そして､ countdownの値を表示したいので､ セッターからの戻り値を受け取って､ 毎フレームcountdownの新しい値を与え､

79
00:06:53,390 --> 00:06:59,330
‫それをin stringノードに差し込むことができるようにします｡

80
00:06:59,480 --> 00:07:05,750
‫そして､ convert float to stringという項目がありますが､ これをリリースすると､ floatを受け取って文字列に変換し､

81
00:07:05,750 --> 00:07:10,400
‫それを画面にプリントできる変換ノードが得られます｡

82
00:07:10,400 --> 00:07:13,010
‫では､ 再生ボタンを押すとどうなるか見てみましょう｡

83
00:07:13,490 --> 00:07:14,450
‫確認してみてください｡

84
00:07:14,450 --> 00:07:24,590
‫そのカウントがフレームごとに記録されていると見て､ カウントダウンの値を画面にスパッと出しているので､ どんどんマイナスになっていくんです｡

85
00:07:24,590 --> 00:07:29,080
‫これが､ カウントダウンタイマーを動作させるための最初のステップです｡

86
00:07:29,090 --> 00:07:30,800
‫これにて終了とさせていただきます｡

87
00:07:30,800 --> 00:07:34,940
‫小数点以下がたくさんあるfloat値を出力していることがわかりました｡

88
00:07:34,940 --> 00:07:40,400
‫また､ 値を画面に表示する際､ 小数点以下は必要なく､ 整数が必要です｡

89
00:07:40,400 --> 00:07:46,640
‫だから､ 小数点の右側にある末尾の数字を除いた残り秒数を表示したいんです｡

90
00:07:46,640 --> 00:07:48,410
‫そこで､ 必要なのは整数です｡

91
00:07:48,410 --> 00:07:53,930
‫さて､ 私ができることは､ この変換ノードを削除して､ カウントダウン・セッターの結果を受け取り､

92
00:07:53,930 --> 00:08:01,730
‫C E I'll sealと入力することです､ これはsealingの略です｡

93
00:08:01,760 --> 00:08:08,750
‫シーリング演算は､ float 値を取り､ 最も近い整数に切り上げることになります｡

94
00:08:08,750 --> 00:08:12,320
‫だから､ 3つになったら､ まあ､ 丸める必要はないんです｡

95
00:08:12,320 --> 00:08:15,680
‫値3を持つ整数を返すつもりだ｡

96
00:08:15,680 --> 00:08:22,430
‫でも､ もし2. 9とすると､ 例えばシールノードは3つに切り上げることになる｡

97
00:08:22,430 --> 00:08:29,480
‫そして､ その値が減っていくと､ 2つになるまで3を返し続けることになります｡

98
00:08:29,480 --> 00:08:31,970
‫だから､ 常に整数を得ることになる｡

99
00:08:31,970 --> 00:08:37,640
‫これをprint stringに突っ込むと､ Convert integer to stringと表示されるのがわかります｡

100
00:08:37,640 --> 00:08:45,410
‫つまり､ sealノードがfloatを受け取り､ 最も近い整数に切り上げて､ その整数値を返しているのです｡

101
00:08:45,410 --> 00:08:51,530
‫では､ 再生ボタンを押してみると､ 3対1でゼロになることがわかります｡

102
00:08:51,530 --> 00:08:56,660
‫そしてもちろん､ 私たちはこれを実際に止めるように言うことはないので､ 下がり続けています｡

103
00:08:56,660 --> 00:09:02,120
‫しかし､ これで残り秒数にアクセスできるようになり､ それに応じて画面に何かをプリントできるようになったのですから､

104
00:09:02,120 --> 00:09:05,060
‫これは素晴らしいスタートと言えるでしょう｡

105
00:09:05,330 --> 00:09:09,560
‫では､ どうやって正しいメッセージを画面に印刷するのでしょうか？

106
00:09:09,590 --> 00:09:15,050
‫残り3秒になったら､ ウィジェットに「準備しろ」と表示させたいんです｡

107
00:09:15,170 --> 00:09:18,980
‫残り2秒になったら､ 「2」という数字を表示してほしい｡

108
00:09:18,980 --> 00:09:22,130
‫残り1秒になったら､ 1番を表示させたいと思います｡

109
00:09:22,130 --> 00:09:27,140
‫そして､ 残り0秒になったら､ Goというテキストを表示させたいと思います｡

110
00:09:27,140 --> 00:09:35,360
‫まあ､ これはスイッチ・ノードでできるのですが､ スイッチ・ノードはINTをはじめ､ さまざまな種類のスイッチを入れることができます｡

111
00:09:35,390 --> 00:09:41,840
‫さて､ int型ノードのスイッチの仕組みは､ いくつかの値に対していくつかのケースがあります｡

112
00:09:41,840 --> 00:09:47,510
‫そして､ このスイッチノードに渡された値に基づいて､ いくつかの処理のうちの1つが行われます｡

113
00:09:47,540 --> 00:09:56,600
‫例えば､ 整数値であるthreeを渡すと､ three caseとなり､ threeが実行されることになる｡

114
00:09:56,600 --> 00:10:03,230
‫つまり､ エンドノードのスイッチには複数の実行ラインがあり､ それに基づいて1つだけ実行されるのです｡

115
00:10:03,320 --> 00:10:04,250
‫入力のことです｡

116
00:10:04,280 --> 00:10:12,200
‫ここで､ intノードのスイッチを使い､ sealノードの結果などの整数を渡すことができます｡

117
00:10:12,320 --> 00:10:18,410
‫そこで､ 印刷文字列を削除して､ カウントダウン・ノードからドラッグして､ switch on INTとタイプして､

118
00:10:18,410 --> 00:10:21,980
‫switch on intを選択します｡

119
00:10:22,010 --> 00:10:25,360
‫ここで､ 入力は整数型であることに注意してください｡

120
00:10:25,370 --> 00:10:31,880
‫sealノードの戻り値を渡すと同時に､ add pinオプションがあることに気づきます｡

121
00:10:31,880 --> 00:10:39,470
‫これをクリックすると､ ゼロという出力に加え､ デフォルトのピンが表示されるのがわかると思います｡

122
00:10:39,650 --> 00:10:48,500
‫これは､ ゼロ実行ピンからブループリントのロジックをフックすると､ そのロジックが実行されることを意味します｡

123
00:10:48,530 --> 00:10:56,170
‫渡された入力値が0であり､ うまくいかなければ､ この実行ピンがデフォルトになります｡

124
00:10:56,180 --> 00:11:00,470
‫ここでもう一度ピンの追加をクリックすると､ 今度は0と1ができます｡

125
00:11:00,470 --> 00:11:05,150
‫つまり､ ゼロと1の2つの実行ラインを用意すればいいわけです｡

126
00:11:05,150 --> 00:11:11,760
‫そして､ 入力が0か1でなければ､ デフォルトにフックされているものが実行されます｡

127
00:11:11,780 --> 00:11:14,930
‫あと2回､ プラスをクリックします｡

128
00:11:14,930 --> 00:11:19,370
‫そこで､ 0から3までのケースと､ デフォルトのケースを用意しました｡

129
00:11:19,370 --> 00:11:26,540
‫次に､ これをドラッグして､ SEAL ノードから渡された値に基づいて実行するブループリント

130
00:11:26,540 --> 00:11:30,680
‫ロジックを追加します｡

131
00:11:31,220 --> 00:11:34,240
‫そして､ それがあなたのチャレンジしてほしいことなのです｡

132
00:11:34,250 --> 00:11:44,720
‫それぞれのケースについて､ print stringノードを使って異なるメッセージを表示してほしい｡

133
00:11:44,750 --> 00:11:50,420
‫2の場合は単純に2を表示し､ 1の場合は1を表示し､

134
00:11:50,420 --> 00:11:58,040
‫0の場合はgoを表示します｡

135
00:11:58,040 --> 00:12:03,320
‫ビデオを一時停止して､ 今イベントグラフに印刷文字列のノードをたくさん追加してください｡

136
00:12:07,230 --> 00:12:07,740
‫なるほど｡

137
00:12:07,740 --> 00:12:13,590
‫そこで､ print stringノードを使いたいと思います｡ デフォルトのケースとして､ この下の方からprint

138
00:12:13,590 --> 00:12:16,920
‫stringと入力します｡

139
00:12:17,820 --> 00:12:21,030
‫そして､ 表示したい文字列は､ start gameです｡

140
00:12:21,180 --> 00:12:22,440
‫さて､ ここでショートカットを紹介します｡

141
00:12:22,440 --> 00:12:28,020
‫プリントストリングノードを選択した状態で､ イベントグラフ内の他の場所にマウスカーソルを置いてコントロールDXを押すと､

142
00:12:28,020 --> 00:12:33,720
‫選択したノードがコピーされることをご存知でしたか？

143
00:12:33,720 --> 00:12:40,050
‫このprint stringノードに3つのケースをフックして､ get readyと入力します｡

144
00:12:40,200 --> 00:12:43,200
‫だから､ スイッチへの入力が3つになったときに

145
00:12:43,200 --> 00:12:45,300
‫スクリーンに印刷された､ 準備をする｡

146
00:12:45,300 --> 00:12:52,260
‫さて､ もう一度DXを制御して､ これを2のケースにフックして､

147
00:12:52,260 --> 00:12:58,050
‫2については単純に2をプリントすることにします｡

148
00:12:58,050 --> 00:13:06,060
‫最後に､ このプリントストリングノードはゼロケースに接続され､ これはgoと表示されます｡

149
00:13:07,110 --> 00:13:07,590
‫なるほど｡

150
00:13:07,590 --> 00:13:14,940
‫では､ これをコンパイルして､ 再生ボタンを押すと､ get ready, two, one and goと表示されます｡

151
00:13:14,940 --> 00:13:18,660
‫そしてもちろん､ 時間がなくなったらゲームを開始するのも見ています｡

152
00:13:18,660 --> 00:13:24,900
‫ですから､ 値がどんどん減ってマイナスになることは分かっているのですが､ それがスイッチのデフォルトのケースであり､

153
00:13:24,900 --> 00:13:29,220
‫実際にゲームを開始できるのはその時だと分かっているのです｡

154
00:13:29,220 --> 00:13:34,020
‫これが､ ウィジェットにカウントダウン・タイマーを表示するための最初のステップです｡

155
00:13:34,050 --> 00:13:40,080
‫まだGet readyと書かれたテキストを変えるまでには至っていませんが､ 近日中に行います｡

156
00:13:40,320 --> 00:13:45,210
‫そこで､ このビデオでは､ カウントダウン・ロジックを作成し､ それをウィジェット設計図に追加しました｡

157
00:13:45,240 --> 00:13:50,160
‫print string を使って､ カウントダウンの値を表示し､ 別のメッセージを表示するようにしました｡

158
00:13:50,160 --> 00:13:52,110
‫当社のカウントダウン値に基づいています｡

159
00:13:52,110 --> 00:13:56,640
‫ウィジェットにテキストを設定する必要がありますが､ 次のビデオでそれを行います｡

160
00:13:57,000 --> 00:13:57,990
‫また､ お会いしましょう｡