1
00:00:00,000 --> 00:00:03,330
Bienvenidos de nuevo a mis compañeros desarrolladores de juegos

2
00:00:03,330 --> 00:00:04,740
a un video totalmente nuevo. 

3
00:00:04,740 --> 00:00:06,690
Y este, te darás cuenta de que
tenemos

4
00:00:06,690 --> 00:00:09,000
el desvanecimiento dentro y fuera. 

5
00:00:09,000 --> 00:00:11,070
¿ Y para qué es eso? 

6
00:00:11,070 --> 00:00:12,480
Bueno, si miramos justo aquí,

7
00:00:12,480 --> 00:00:15,210
tenemos una enorme caja negra. 

8
00:00:15,210 --> 00:00:17,100
Y se puede ver eso ahora mismo. 

9
00:00:17,100 --> 00:00:19,290
No vemos nada en el juego. 

10
00:00:19,290 --> 00:00:20,190
¿ Por qué es eso? 

11
00:00:20,190 --> 00:00:20,880
¿ Qué pasó? 

12
00:00:20,880 --> 00:00:21,960
¿ Que dejaríamos el juego? 

13
00:00:21,960 --> 00:00:23,460
¿ Por qué es tan pequeño ahora mismo? 

14
00:00:23,460 --> 00:00:24,710
¿ Por qué estamos alejados? 

15
00:00:24,705 --> 00:00:27,215
Tantas preguntas, tan pocas respuestas. 

16
00:00:27,210 --> 00:00:28,380
Si ejecuto el juego,

17
00:00:28,380 --> 00:00:30,630
notarás que empezamos del nivel
al

18
00:00:30,630 --> 00:00:33,010
desvanecernos de la imagen negra. 

19
00:00:33,010 --> 00:00:34,660
Y si caminamos por ahí,

20
00:00:34,655 --> 00:00:36,895
se
puede ver que en cuanto entramos al portal,

21
00:00:36,890 --> 00:00:38,470
no sólo disminuimos la velocidad,

22
00:00:38,465 --> 00:00:39,995
sino que nos desvanecemos,

23
00:00:39,995 --> 00:00:43,615
y luego volvemos a desvanecernos cuando vamos al siguiente nivel. 

24
00:00:43,610 --> 00:00:44,930
Entonces, no perdamos

25
00:00:44,930 --> 00:00:48,770
más tiempo y lleguemos a fallar. 

26
00:00:48,770 --> 00:00:50,560
Ah, está bien. 

27
00:00:50,555 --> 00:00:52,225
Por lo que ahora estamos

28
00:00:52,220 --> 00:00:55,220
transitando
adecuadamente de un nivel a otro. 

29
00:00:55,220 --> 00:00:58,040
Tenemos el efecto de escala temporal

30
00:00:58,040 --> 00:00:59,680
donde ralentizamos todo. 

31
00:00:59,675 --> 00:01:02,095
Lo siguiente que queremos hacer es que queremos

32
00:01:02,090 --> 00:01:04,580
tener algún tipo de efecto de desvanecimiento. 

33
00:01:04,580 --> 00:01:06,380
Entonces lo que queremos es B1,

34
00:01:06,380 --> 00:01:10,070
la imagen o todo el juego para desvanecerse a negro. 

35
00:01:10,070 --> 00:01:12,050
Y luego cuando entramos a un nuevo nivel,

36
00:01:12,050 --> 00:01:13,790
queremos desvanecernos. 

37
00:01:13,790 --> 00:01:16,160
Entonces vamos a hacer eso. 

38
00:01:16,160 --> 00:01:18,010
Lo primero que tenemos que hacer,

39
00:01:18,005 --> 00:01:20,695
o ¿cómo funciona el saliente de desvanecimiento? 

40
00:01:20,690 --> 00:01:24,380
Tendremos aquí una gran imagen negra que se
desvanecerá

41
00:01:24,380 --> 00:01:27,920
y luego se desvanecerá a medida que pasemos de nivel a otro. 

42
00:01:27,920 --> 00:01:29,930
Entonces todo se trata de una imagen negra

43
00:01:29,930 --> 00:01:32,500
y usamos el alfa en ella. 

44
00:01:32,495 --> 00:01:34,415
Entonces hagámoslo. 

45
00:01:34,415 --> 00:01:38,785
¿ Cómo vamos a añadir una imagen en Unity? 

46
00:01:38,780 --> 00:01:41,600
Bueno, necesitamos algo llamado lienzo. 

47
00:01:41,600 --> 00:01:43,730
Entonces voy a crear un lienzo. 

48
00:01:43,730 --> 00:01:45,800
Voy a hacer clic derecho en la jerarquía,

49
00:01:45,800 --> 00:01:48,950
ir a tu ojo y encontrar el campus. 

50
00:01:48,950 --> 00:01:51,170
Ahí vas. Ahora tenemos un campus. 

51
00:01:51,170 --> 00:01:52,720
Si hago doble clic en él,

52
00:01:52,715 --> 00:01:55,145
ahí tienes, puedes ver que es un lienzo enorme,

53
00:01:55,145 --> 00:01:57,425
grande y quizá te estés preguntando,

54
00:01:57,425 --> 00:02:01,955
¿por qué es tan grande el lienzo mientras que nuestro juego es tan pequeño? 

55
00:02:01,955 --> 00:02:03,835
Bueno, esta es la forma en que Unity

56
00:02:03,830 --> 00:02:06,520
maneja usando Canvas y agregando imágenes. 

57
00:02:06,515 --> 00:02:09,775
Es mejor jugar con las imágenes aquí mismo. 

58
00:02:09,770 --> 00:02:12,320
En lugar de jugar alrededor en las imágenes,

59
00:02:12,320 --> 00:02:14,320
escríbalo y tener todo delante

60
00:02:14,315 --> 00:02:16,945
del jugador y de los objetos en el juego. 

61
00:02:16,940 --> 00:02:19,220
Entonces esta es una manera mucho mejor o

62
00:02:19,220 --> 00:02:22,060
la forma que utiliza la unidad para manejar las cosas. 

63
00:02:22,055 --> 00:02:23,545
También se puede ver que tenemos

64
00:02:23,540 --> 00:02:25,090
algo llamado el sistema de eventos. 

65
00:02:25,085 --> 00:02:27,175
Y esto nos permite, por ejemplo,

66
00:02:27,170 --> 00:02:30,020
digamos que tenemos algún tipo de botón en el lienzo. 

67
00:02:30,020 --> 00:02:32,000
Queremos hacer clic en él para que
podamos

68
00:02:32,000 --> 00:02:34,300
agregar sistema de eventos bajo el Lienzo,

69
00:02:34,295 --> 00:02:36,935
convertirlo en un niño, y mantenerlo ahí por ahora. 

70
00:02:36,935 --> 00:02:40,475
Y este sistema de eventos nos permite realmente presionar

71
00:02:40,475 --> 00:02:42,445
botones en la pantalla y
permitirnos

72
00:02:42,440 --> 00:02:44,530
interactuar con el lienzo. 

73
00:02:44,525 --> 00:02:46,985
Ya veremos cómo funciona eso en tan solo un poco. 

74
00:02:46,985 --> 00:02:48,955
Pero por ahora, queremos
entrar

75
00:02:48,950 --> 00:02:51,050
en el escalador de lona aquí mismo. 

76
00:02:51,050 --> 00:02:54,490
Se puede ver que podemos escalar con tamaño de pantalla. 

77
00:02:54,485 --> 00:02:57,625
Y queremos cambiar esto de un 100 a
1920 para

78
00:02:57,620 --> 00:03:01,000
entonces ocho,

79
00:03:00,995 --> 00:03:03,505
que es del tamaño de la pantalla que

80
00:03:03,500 --> 00:03:06,260
estamos usando o creando el juego. 

81
00:03:06,260 --> 00:03:07,330
Hit Enter. 

82
00:03:07,325 --> 00:03:10,295
Ahí vas. Ahora todo está hecho. 

83
00:03:10,295 --> 00:03:12,865
Se puede ver tenemos el lanzador de rayos y un elemento

84
00:03:12,860 --> 00:03:15,440
para el lienzo lo cual no es tan importante. 

85
00:03:15,440 --> 00:03:18,040
No vamos a estar cambiando nada demasiado aquí. 

86
00:03:18,035 --> 00:03:21,295
Sólo queremos asegurarnos de que el escalador de lona como

87
00:03:21,290 --> 00:03:26,170
tamaño de pantalla de
escala y queremos que sea 1920 por 1080. 

88
00:03:26,165 --> 00:03:26,795
Está bien, genial. 

89
00:03:26,795 --> 00:03:28,075
Ahora con eso hecho,

90
00:03:28,070 --> 00:03:30,280
el siguiente paso es agregar una imagen. 

91
00:03:30,275 --> 00:03:32,285
Entonces voy a hacer clic aquí dentro,

92
00:03:32,285 --> 00:03:35,305
ir a ustedes son, y encontrar una imagen. 

93
00:03:35,300 --> 00:03:37,870
Entonces ahora puedes ver tenemos

94
00:03:37,865 --> 00:03:39,265
una imagen en medio
del

95
00:03:39,260 --> 00:03:41,450
enorme lienzo y yo voy a,

96
00:03:41,450 --> 00:03:43,990
es la imagen que se desvanece. 

97
00:03:43,985 --> 00:03:47,215
Pero a pesar de que lo tenemos en el lienzo,

98
00:03:47,210 --> 00:03:49,040
se
puede ver aquí abajo en el juego que

99
00:03:49,040 --> 00:03:51,070
lo
tenemos como una cuadra pequeña. 

100
00:03:51,065 --> 00:03:53,525
Y si lo muevo al lado superior,

101
00:03:53,525 --> 00:03:56,425
notarás que está en el lado superior del juego,

102
00:03:56,420 --> 00:03:57,620
y en el medio, es en

103
00:03:57,620 --> 00:04:00,010
el medio donde reside el jugador. 

104
00:04:00,005 --> 00:04:02,035
Y en la parte inferior izquierda lo puedes ver. 

105
00:04:02,030 --> 00:04:04,250
Entonces no es a pesar de que la imagen

106
00:04:04,250 --> 00:04:07,100
aquí arriba del juego sea enorme. 

107
00:04:07,100 --> 00:04:09,220
Pero se puede ver eso en el lienzo,

108
00:04:09,215 --> 00:04:11,875
Es realmente pequeño y se escala hacia abajo. 

109
00:04:11,870 --> 00:04:16,750
Entonces así es como representamos las cosas en Unity en lienzo de UI. 

110
00:04:16,745 --> 00:04:19,015
Ahora, ¿qué vamos a hacer? 

111
00:04:19,010 --> 00:04:21,950
Queremos que esta imagen llene todo el lienzo,

112
00:04:21,950 --> 00:04:23,650
que sea completamente negro. 

113
00:04:23,645 --> 00:04:25,135
Y luego vamos a usar

114
00:04:25,130 --> 00:04:28,580
la transparencia en él para desvanecerse y desvanecerse. 

115
00:04:28,580 --> 00:04:31,990
En primer lugar, ¿cómo lo hacemos tan grande como la pantalla? 

116
00:04:31,985 --> 00:04:34,015
Bueno, aquí hay una opción. 

117
00:04:34,010 --> 00:04:36,260
Se puede ver que es la herramienta rect. 

118
00:04:36,260 --> 00:04:38,390
Al hacer clic en él, puedes arrastrar

119
00:04:38,390 --> 00:04:40,690
y hacer que esta imagen sea cada vez más grande. 

120
00:04:40,685 --> 00:04:42,145
Y te darás cuenta aquí mismo
tenemos

121
00:04:42,140 --> 00:04:43,820
un montón de cosas que es

122
00:04:43,820 --> 00:04:46,070
el Rect Transform para

123
00:04:46,070 --> 00:04:49,030
manejar y cambiar cómo se ve la imagen. 

124
00:04:49,025 --> 00:04:51,085
También podemos sostener al Alt

125
00:04:51,080 --> 00:04:53,260
y elegir una de las esquinas, o ejército. 

126
00:04:53,255 --> 00:04:55,715
Elige a uno de los coordinadores y mantén presionada la Alt. 

127
00:04:55,715 --> 00:04:57,625
Y se puede ver que podemos
ampliarlo

128
00:04:57,620 --> 00:04:59,830
y todas las formas. 

129
00:04:59,825 --> 00:05:03,355
Pero hay una solución aún mejor para esto. 

130
00:05:03,350 --> 00:05:05,350
Y es que si hacemos click aquí,

131
00:05:05,345 --> 00:05:07,345
se
puede ver que tenemos un par

132
00:05:07,340 --> 00:05:09,650
de opciones y estas se llaman el ancla. 

133
00:05:09,650 --> 00:05:11,930
Entonces por ejemplo, si hago clic en este
ancla,

134
00:05:11,930 --> 00:05:15,050
la imagen escalará hacia abajo grande y pequeña con

135
00:05:15,045 --> 00:05:18,455
escala hacia arriba y hacia abajo en base a este punto de aquí mismo,

136
00:05:18,455 --> 00:05:21,155
también
podemos hacer clic en este donde escalará

137
00:05:21,155 --> 00:05:23,875
en
base a todo el lienzo. 

138
00:05:23,870 --> 00:05:25,130
Ya verás a qué me refiero con

139
00:05:25,130 --> 00:05:27,040
escalar cuando sí necesitamos escalar. 

140
00:05:27,035 --> 00:05:29,615
Pero, ¿qué pasa si sostenemos Alt? 

141
00:05:29,615 --> 00:05:32,405
Se puede ver que podemos expandir la imagen de esta manera. 

142
00:05:32,405 --> 00:05:34,045
Podemos expandirlo en el medio,

143
00:05:34,040 --> 00:05:35,900
podemos expandirlo a la izquierda,

144
00:05:35,900 --> 00:05:38,030
y podemos
expandirlo por todos lados

145
00:05:38,030 --> 00:05:40,250
para que llene toda la plaza. 

146
00:05:40,250 --> 00:05:42,050
Todo el Lienzo inmediatamente. 

147
00:05:42,050 --> 00:05:44,240
Y se puede ver que ahora la imagen ha

148
00:05:44,240 --> 00:05:46,690
bloqueado el juego por completo. 

149
00:05:46,685 --> 00:05:49,985
Y si voy al lienzo y a la imagen que se desvanece,

150
00:05:49,985 --> 00:05:52,945
puedo cambiar el color aquí mismo en la imagen,

151
00:05:52,940 --> 00:05:55,310
y hagámoslo completamente negro. 

152
00:05:55,310 --> 00:05:59,410
Ahora bien, ¿cómo vamos a estar cambiando la transparencia? 

153
00:05:59,405 --> 00:06:02,395
En primer lugar, podemos hacer esto

154
00:06:02,390 --> 00:06:05,740
aquí
mismo para que podamos cambiar el alfa en la imagen. 

155
00:06:05,735 --> 00:06:08,515
Pero es un poco difícil acceder al alfa

156
00:06:08,510 --> 00:06:11,390
en la imagen porque necesitamos acceder a todos los colores rojo,

157
00:06:11,390 --> 00:06:13,010
verde y azul. 

158
00:06:13,010 --> 00:06:15,380
En otra forma de hacerlo es agregando

159
00:06:15,380 --> 00:06:17,650
algo llamado grupo de campus. 

160
00:06:17,645 --> 00:06:22,985
Entonces si entro aquí y agrego un grupo de lona,

161
00:06:23,080 --> 00:06:27,460
se
puede ver que tengo la opción de tener Alpha. 

162
00:06:27,455 --> 00:06:29,305
Y si muevo este alfa hacia abajo

163
00:06:29,300 --> 00:06:31,280
de 0 a uno o de uno a 0,

164
00:06:31,280 --> 00:06:34,600
se
puede ver en 0 es completamente transparente. 

165
00:06:34,595 --> 00:06:36,635
A una, no lo es. 

166
00:06:36,635 --> 00:06:38,875
Y puedo bloquear el recast. 

167
00:06:38,870 --> 00:06:40,280
Eso significa que recast

168
00:06:40,280 --> 00:06:42,620
significa cada vez que quiero hacer clic en algo,

169
00:06:42,620 --> 00:06:44,660
esto puede ayudar a bloquear el re-cast y

170
00:06:44,660 --> 00:06:47,480
interactable ¿esta imagen es interactable? 

171
00:06:47,480 --> 00:06:49,760
Digamos que no lo es. Y ahí tienes. 

172
00:06:49,760 --> 00:06:54,170
Entonces ahora nuestro objetivo es crear una animación. 

173
00:06:54,170 --> 00:06:56,870
Usando esa animación, vamos a controlar

174
00:06:56,870 --> 00:06:59,750
el grupo de lona alfa aquí mismo. 

175
00:06:59,750 --> 00:07:02,000
Y entonces vamos a desvanecernos y

176
00:07:02,000 --> 00:07:04,730
desvanecernos cada vez y nuestra ganancia. 

177
00:07:04,730 --> 00:07:07,070
Entonces con eso explicado,

178
00:07:07,070 --> 00:07:09,250
te
voy a emitir un reto. 

179
00:07:09,245 --> 00:07:12,635
Y tu reto es desvanecer la imagen dentro y fuera. 

180
00:07:12,635 --> 00:07:13,925
Entonces les voy a dar

181
00:07:13,925 --> 00:07:16,645
un proceso paso a paso de cómo hacer esto. 

182
00:07:16,640 --> 00:07:18,380
En primer lugar, necesitarás crear

183
00:07:18,380 --> 00:07:19,940
una animación para el desvanecimiento

184
00:07:19,940 --> 00:07:21,800
y
el desvanecimiento y será de negro

185
00:07:21,800 --> 00:07:23,810
a transparente y se desvanecerá,

186
00:07:23,810 --> 00:07:26,320
que será lo transparente a negro. 

187
00:07:26,315 --> 00:07:29,495
Es necesario crear una transición entre

188
00:07:29,495 --> 00:07:31,615
la transición entre las dos animación

189
00:07:31,610 --> 00:07:32,930
basada en un disparador. 

190
00:07:32,930 --> 00:07:34,940
Entonces recuerda, creamos

191
00:07:34,940 --> 00:07:36,530
la transición basada en un booleano. 

192
00:07:36,530 --> 00:07:38,600
Ahora es el momento de usar un gatillo. 

193
00:07:38,600 --> 00:07:41,020
Deberá agregar un parámetro de disparo. 

194
00:07:41,015 --> 00:07:43,085
Obviamente, necesitas crear

195
00:07:43,085 --> 00:07:47,405
un script de UI Manager y añadirlo al lienzo. 

196
00:07:47,405 --> 00:07:49,555
Tendrás que crear un método

197
00:07:49,550 --> 00:07:51,350
que desencadene el desvanecimiento. 

198
00:07:51,350 --> 00:07:53,720
Y por último, necesitas llamar a ese método desde

199
00:07:53,720 --> 00:07:56,560
el Colton de carga en level manager. 

200
00:07:56,555 --> 00:07:59,455
Por lo que casi conocemos todos los pasos. 

201
00:07:59,450 --> 00:08:02,230
A lo mejor no sabes cómo poner un gatillo. 

202
00:08:02,225 --> 00:08:05,195
Entonces eso es lo que necesitarás para buscarte. 

203
00:08:05,194 --> 00:08:08,064
Y todo lo demás, creo que es algo que

204
00:08:08,060 --> 00:08:10,880
hemos pasado por lo que hemos visto con probado. 

205
00:08:10,880 --> 00:08:13,490
Recuerda la forma en que funcionará la animación es pulsando

206
00:08:13,490 --> 00:08:15,500
el pequeño botón rojo en

207
00:08:15,500 --> 00:08:19,250
la grabación de la animación para que la información,

208
00:08:19,250 --> 00:08:24,330
pause el video ahora mismo y vaya a hacer el Chavan. 

209
00:08:24,550 --> 00:08:26,780
De acuerdo, bienvenido de nuevo. 

210
00:08:26,780 --> 00:08:28,910
Entonces lo primero que vamos a hacer

211
00:08:28,910 --> 00:08:31,660
es que vamos a entrar en la animación. 

212
00:08:31,655 --> 00:08:34,765
Voy a seguir adelante y asegurarme de que

213
00:08:34,760 --> 00:08:38,020
tenga la imagen de desvanecimiento y crear una animación. 

214
00:08:38,015 --> 00:08:40,285
Y ahora puedo entrar en las animaciones,

215
00:08:40,280 --> 00:08:45,980
hacer clic derecho aquí y crear la imagen que se desvanece. 

216
00:08:45,980 --> 00:08:48,500
Entonces estoy dentro de animaciones de activos y

217
00:08:48,500 --> 00:08:50,860
aquí voy a crear
en primer lugar,

218
00:08:50,855 --> 00:08:57,085
el desvanecimiento, desvanecimiento y guardar eso. 

219
00:08:57,080 --> 00:08:59,170
Ahora lo que dijimos que el arma de decoloración debería

220
00:08:59,165 --> 00:09:01,505
ser el desvanecimiento en negro a transparente. 

221
00:09:01,505 --> 00:09:04,885
Está bien, genial. Entonces, ¿cuánto tiempo quiero que esto tome? 

222
00:09:04,880 --> 00:09:09,140
Entonces hagámoslo alrededor de 1.5 segundos. 

223
00:09:09,140 --> 00:09:11,860
Por lo que voy a hacer clic en el botón de grabación. 

224
00:09:11,855 --> 00:09:14,755
Y qué dije otra vez, negro demasiado transparente. 

225
00:09:14,750 --> 00:09:18,530
Oops, esa no es la clave que buscaba. 

226
00:09:18,530 --> 00:09:22,660
¿ Y dónde está? De acuerdo, de vuelta aquí. 

227
00:09:22,655 --> 00:09:27,845
Por lo que empezamos en negro y al final estamos grabando. 

228
00:09:27,845 --> 00:09:30,155
Yo quiero bajar el alfa a 0. 

229
00:09:30,155 --> 00:09:32,455
Entonces, ¿qué pasa ahora cuando toco la animación? 

230
00:09:32,450 --> 00:09:35,890
Se inicia como negro y luego se desvanece demasiado transparente. 

231
00:09:35,885 --> 00:09:36,775
Excelente. 

232
00:09:36,770 --> 00:09:40,640
Lo siguiente que voy a hacer es crear el desvanecimiento. 

233
00:09:40,640 --> 00:09:44,720
Tan desvaneciéndose. 

234
00:09:44,720 --> 00:09:50,300
Y ahora empezamos a 0

235
00:09:50,300 --> 00:09:55,690
y luego entramos en completa oscuridad después de 1 segundo. 

236
00:09:55,685 --> 00:09:57,655
Por lo que dejamos de grabar,

237
00:09:57,650 --> 00:10:00,290
ejecutar el juego tan transparente, desvanecemos a negro. 

238
00:10:00,290 --> 00:10:01,220
Excelente. 

239
00:10:01,220 --> 00:10:06,520
Ahora lo siguiente vamos a abrir el Animador. 

240
00:10:06,515 --> 00:10:10,105
Y aquí dentro vamos a primero que nada, vale,

241
00:10:10,100 --> 00:10:11,960
así que el desvanecimiento y el desvanecimiento en

242
00:10:11,960 --> 00:10:14,480
significa que vamos de negro a transparente. 

243
00:10:14,479 --> 00:10:17,269
Esto debería comenzar tan pronto como empecemos de nuevo. 

244
00:10:17,270 --> 00:10:19,460
Entonces no solo aparecemos en el modo de juego,

245
00:10:19,460 --> 00:10:21,490
nos desvanecemos en el modo de juego,

246
00:10:21,485 --> 00:10:23,365
y luego tenemos el fundido a negro
creará

247
00:10:23,360 --> 00:10:26,270
una transición aquí mismo. 

248
00:10:26,270 --> 00:10:28,370
Esta transición
no debe tener

249
00:10:28,370 --> 00:10:32,450
tiempo de salida y la configuración debe ser un,

250
00:10:32,450 --> 00:10:35,380
quiero decir que la duración de la transición debe estar en 0. 

251
00:10:35,375 --> 00:10:38,935
Voy a crear un parámetro el cual será un disparador,

252
00:10:38,930 --> 00:10:43,240
y sólo lo llamaré Inicio, fade. 

253
00:10:43,235 --> 00:10:44,945
Hacer de esta capital. 

254
00:10:44,945 --> 00:10:49,075
Ahí vas. Y agréguelo como condición aquí mismo. 

255
00:10:49,070 --> 00:10:50,180
Excelente. 

256
00:10:50,180 --> 00:10:52,580
Y espero que hayan hecho todos estos pasos. 

257
00:10:52,580 --> 00:10:54,170
Estas son cosas que ya hemos

258
00:10:54,170 --> 00:10:56,120
cubierto y que ya hemos creado. 

259
00:10:56,120 --> 00:10:57,500
Y antes de seguir adelante,

260
00:10:57,500 --> 00:11:00,590
necesitamos asegurarnos de que este lienzo también esté

261
00:11:00,590 --> 00:11:04,250
presente en el segundo nivel Y o en el nivel 1. 

262
00:11:04,250 --> 00:11:07,450
¿ Por qué? Porque si vamos al nivel 1,

263
00:11:07,445 --> 00:11:08,675
¿dónde están las escenas? 

264
00:11:08,675 --> 00:11:10,435
Si vamos al nivel 1, verás

265
00:11:10,430 --> 00:11:12,370
que no tenemos un lienzo,

266
00:11:12,365 --> 00:11:14,515
por lo que no podremos
acabar de desvanecimiento

267
00:11:14,510 --> 00:11:17,590
cuando iniciemos el Nivel 1 o cuando vayamos al nivel 1. 

268
00:11:17,585 --> 00:11:19,465
Por lo que de vuelta en el nivel 2,

269
00:11:19,460 --> 00:11:24,470
voy a llamar a esto el lienzo de UI Enter. 

270
00:11:24,470 --> 00:11:28,160
Y yo voy a entrar a los Prefabs. 

271
00:11:28,160 --> 00:11:29,900
¿ Dónde están los prefabs? 

272
00:11:29,900 --> 00:11:36,690
Y voy a crear y aquí una carpeta UI. 

273
00:11:36,685 --> 00:11:40,045
Y aquí dentro voy a arrastrar el campus de la UI. 

274
00:11:40,045 --> 00:11:41,245
Guarda eso. 

275
00:11:41,245 --> 00:11:44,025
Y ahora mira lo increíbles que son las prefabs. 

276
00:11:44,020 --> 00:11:45,970
Eigen no crea que hemos hablado de esto. 

277
00:11:45,970 --> 00:11:48,760
Pero si entramos en las escenas en el nivel uno,

278
00:11:48,760 --> 00:11:50,170
inmediato
podemos ir a

279
00:11:50,170 --> 00:11:53,890
Prefabs UI y agregar un lienzo y nuestros juegos. 

280
00:11:53,890 --> 00:11:57,190
Entonces ahora tenemos un lienzo aquí mismo

281
00:11:57,190 --> 00:11:58,900
en el nivel 1 y no
tuvimos

282
00:11:58,900 --> 00:12:00,880
que volver a crearlo todo. 

283
00:12:00,880 --> 00:12:03,330
Esta es la belleza de tener Prefabs. 

284
00:12:03,325 --> 00:12:06,135
Con eso hecho de nuevo en el nivel 2. 

285
00:12:06,130 --> 00:12:08,070
Veamos qué tenemos aquí dentro. 

286
00:12:08,065 --> 00:12:09,585
Por lo que juegan las animaciones,

287
00:12:09,580 --> 00:12:12,360
todo debería estar funcionando ahora cuando ejecutamos nuestro juego,

288
00:12:12,355 --> 00:12:15,045
deberíamos tener un desvanecimiento y animación. 

289
00:12:15,045 --> 00:12:17,585
Entonces ejecuto el juego. 

290
00:12:17,860 --> 00:12:19,580
Ahí vas. 

291
00:12:19,580 --> 00:12:23,420
Para que veas que tengo un desvanecimiento de looping en animación. 

292
00:12:23,420 --> 00:12:25,880
Entonces voy a entrar en las animaciones,

293
00:12:25,880 --> 00:12:28,730
encontrar el desvanecimiento y desvanecerse,

294
00:12:28,730 --> 00:12:33,080
y asegurarme de que no haya tiempo de bucle. Guarda eso. 

295
00:12:33,080 --> 00:12:37,640
Y ahora cuando corremos el juego y el segundo ahora
tenemos

296
00:12:37,640 --> 00:12:42,910
tenemos un desvanecimiento en una pulgada. 

297
00:12:42,905 --> 00:12:43,705
Excelente. 

298
00:12:43,700 --> 00:12:46,130
Entonces, ¿sabes por qué está pasando esto? 

299
00:12:46,130 --> 00:12:47,900
Bueno, porque al entrar,

300
00:12:47,900 --> 00:12:49,960
lo
primero que hacemos es el desvanecimiento. 

301
00:12:49,955 --> 00:12:52,295
Por lo que esto ya está configurado para nosotros. 

302
00:12:52,295 --> 00:12:55,375
Ahora, lo siguiente que tenemos que hacer es
crear

303
00:12:55,370 --> 00:12:58,820
el Gestor de UI y agregado al campus. 

304
00:12:58,820 --> 00:13:01,910
Entonces voy a entrar en mis scripts aquí,

305
00:13:01,910 --> 00:13:05,500
hacer clic derecho y crear una nueva carpeta para la interfaz de usuario. 

306
00:13:05,495 --> 00:13:07,715
Cambiamos mucho el nombre de esta carpeta,

307
00:13:07,715 --> 00:13:11,245
pero por ahora, sigamos adelante y creamos un script C-sharp,

308
00:13:11,240 --> 00:13:14,470
que va a ser el UI Manager

309
00:13:14,465 --> 00:13:17,945
o debería haber estado en la realidad del manager. 

310
00:13:17,945 --> 00:13:19,405
Y no tiene preocupaciones. 

311
00:13:19,400 --> 00:13:20,910
Espere a que esto se compile. 

312
00:13:20,914 --> 00:13:23,314
Pasémoslo a los directivos. 

313
00:13:23,315 --> 00:13:26,465
Creo que aquí es mantequilla o tal vez no. 

314
00:13:26,465 --> 00:13:28,585
No lo sé. Depende de tu preferencia. 

315
00:13:28,580 --> 00:13:32,560
Creo que en el directivo tal vez sea mejor. 

316
00:13:32,555 --> 00:13:35,155
Cancelar o no, dejémoslo. 

317
00:13:35,150 --> 00:13:36,310
Vamos a mantenerlo en tu ojo. 

318
00:13:36,305 --> 00:13:40,135
A pesar de que es un manager lo mantendrá en la interfaz de usuario. 

319
00:13:40,130 --> 00:13:43,090
Voy a abrir el Administrador de UI,

320
00:13:43,085 --> 00:13:44,665
abrir Visual Studio. 

321
00:13:44,660 --> 00:13:46,250
Y lo primero que
necesitaremos

322
00:13:46,250 --> 00:13:48,110
es una referencia a la imagen

323
00:13:48,110 --> 00:13:51,560
que queremos desvanecer de nuevo aquí. 

324
00:13:51,560 --> 00:13:53,660
Espero que esto no fuera demasiado duro
porque

325
00:13:53,660 --> 00:13:55,930
va a ser un campo serializado,

326
00:13:55,925 --> 00:13:58,625
que es una imagen de tipo imagen. 

327
00:13:58,625 --> 00:14:01,255
Ah, así que había algo que
espero que

328
00:14:01,250 --> 00:14:04,120
algunos de ustedes fueran capaces de descifrar. 

329
00:14:04,115 --> 00:14:06,725
Si traté de usar la imagen aquí mismo. 

330
00:14:06,725 --> 00:14:09,875
Te darás cuenta de que no tengo opción para ello. 

331
00:14:09,875 --> 00:14:11,905
Lo que sí necesito es
usar

332
00:14:11,900 --> 00:14:15,040
tu motor Unity dot u i

333
00:14:15,035 --> 00:14:18,635
Así que espero que esto no fuera un gran problema para ti. 

334
00:14:18,635 --> 00:14:21,175
Espero que encontraras este error o

335
00:14:21,170 --> 00:14:23,630
encontraras este inconveniente en el reto y

336
00:14:23,630 --> 00:14:26,110
apartaras de tu camino y trataras de averiguar

337
00:14:26,110 --> 00:14:29,020
la solución si no lo hiciste, no te preocupes por ello. 

338
00:14:29,015 --> 00:14:30,935
Fue en mi nombre. 

339
00:14:30,935 --> 00:14:33,685
Debí haberte advertido de antemano. 

340
00:14:33,680 --> 00:14:34,900
No se preocupe. 

341
00:14:34,895 --> 00:14:38,545
Imagen al destino. 

342
00:14:38,540 --> 00:14:40,370
Algunos de ustedes podrían estar pensando, Sí, sin preocupaciones,
seguro,

343
00:14:40,370 --> 00:14:43,030
solo mi confianza fue destruida. 

344
00:14:43,025 --> 00:14:46,075
De todos modos, ¿qué vamos a hacer en

345
00:14:46,070 --> 00:14:49,660
esta clase aquí y el Administrador de UI? 

346
00:14:49,655 --> 00:14:50,725
Bueno, como dijimos,

347
00:14:50,720 --> 00:14:52,400
necesitamos un método. 

348
00:14:52,395 --> 00:14:55,545
Crear un método que desencadene el desvanecimiento y llamar a

349
00:14:55,540 --> 00:14:59,010
ese método desde el coworking de carga en level manager. 

350
00:14:59,005 --> 00:15:02,365
De acuerdo, entonces me voy a asegurar que esto sea un público. 

351
00:15:02,365 --> 00:15:09,295
Entonces voy a crear una imagen de desvanecimiento del vacío público. 

352
00:15:09,810 --> 00:15:12,850
Y aquí dentro voy a
seguir adelante

353
00:15:12,850 --> 00:15:15,460
y acceder a la imagen para desvanecerse. 

354
00:15:15,460 --> 00:15:18,100
Voy a conseguir un componente en él,

355
00:15:18,100 --> 00:15:20,930
que es el animador. 

356
00:15:22,140 --> 00:15:26,390
Y voy a poner el gatillo. 

357
00:15:26,490 --> 00:15:29,320
Y ese gatillo va a ser

358
00:15:29,320 --> 00:15:34,970
la referencia de una cadena al desvanecimiento de Inicio. 

359
00:15:34,965 --> 00:15:39,865
Y hoy, ahora, copia esto de vuelta aquí,

360
00:15:39,860 --> 00:15:42,730
pégalo aquí, cierra, guarda eso. 

361
00:15:42,725 --> 00:15:44,345
Entonces, ¿qué estamos haciendo? 

362
00:15:44,345 --> 00:15:46,485
Porque creamos la animación

363
00:15:46,489 --> 00:15:48,169
en la imagen real para desvanecerse. 

364
00:15:48,170 --> 00:15:50,150
Se puede ver que el animador está aquí

365
00:15:50,150 --> 00:15:52,780
en este objeto de juego. 

366
00:15:52,775 --> 00:15:55,615
Uno de los componentes en la imagen para desvanecerse. 

367
00:15:55,610 --> 00:15:58,190
Entonces lo que hacemos es acceder al animador en

368
00:15:58,190 --> 00:16:01,760
la imagen y luego configuramos el gatillo que se inicia. 

369
00:16:01,760 --> 00:16:02,680
Está bien, genial. 

370
00:16:02,675 --> 00:16:04,645
Ahora el siguiente paso es seguir
adelante

371
00:16:04,640 --> 00:16:06,910
y llamarlo Level Manager. 

372
00:16:06,905 --> 00:16:09,505
Y hay dos formas de hacer esto. 

373
00:16:09,500 --> 00:16:11,090
Podemos o bien ir adelante y encontrar

374
00:16:11,090 --> 00:16:13,790
el objeto del juego o encontrar al Gestor de UI. 

375
00:16:13,790 --> 00:16:16,750
O vamos a seguir adelante y crear una instancia de esto. 

376
00:16:16,745 --> 00:16:23,905
Voy a crear un gestor de UI público estático. 

377
00:16:23,900 --> 00:16:28,570
En la instancia. Guarda eso. 

378
00:16:28,565 --> 00:16:31,655
Y voy a crear un inicio aquí. 

379
00:16:31,655 --> 00:16:37,685
Y luego iniciar la instancia será igual a esto. 

380
00:16:37,685 --> 00:16:39,125
Guarda eso. 

381
00:16:39,125 --> 00:16:42,095
Ahora de vuelta en el manager de nivel,

382
00:16:42,095 --> 00:16:43,765
¿dónde debemos poner esto? 

383
00:16:43,760 --> 00:16:46,480
Bueno, yo creo en cuanto
golpeamos

384
00:16:46,475 --> 00:16:50,455
o en cuanto entramos al nivel de carga. 

385
00:16:50,450 --> 00:16:53,590
Por lo que tenemos la escala de tiempo en 0.2. 

386
00:16:53,585 --> 00:16:56,245
Voy a seguir adelante y acceder al

387
00:16:56,240 --> 00:17:01,410
Administrador
de UI, la instancia. 

388
00:17:01,405 --> 00:17:04,935
Y voy a seguir adelante y desvanecer la imagen. 

389
00:17:04,930 --> 00:17:07,000
Ahora, notarás algo que

390
00:17:07,000 --> 00:17:10,470
porque hemos dicho la escala de tiempo a 0.2,

391
00:17:10,465 --> 00:17:12,225
el desvanecimiento de la imagen será

392
00:17:12,220 --> 00:17:14,950
más lento que lo que tenemos aquí dentro. 

393
00:17:14,950 --> 00:17:17,730
Entonces vamos a probar esto y a ver si funciona. 

394
00:17:17,725 --> 00:17:20,325
Si sientes que es un poco lento,

395
00:17:20,320 --> 00:17:21,640
puedes seguir adelante y hacer que

396
00:17:21,640 --> 00:17:23,890
el desvanecimiento de la imagen sea un poco más lento. 

397
00:17:23,890 --> 00:17:25,500
Entonces ahí vamos. 

398
00:17:25,495 --> 00:17:28,285
Empezamos, corremos. 

399
00:17:28,285 --> 00:17:32,815
Y cuando entramos a este portal aquí mismo, allá vamos. 

400
00:17:32,815 --> 00:17:36,735
Estamos bajando la velocidad y nos olvidamos de añadir un hey,

401
00:17:36,730 --> 00:17:39,190
nos olvidamos de añadir la referencia. 

402
00:17:39,190 --> 00:17:40,750
Aquí puedes ver el error. 

403
00:17:40,750 --> 00:17:42,200
Si hago doble clic en él,

404
00:17:42,195 --> 00:17:45,985
verás que la imagen de punto de IU Manager se desvanece,

405
00:17:45,980 --> 00:17:48,700
hay algo mal. ¿Qué pasa? 

406
00:17:48,695 --> 00:17:51,985
Bueno, no hay instancia. 

407
00:17:51,980 --> 00:17:54,360
De acuerdo, entonces si voy al lienzo de la
UI,

408
00:17:54,364 --> 00:17:57,934
notaría que ni siquiera agregué el manager,

409
00:17:57,935 --> 00:18:00,145
Así que no estoy seguro de cómo se está llamando. 

410
00:18:00,140 --> 00:18:03,160
Entonces vamos a arrastrar en el Administrador de UI. 

411
00:18:03,155 --> 00:18:05,485
Vamos a asegurarnos de que dijimos

412
00:18:05,480 --> 00:18:09,110
la imagen de desvanecimiento y vamos a aplicar los cambios. 

413
00:18:09,110 --> 00:18:12,100
Entonces nota ahora el lienzo

414
00:18:12,095 --> 00:18:15,865
este nivel no tenía un Administrador de UI, ¿verdad? 

415
00:18:15,860 --> 00:18:19,780
Y este es el que usamos en el nivel uno. 

416
00:18:19,775 --> 00:18:22,235
Si voy ahora mismo al nivel uno,

417
00:18:22,235 --> 00:18:24,215
hago clic en el lienzo de UI. 

418
00:18:24,214 --> 00:18:28,234
Cuenta con un Administrador de UI y tiene la imagen ya configurada. 

419
00:18:28,235 --> 00:18:32,725
Para que puedas ver de nuevo el poder de usar apps de duelo. 

420
00:18:32,720 --> 00:18:34,270
¿ Qué tan guay es eso? 

421
00:18:34,265 --> 00:18:37,385
Por lo que de vuelta al nivel para correr el juego,

422
00:18:37,385 --> 00:18:40,705
nos desvanecemos. No más errores. 

423
00:18:40,700 --> 00:18:43,750
Caminamos arriba, pasamos por el portal,

424
00:18:43,745 --> 00:18:45,445
y ahí vamos, bajamos la velocidad. 

425
00:18:45,440 --> 00:18:48,020
Tenemos este azúcar aquí mismo. 

426
00:18:48,020 --> 00:18:51,110
Por lo que hubo un ligero problema aquí. 

427
00:18:51,110 --> 00:18:53,020
Ya que notan que no
tuvimos

428
00:18:53,015 --> 00:18:55,385
el tiempo para ni siquiera desvanecerse. 

429
00:18:55,385 --> 00:18:57,835
Entonces voy a acceder de
nuevo al desvanecimiento

430
00:18:57,830 --> 00:19:00,910
y a la imagen que se desvanece. 

431
00:19:00,905 --> 00:19:02,845
¿ Y dónde está esto? 

432
00:19:02,840 --> 00:19:05,090
Bueno, esto dependerá de cuánto tiempo o

433
00:19:05,090 --> 00:19:07,610
cuál es la escala temporal que tengas aquí mismo. 

434
00:19:07,610 --> 00:19:11,270
Entonces voy a hacerlo 0.5. Guarda eso. 

435
00:19:11,270 --> 00:19:14,090
Y en lugar de 1.5 segundos,

436
00:19:14,090 --> 00:19:16,210
voy a hacerlo alrededor,

437
00:19:16,205 --> 00:19:18,955
Hagámoslo alrededor de 0,

438
00:19:18,950 --> 00:19:22,520
tal vez 1 segundo o 2.5th. 

439
00:19:22,520 --> 00:19:26,300
Digamos que son unos 40 del juego. 

440
00:19:26,300 --> 00:19:28,940
Pruébalo, a ver si tenemos tiempo para desvanecerse. 

441
00:19:28,940 --> 00:19:32,570
Entonces subo, me muevo. 

442
00:19:32,570 --> 00:19:34,070
Ahí vamos, nos desvanecemos por

443
00:19:34,070 --> 00:19:36,340
completo y después paramos de desvanecerse. 

444
00:19:36,335 --> 00:19:37,985
Y muy normalmente. 

445
00:19:37,985 --> 00:19:39,355
Entonces con eso hecho,

446
00:19:39,350 --> 00:19:40,500
espero que disfruten. 

447
00:19:40,500 --> 00:19:42,950
Asegurémonos de comprometer nuestros cambios. 

448
00:19:42,950 --> 00:19:46,740
Etapa todos comprometen los cambios. 

449
00:19:47,230 --> 00:19:51,070
Creado una
imagen de entrada y salida que se desvanece

450
00:19:51,065 --> 00:19:56,845
usando eres innumerables. 

451
00:19:56,840 --> 00:19:58,000
Comete los cambios. 

452
00:19:57,995 --> 00:20:02,735
Espero que lo disfruten y los veré en el siguiente video.