﻿1
00:00:04,130 --> 00:00:05,550
‫Oye, bienvenido de nuevo.

2
00:00:05,570 --> 00:00:10,940
‫En este video, vamos a crear un temporizador de cuenta regresiva para que el jugador sepa cuánto

3
00:00:10,940 --> 00:00:16,250
‫tiempo tiene que esperar antes de que pueda comenzar a mover su tanque y explotar cosas.

4
00:00:16,250 --> 00:00:22,280
‫Así que vamos a mostrar el tiempo que queda en el temporizador de cuenta regresiva hasta que comience el juego.

5
00:00:22,280 --> 00:00:25,580
‫Así que saltemos al editor y comencemos a hacer esto.

6
00:00:25,850 --> 00:00:33,620
‫Ahora estoy aquí en nuestro Widget Blueprint, BP Start Game Widget, y este es el editor de widgets que hemos

7
00:00:33,620 --> 00:00:34,160
‫visto.

8
00:00:34,160 --> 00:00:39,560
‫Pero es posible que haya notado que en la parte superior derecha hay dos pestañas aquí, una que dice diseñador.

9
00:00:39,560 --> 00:00:42,890
‫Eso es en lo que estamos ahora y uno que dice gráfico.

10
00:00:42,890 --> 00:00:50,570
‫Y si hace clic en el gráfico, se parece más a un gráfico de eventos de modelo con nodos de eventos y una pestaña

11
00:00:50,600 --> 00:00:53,180
‫de mi modelo aquí con varias secciones.

12
00:00:53,180 --> 00:00:56,120
‫Y aquí es donde podemos hacer una lógica de planos.

13
00:00:56,120 --> 00:00:57,920
‫Ahora tenemos tres nodos aquí.

14
00:00:57,920 --> 00:01:00,080
‫Tenemos preconstrucción de eventos.

15
00:01:00,080 --> 00:01:07,910
‫Esto es similar a un constructor en C++ y luego tenemos una construcción de eventos que es similar a comenzar a jugar.

16
00:01:07,910 --> 00:01:13,460
‫Así que aquí es donde es más apropiado hacer las cosas al comienzo del juego porque todas

17
00:01:13,460 --> 00:01:18,500
‫las clases relevantes se construyen en este punto y luego tenemos el evento marcado.

18
00:01:18,500 --> 00:01:24,020
‫Y al igual que la función tick en C++, aquí tenemos acceso a la hora Delta.

19
00:01:24,020 --> 00:01:28,670
‫Ahora no vamos a usar los dos primeros nodos, así que los resaltaré y los eliminaré

20
00:01:28,670 --> 00:01:30,650
‫y usaremos la tecnología de eventos.

21
00:01:30,650 --> 00:01:37,670
‫Ahora, nuestro objetivo para este video es mostrar cuánto tiempo queda y ahora tenemos un temporizador de cuenta

22
00:01:37,670 --> 00:01:40,100
‫regresiva de tres segundos en C++.

23
00:01:40,100 --> 00:01:45,260
‫Creamos un controlador de temporizador y usamos el administrador de temporizador mundial para iniciar un temporizador.

24
00:01:45,260 --> 00:01:49,010
‫Todo lo que hacemos aquí en planos es independiente de eso.

25
00:01:49,040 --> 00:01:55,790
‫Estamos creando un sistema de lógica completamente diferente aquí, y simplemente coincidirá con el temporizador que

26
00:01:55,790 --> 00:01:57,470
‫configuramos en C++.

27
00:01:57,470 --> 00:02:02,090
‫Así que todo esto es diferente e independiente del lado de C++.

28
00:02:02,120 --> 00:02:10,460
‫Ahora, aquí en el widget de juego de inicio de WB, podemos agregar variables al igual que podemos agregar variables en C++ aquí

29
00:02:10,460 --> 00:02:10,850
‫mismo.

30
00:02:10,850 --> 00:02:18,380
‫Debajo de mi plano, puedo hacer clic en agregar y seleccionar la variable y ahora tengo una variable llamada new var

31
00:02:18,410 --> 00:02:19,340
‫underscore zero.

32
00:02:19,340 --> 00:02:25,250
‫Y aquí abajo, en el panel de detalles, que es confuso en el lado izquierdo, ahora tenemos el nombre de la variable

33
00:02:25,250 --> 00:02:26,870
‫y el tipo de variable.

34
00:02:26,870 --> 00:02:32,240
‫Ahora está resaltado de forma predeterminada porque se espera que cambie el nombre de sus variables tan pronto

35
00:02:32,240 --> 00:02:33,380
‫como las cree.

36
00:02:33,380 --> 00:02:35,690
‫Así que no necesitamos este nombre predeterminado.

37
00:02:35,690 --> 00:02:37,820
‫Vamos a llamar a esto nuestro propio nombre.

38
00:02:37,820 --> 00:02:39,290
‫Voy a llamarlo Cuenta regresiva.

39
00:02:39,290 --> 00:02:46,160
‫Y Countdown será una variable flotante Y porque hará un seguimiento de cuánto tiempo

40
00:02:46,160 --> 00:02:47,360
‫nos queda.

41
00:02:47,360 --> 00:02:53,450
‫Voy a comenzar con 3 segundos y en cada cuadro voy a restar la cantidad de tiempo que

42
00:02:53,450 --> 00:02:55,400
‫pasó desde el cuadro anterior.

43
00:02:55,400 --> 00:02:59,750
‫Entonces tenemos una cuenta regresiva que va de tres hacia abajo.

44
00:02:59,750 --> 00:03:01,880
‫Ahora voy a hacer clic en Compilar.

45
00:03:01,910 --> 00:03:07,820
‫Ahora, tan pronto como haga clic en compilar, puedo darle un valor predeterminado desplazándome hacia abajo en los detalles.

46
00:03:07,820 --> 00:03:10,550
‫Panel, está configurado en cero de forma predeterminada.

47
00:03:10,550 --> 00:03:16,100
‫Voy a configurarlo en tres de forma predeterminada ya que tenemos una cuenta regresiva de tres segundos.

48
00:03:16,100 --> 00:03:22,040
‫El tiempo ahora tal como está, esto es solo un flotador llamado Countdown con un valor de tres.

49
00:03:22,040 --> 00:03:28,490
‫En realidad no lo hemos cambiado, pero en cada cuadro del juego, me gustaría restar el tiempo Delta, que

50
00:03:28,490 --> 00:03:32,660
‫es la cantidad de tiempo que ha pasado desde el cuadro anterior.

51
00:03:32,660 --> 00:03:39,980
‫Y de esa manera, Countdown actualizará constantemente el decremento por tiempo Delta para que tengamos un conteo de tiempo

52
00:03:40,010 --> 00:03:41,120
‫de ejecución.

53
00:03:41,150 --> 00:03:42,980
‫Ahora, así es como podemos hacer eso.

54
00:03:42,980 --> 00:03:50,030
‫Tomaré una cuenta regresiva de nuestra pestaña Mi Blueprint, haré clic y la arrastraré aquí al gráfico de eventos y

55
00:03:50,030 --> 00:03:50,870
‫la soltaré.

56
00:03:50,870 --> 00:03:53,480
‫Ahora, en cuanto lo libere, tengo dos opciones.

57
00:03:53,480 --> 00:03:56,060
‫Obtenga la cuenta regresiva y configure la cuenta regresiva.

58
00:03:56,060 --> 00:04:02,090
‫Si hago clic en Obtener cuenta regresiva, ahora tengo la nota de cuenta regresiva y si hago clic y arrastro fuera de

59
00:04:02,120 --> 00:04:05,240
‫su salida, esto me da acceso al valor de Cuenta regresiva.

60
00:04:05,240 --> 00:04:12,310
‫Ahora también puedo hacer clic en Cuenta regresiva, arrastrar y hacer clic en Establecer cuenta regresiva y tenemos un nodo establecido.

61
00:04:12,320 --> 00:04:13,910
‫Hemos visto estos dos antes.

62
00:04:13,910 --> 00:04:21,230
‫En videos anteriores, el pin de entrada para el colocador nos permite conectar un valor flotante y luego la cuenta regresiva

63
00:04:21,230 --> 00:04:23,210
‫se establecerá en ese valor.

64
00:04:23,210 --> 00:04:30,260
‫Entonces, ¿cómo restamos el tiempo Delta de Countdown y luego lo establecemos en el valor de cuenta regresiva?

65
00:04:30,260 --> 00:04:37,820
‫Bueno, podemos tomar nuestro nodo de cuenta regresiva aquí y puedo hacer clic y arrastrarlo y escribir el símbolo

66
00:04:37,850 --> 00:04:41,600
‫menos en mi teclado y elegir el nodo Restar.

67
00:04:41,600 --> 00:04:47,660
‫Si selecciono eso, ahora tengo un nodo flotante menos flotante o un nodo de resta.

68
00:04:47,660 --> 00:04:50,960
‫Verá que dice Target is Kismet Math Library.

69
00:04:50,960 --> 00:04:54,800
‫Eso le dice que Kismet Math Library sustenta este nodo.

70
00:04:54,800 --> 00:04:58,100
‫Todos los nodos tienen código C++ en su núcleo.

71
00:04:58,310 --> 00:05:01,460
‫Entonces, lo que hace este nodo es tomar dos entradas.

72
00:05:01,490 --> 00:05:03,500
‫Se necesita una entrada flotante.

73
00:05:03,560 --> 00:05:05,370
‫Y se necesita una segunda entrada flotante.

74
00:05:05,390 --> 00:05:09,560
‫Ahora, no va a cambiar ninguna de las variables que estamos pasando.

75
00:05:09,590 --> 00:05:16,700
‫Simplemente realizará un cálculo y devolverá ese valor que es el resultado de la resta.

76
00:05:16,730 --> 00:05:24,140
‫Ahora me gustaría tomar la cuenta regresiva y restarle el tiempo Delta para poder tomar el pin de salida llamado en

77
00:05:24,140 --> 00:05:31,340
‫el tiempo Delta del nodo de marca de evento y conectarlo directamente a la segunda entrada en mi nodo de

78
00:05:31,340 --> 00:05:31,910
‫resta.

79
00:05:31,970 --> 00:05:38,520
‫Así que lo que estoy haciendo es tomar la cuenta regresiva menos el tiempo delta y luego obtengo el resultado.

80
00:05:38,540 --> 00:05:43,660
‫Ahora, inicialmente, la cuenta regresiva es de 3 segundos y el tiempo delta es un valor muy pequeño.

81
00:05:43,670 --> 00:05:47,900
‫Es la cantidad de tiempo en segundos que ha pasado desde el último cuadro.

82
00:05:47,900 --> 00:05:50,000
‫Así que esto sería una pequeña cantidad.

83
00:05:50,000 --> 00:05:56,490
‫Entonces, lo que resultará la primera vez que se ejecute esto es tres menos una pequeña cantidad.

84
00:05:56,510 --> 00:06:01,880
‫Y lo que me gustaría hacer es establecer el valor de la cuenta regresiva igual a ese resultado, cada fotograma.

85
00:06:01,880 --> 00:06:06,500
‫Así que cada cuadro de cuenta regresiva se va restando poco a poco.

86
00:06:06,500 --> 00:06:10,940
‫Y de esa manera mantendrá la cuenta regresiva de 3 segundos hacia abajo.

87
00:06:10,940 --> 00:06:16,820
‫Así que tomaré el resultado de retorno de este nodo de resta y lo conectaré a la entrada para el

88
00:06:16,820 --> 00:06:18,490
‫nodo de cuenta regresiva establecido.

89
00:06:18,500 --> 00:06:25,070
‫Ahora, esto no va a hacer nada si no conecto el cable de ejecución del evento, marque el pin de ejecución

90
00:06:25,070 --> 00:06:28,400
‫con el pin de entrada para configurar la cuenta regresiva.

91
00:06:28,400 --> 00:06:34,070
‫Así que ahora lo que esto está haciendo es que cada fotograma reste el tiempo Delta de la cuenta regresiva,

92
00:06:34,070 --> 00:06:37,850
‫tomando ese resultado y configurando la cuenta regresiva a ese nuevo valor.

93
00:06:37,880 --> 00:06:41,000
‫Ahora podemos ver cómo se comporta esto con un nodo de cadena de impresión.

94
00:06:41,000 --> 00:06:47,210
‫Así que voy a arrastrar fuera de la cadena de impresión de tipo setter y obtener un nodo de cadena de impresión.

95
00:06:47,210 --> 00:06:53,390
‫Y luego me gustaría imprimir el valor de la cuenta regresiva para poder tomar el valor de retorno del setter, que nos

96
00:06:53,390 --> 00:06:59,330
‫dará el nuevo valor de la cuenta regresiva de cada cuadro y lo conectará al nodo de cadena de entrada.

97
00:06:59,480 --> 00:07:05,750
‫Y fíjate que veo convertir un flotante en una cadena y si lo suelto ahora obtengo un nodo de conversión que

98
00:07:05,750 --> 00:07:10,400
‫tomará mi flotante, lo convertirá en una cadena, y ahora podemos imprimirlo en la pantalla.

99
00:07:10,400 --> 00:07:13,010
‫Ahora veamos qué pasa si le doy al play.

100
00:07:13,490 --> 00:07:14,450
‫Mira eso.

101
00:07:14,450 --> 00:07:22,250
‫Vemos que el conteo está documentado en cada cuadro y estamos llenando la pantalla con el valor de la cuenta regresiva y

102
00:07:22,250 --> 00:07:24,590
‫se vuelve cada vez más negativo.

103
00:07:24,590 --> 00:07:29,080
‫Así que este es el primer paso para que nuestro temporizador de cuenta regresiva funcione.

104
00:07:29,090 --> 00:07:30,800
‫Voy a cerrar esto ahora.

105
00:07:30,800 --> 00:07:34,940
‫Vimos que estamos imprimiendo un valor flotante que tiene un montón de puntos decimales.

106
00:07:34,940 --> 00:07:40,400
‫Y una vez que imprimimos el valor en la pantalla, realmente no queremos puntos decimales, nos gustaría un número entero.

107
00:07:40,400 --> 00:07:46,100
‫Así que me gustaría ver la cantidad de segundos que quedan sin esos dígitos finales a la derecha del punto

108
00:07:46,100 --> 00:07:46,640
‫decimal.

109
00:07:46,640 --> 00:07:48,410
‫Así que lo que necesito es un número entero.

110
00:07:48,410 --> 00:07:53,930
‫Bueno, lo que puedo hacer es eliminar este nodo de conversión y tomar

111
00:07:53,930 --> 00:08:01,730
‫el resultado del configurador de cuenta regresiva y escribir C E I'll seal, que es la abreviatura de seal.

112
00:08:01,760 --> 00:08:08,750
‫La operación de sellado tomará un valor flotante y lo redondeará al entero más cercano.

113
00:08:08,750 --> 00:08:12,320
‫Entonces, si estamos en tres, bueno, no hay necesidad de redondear.

114
00:08:12,320 --> 00:08:15,680
‫Va a devolver un número entero con un valor de tres.

115
00:08:15,680 --> 00:08:22,430
‫Pero si estamos en 2. 9, por ejemplo, entonces el nodo del sello lo redondeará a tres.

116
00:08:22,430 --> 00:08:29,480
‫Y a medida que ese valor disminuya, continuará devolviendo tres hasta que bajemos a dos.

117
00:08:29,480 --> 00:08:31,970
‫Así que siempre vamos a obtener un número entero.

118
00:08:31,970 --> 00:08:37,640
‫Ahora puedo conectar esto en la cadena de impresión y verá que dice Convertir entero en cadena.

119
00:08:37,640 --> 00:08:44,720
‫Así que ahora el nodo del sello está tomando un valor flotante, redondeándolo al entero más cercano y devolviendo ese valor

120
00:08:44,720 --> 00:08:45,410
‫entero.

121
00:08:45,410 --> 00:08:51,530
‫Así que ahora si le doy al play, veremos que nos sale 3 a 1 y cero.

122
00:08:51,530 --> 00:08:56,660
‫Y, por supuesto, continúa bajando porque nunca le decimos que se detenga.

123
00:08:56,660 --> 00:09:02,120
‫Pero este es un gran comienzo porque ahora tenemos acceso a la cantidad de segundos restantes y

124
00:09:02,120 --> 00:09:05,060
‫podemos imprimir algo en la pantalla como respuesta.

125
00:09:05,330 --> 00:09:09,560
‫Entonces, ¿cómo vamos a imprimir el mensaje correcto en la pantalla?

126
00:09:09,590 --> 00:09:15,050
‫Lo que me gustaría hacer es cuando nos queden 3 segundos, me gustaría que el widget diga: Prepárate.

127
00:09:15,170 --> 00:09:18,980
‫Cuando nos queden 2 segundos, me gustaría que mostraras el número dos.

128
00:09:18,980 --> 00:09:22,130
‫Cuando nos quede un segundo, me gustaría mostrar el número uno.

129
00:09:22,130 --> 00:09:27,140
‫Y cuando nos queden 0 segundos, me gustaría que el texto diga Ir.

130
00:09:27,140 --> 00:09:34,910
‫Bueno, podemos hacer esto con un nodo de conmutación. Los nodos de conmutación pueden activar varios tipos diferentes, incluido

131
00:09:34,910 --> 00:09:35,360
‫INT.

132
00:09:35,390 --> 00:09:41,840
‫Ahora, la forma en que funciona un nodo switch on int es que tiene una cantidad de casos para una cantidad de valores.

133
00:09:41,840 --> 00:09:47,510
‫Y según el valor que pasemos a este nodo de conmutación, hará una de varias cosas.

134
00:09:47,540 --> 00:09:54,410
‫Por ejemplo, si pasamos el valor entero tres, obtenemos el caso tres, lo que dará como resultado que se

135
00:09:54,410 --> 00:09:56,600
‫lleve a cabo la cosa tres.

136
00:09:56,600 --> 00:10:03,230
‫Por lo tanto, el nodo final del interruptor tiene varias líneas de ejecución y solo ejecutará una de ellas en función de.

137
00:10:03,320 --> 00:10:04,250
‫la entrada

138
00:10:04,280 --> 00:10:12,200
‫Ahora podemos usar un interruptor en el nodo int y pasar un número entero, por ejemplo, el resultado de nuestro nodo de sello.

139
00:10:12,320 --> 00:10:18,410
‫Así que voy a eliminar la cadena de impresión y voy a arrastrar fuera del nodo de cuenta regresiva

140
00:10:18,410 --> 00:10:21,980
‫y escribir switch on INT y seleccionar switch on int.

141
00:10:22,010 --> 00:10:25,360
‫Ahora observe que toma una entrada de tipo entero.

142
00:10:25,370 --> 00:10:31,880
‫Voy a pasar el valor de retorno del nodo del sello y también notaré que tenemos una opción de agregar pin.

143
00:10:31,880 --> 00:10:39,470
‫Si hacemos clic en eso, verá que obtenemos un pin predeterminado además de la salida que dice cero.

144
00:10:39,650 --> 00:10:47,300
‫Lo que esto dice es que si conectamos alguna lógica de modelo del pin de ejecución cero, entonces esa lógica

145
00:10:47,300 --> 00:10:48,500
‫se ejecutará.

146
00:10:48,530 --> 00:10:55,730
‫Si el valor de entrada pasado es cero, y si no está bien, se establecerá de forma predeterminada en este pin de

147
00:10:55,730 --> 00:10:56,170
‫ejecución.

148
00:10:56,180 --> 00:11:00,470
‫Ahora podemos hacer clic en agregar pin nuevamente y ahora tenemos cero y uno.

149
00:11:00,470 --> 00:11:05,150
‫Entonces podemos tener dos líneas de ejecución, una para cero y otra para uno.

150
00:11:05,150 --> 00:11:11,760
‫Y luego, si la entrada no es cero o uno, entonces se ejecutará lo que esté conectado por defecto.

151
00:11:11,780 --> 00:11:14,930
‫Voy a hacer clic en el signo más dos veces más.

152
00:11:14,930 --> 00:11:19,370
‫Así que tenemos los casos del cero al tres y un caso por defecto.

153
00:11:19,370 --> 00:11:26,540
‫Así que ahora depende de nosotros arrastrar esto y agregar algo de lógica de modelo que nos gustaría ejecutar en

154
00:11:26,540 --> 00:11:30,680
‫función del valor pasado que estamos obteniendo de este nodo SEAL.

155
00:11:31,220 --> 00:11:34,240
‫Y eso es lo que me gustaría que hicieras para tu desafío.

156
00:11:34,250 --> 00:11:41,240
‫Me gustaría que imprimiera diferentes mensajes para cada caso usando un nodo de cadena de impresión para el valor tres que

157
00:11:41,240 --> 00:11:44,720
‫puede imprimir prepárese usando un nodo de cadena de impresión.

158
00:11:44,750 --> 00:11:50,420
‫Para el caso dos, simplemente puede imprimir el valor dos para el caso uno, puede imprimir uno y

159
00:11:50,420 --> 00:11:57,470
‫para el caso cero puede imprimir ahora para el caso predeterminado, simplemente imprima el juego de inicio con nuestro nodo de cadena de

160
00:11:57,470 --> 00:11:58,040
‫impresión.

161
00:11:58,040 --> 00:12:03,320
‫Pause el video y agregue un montón de nodos de cadena de impresión en el gráfico de eventos ahora.

162
00:12:07,230 --> 00:12:07,740
‫Bueno.

163
00:12:07,740 --> 00:12:13,590
‫Así que me gustaría seguir adelante y usar un nodo de cadena de impresión y voy a comenzar aquí en la parte

164
00:12:13,590 --> 00:12:16,920
‫inferior para el caso predeterminado y voy a escribir cadena de impresión.

165
00:12:17,820 --> 00:12:21,030
‫Y la cadena que me gustaría imprimir es iniciar el juego.

166
00:12:21,180 --> 00:12:22,440
‫Ahora, aquí hay un atajo.

167
00:12:22,440 --> 00:12:28,020
‫Si no lo sabía con el nodo de cadena de impresión seleccionado, puedo pasar el mouse por otro

168
00:12:28,020 --> 00:12:33,720
‫lugar en el gráfico de eventos y presionar el control dx y eso copiará el nodo que había seleccionado.

169
00:12:33,720 --> 00:12:40,050
‫Voy a conectar el caso de tres a este nodo de cadena de impresión y voy a escribir prepárate.

170
00:12:40,200 --> 00:12:43,200
‫Entonces, cuando la entrada al interruptor sea tres, veremos.

171
00:12:43,200 --> 00:12:45,300
‫Prepárate, impreso en la pantalla.

172
00:12:45,300 --> 00:12:52,260
‫Ahora voy a controlar DX nuevamente y conectar esto a los dos casos y para dos simplemente voy a imprimir dos ahora

173
00:12:52,260 --> 00:12:58,050
‫voy a copiar el nodo de cadena de impresión y para uno, voy a imprimir el valor uno.

174
00:12:58,050 --> 00:13:04,470
‫Y, por último, un último nodo de cadena de impresión aquí se conectará al caso cero y

175
00:13:04,470 --> 00:13:06,060
‫este dirá "vamos".

176
00:13:07,110 --> 00:13:07,590
‫Bueno.

177
00:13:07,590 --> 00:13:13,980
‫Así que sigamos y compilemos esto y voy a presionar reproducir y ahora veo prepárate, dos, uno

178
00:13:13,980 --> 00:13:14,940
‫y listo.

179
00:13:14,940 --> 00:13:18,660
‫Y luego, por supuesto, vemos el inicio del juego una vez que se nos acaba el tiempo.

180
00:13:18,660 --> 00:13:24,900
‫Entonces, sabemos que el valor está disminuyendo y se vuelve cada vez más negativo, pero ese es el caso predeterminado para

181
00:13:24,900 --> 00:13:29,220
‫nuestro interruptor y ahí es cuando sabemos que realmente podemos comenzar el juego.

182
00:13:29,220 --> 00:13:34,020
‫Así que este es el primer paso para mostrar nuestro temporizador de cuenta regresiva en nuestro widget.

183
00:13:34,050 --> 00:13:40,080
‫Todavía no vamos a cambiar el texto que dice Prepárate, pero lo haremos pronto.

184
00:13:40,320 --> 00:13:45,210
‫Entonces, en este video, creamos Countdown Logic y lo agregamos a nuestro modelo de widget.

185
00:13:45,240 --> 00:13:50,160
‫Usamos una cadena de impresión para mostrar nuestros valores de cuenta regresiva e imprimir un mensaje diferente.

186
00:13:50,160 --> 00:13:52,110
‫Basado en nuestros valores de cuenta regresiva.

187
00:13:52,110 --> 00:13:56,640
‫Todavía tenemos que configurar el texto en el widget, y lo haremos en el próximo video.

188
00:13:57,000 --> 00:13:57,990
‫Te veré pronto.

