﻿1
00:00:04,470 --> 00:00:05,770
‫Ei, bem-vindo de volta.

2
00:00:05,790 --> 00:00:12,240
‫Neste vídeo, vamos trabalhar para mostrar o texto na tela para nos informar que o jogo está começando.

3
00:00:12,240 --> 00:00:18,240
‫E este é o primeiro passo para mostrar o cronômetro de contagem regressiva para que o jogador saiba que

4
00:00:18,240 --> 00:00:21,140
‫o jogo ainda não começou, mas começará em breve.

5
00:00:21,150 --> 00:00:24,900
‫Agora, isso envolverá eventos implementáveis de blueprint.

6
00:00:24,930 --> 00:00:32,280
‫Um evento implementável do Blueprint é uma função C++ que podemos chamar de C++, mas na verdade implementamos

7
00:00:32,280 --> 00:00:35,070
‫a funcionalidade no lado do blueprint.

8
00:00:35,070 --> 00:00:41,910
‫Assim, podemos ter nossa classe C++, como o modo de jogo, e podemos ter uma função marcada como

9
00:00:41,910 --> 00:00:47,310
‫um blueprint, um evento implementável, e então podemos implementar esse comportamento em blueprints.

10
00:00:47,310 --> 00:00:54,570
‫Portanto, quando chamamos a função C++ marcada como um evento implementável do blueprint, o evento no blueprint

11
00:00:54,570 --> 00:00:55,920
‫será disparado.

12
00:00:55,920 --> 00:01:01,890
‫E qualquer lógica de blueprint que conectarmos a esse evento no blueprint será chamada.

13
00:01:02,160 --> 00:01:08,640
‫Então, vou criar uma função de evento implementável de blueprint aqui em tanques de sintonia, modos de jogo e eventos

14
00:01:08,640 --> 00:01:11,310
‫implementáveis de blueprint não podem ser privados.

15
00:01:11,310 --> 00:01:14,220
‫Então, vou adicionar isso à seção protegida.

16
00:01:14,220 --> 00:01:19,080
‫Agora eu vou fazer disso uma função void e vou simplesmente chamar isso de start game.

17
00:01:19,080 --> 00:01:25,380
‫Agora, para tornar isso um evento implementável de blueprint, tenho que fornecer uma macro de função U com a

18
00:01:25,380 --> 00:01:26,160
‫função U.

19
00:01:26,160 --> 00:01:30,570
‫Especifique o evento implementável do blueprint.

20
00:01:30,690 --> 00:01:36,390
‫Agora, uma vez que marcamos esse evento implementável do blueprint, nem precisamos dar a ele um corpo de

21
00:01:36,390 --> 00:01:37,800
‫função aqui em C++.

22
00:01:37,800 --> 00:01:43,680
‫O Unreal Engine espera que implementemos a funcionalidade para isso em blueprints, mas podemos chamá-lo

23
00:01:43,680 --> 00:01:49,110
‫de C++ e é exatamente isso que faremos aqui no Handle Game Start.

24
00:01:49,110 --> 00:01:55,260
‫Então, logo após definirmos o tanque e as variáveis do controlador do jogador, vou chamar start game e

25
00:01:56,070 --> 00:01:57,840
‫agora podemos compilar isso.

26
00:01:57,840 --> 00:02:04,170
‫E voltando aqui no editor, vou abrir o modo de jogo BP tune tanks e aqui é onde

27
00:02:04,170 --> 00:02:05,700
‫podemos implementar a função.

28
00:02:05,700 --> 00:02:13,380
‫Então, se clicarmos com o botão direito do mouse e digitarmos start game, aqui está o evento start game que foi criado assim

29
00:02:13,380 --> 00:02:19,980
‫que declaramos a função e demos a ela a macro de função com o evento implementável do blueprint.

30
00:02:19,980 --> 00:02:26,580
‫Então, no lado do C++, estamos chamando isso e em blueprints, esse evento está respondendo a isso.

31
00:02:26,610 --> 00:02:33,390
‫Podemos testar isso com um simples nó de string de impressão e para a string podemos dizer Start game.

32
00:02:33,600 --> 00:02:37,650
‫Agora, se apertarmos o play, verei o início do jogo no canto superior esquerdo.

33
00:02:37,650 --> 00:02:41,370
‫Portanto, sabemos que nosso evento implementável de blueprint está funcionando.

34
00:02:41,370 --> 00:02:49,530
‫Agora, o que gostaríamos que este evento fizesse é mostrar um widget que contém um texto informando ao jogador que o jogo está prestes

35
00:02:49,530 --> 00:02:53,880
‫a começar, o que significa que precisamos criar um widget para mostrar.

36
00:02:53,880 --> 00:03:00,960
‫Então vou criar uma nova pasta na pasta blueprints e vou chamar isso de widgets e vou clicar duas

37
00:03:00,960 --> 00:03:02,370
‫vezes em widgets.

38
00:03:02,370 --> 00:03:05,730
‫E aqui é onde vou criar um novo esquema de widget.

39
00:03:05,940 --> 00:03:11,010
‫Agora, se eu clicar com o botão direito do mouse e ir para a interface do usuário, aqui está o Widget Blueprint.

40
00:03:11,040 --> 00:03:17,520
‫Agora, se eu clicar aqui, criarei um novo esquema de widget e chamarei esse W

41
00:03:17,520 --> 00:03:21,540
‫BP para Widget Blueprint, sublinhado iniciar widget de jogo.

42
00:03:21,960 --> 00:03:27,240
‫E se eu clicar duas vezes nele, abrirei o editor do Widget Blueprint e você verá que ele

43
00:03:27,240 --> 00:03:31,560
‫parece um pouco diferente do editor do Blueprint que estamos acostumados a ver.

44
00:03:31,560 --> 00:03:33,840
‫E isso porque isso é para um widget.

45
00:03:33,840 --> 00:03:37,860
‫Widgets são bons para exibir coisas na tela, como texto.

46
00:03:37,890 --> 00:03:43,590
‫Agora há muito aqui e vamos fazer apenas um widget muito básico que mostra texto.

47
00:03:43,620 --> 00:03:50,310
‫Há vários tipos diferentes de elementos que podemos adicionar a um esquema de widget, como bordas, botões,

48
00:03:50,310 --> 00:03:53,580
‫caixas de seleção, imagens e assim por diante.

49
00:03:53,580 --> 00:03:58,140
‫Mas o que nos interessa é este aqui que diz Texto.

50
00:03:58,140 --> 00:04:05,280
‫Agora olhe para baixo aqui no painel de hierarquia, você verá que temos o widget geral do jogo inicial do WB

51
00:04:05,280 --> 00:04:06,180
‫no topo.

52
00:04:06,180 --> 00:04:10,500
‫E se clicarmos nele, podemos alterar as propriedades deste widget.

53
00:04:10,530 --> 00:04:14,040
‫Agora podemos arrastar os elementos do widget para essa hierarquia.

54
00:04:14,040 --> 00:04:20,070
‫Então, vou procurar na paleta o painel de tela e arrastá-lo para baixo na minha hierarquia.

55
00:04:21,590 --> 00:04:28,880
‫Agora, um painel de tela nos permite colocar elementos de widget e defini-los em um local desejado na tela para

56
00:04:28,880 --> 00:04:33,020
‫que possamos arrastar um elemento de texto diretamente para o gráfico.

57
00:04:33,020 --> 00:04:37,910
‫E você verá na hierarquia este novo item no painel de tela.

58
00:04:37,910 --> 00:04:39,360
‫E diz, Texto.

59
00:04:39,360 --> 00:04:40,310
‫Bloco de texto.

60
00:04:40,310 --> 00:04:47,450
‫Agora, este bloco de texto entre aspas é o texto que é definido automaticamente para este widget de texto.

61
00:04:47,450 --> 00:04:54,740
‫E aqui no painel de detalhes, com este widget de texto selecionado em conteúdo, vemos uma propriedade de texto e

62
00:04:54,740 --> 00:04:57,170
‫está definida como bloco de texto.

63
00:04:57,170 --> 00:05:00,860
‫Mas podemos definir isso para qualquer texto que quisermos, como prepare-se.

64
00:05:01,250 --> 00:05:06,620
‫Agora, depois de configurar isso para ficar pronto, você verá que o texto aqui na tela diz, Prepare-se.

65
00:05:06,710 --> 00:05:13,940
‫Então o editor Widget Blueprint nos permite personalizar nosso aviso de widgets no canto superior esquerdo da tela, essa

66
00:05:13,940 --> 00:05:17,810
‫coisa de medalhão aqui, isso é chamado de âncora.

67
00:05:17,840 --> 00:05:22,100
‫Nosso widget de texto é colocado na tela em relação à âncora.

68
00:05:22,100 --> 00:05:27,560
‫Portanto, se o tamanho da tela mudar, a distância dessa âncora permanecerá constante.

69
00:05:27,560 --> 00:05:29,990
‫E podemos mudar a âncora se quisermos.

70
00:05:30,020 --> 00:05:35,690
‫Por exemplo, podemos definir nosso widget de texto em relação a uma âncora no meio da tela, indo

71
00:05:35,690 --> 00:05:39,470
‫para o painel de detalhes e sob o slot vemos âncoras.

72
00:05:39,470 --> 00:05:45,500
‫E se eu clicar no menu suspenso, posso selecionar este ícone que tem um quadrado no meio.

73
00:05:45,500 --> 00:05:51,080
‫Se eu selecionar isso agora, a âncora está no centro da tela, e se eu quiser meu

74
00:05:51,080 --> 00:05:58,430
‫widget completamente centralizado, posso alterar sua posição X e Y aqui na categoria slot para que eu possa definir isso como zero para a

75
00:05:58,430 --> 00:06:05,540
‫posição X e zero para a posição Y e rolando com a roda do mouse para aumentar o zoom, você verá que está

76
00:06:05,540 --> 00:06:08,510
‫no canto superior esquerdo como no meio da tela.

77
00:06:08,510 --> 00:06:17,180
‫Agora este campo de alinhamento aqui pode nos deixar centralizar perfeitamente escolhendo valores de 0. 54 X e 0. 54 Y, e agora

78
00:06:17,180 --> 00:06:21,350
‫está completamente centralizado no meio da tela.

79
00:06:21,440 --> 00:06:27,770
‫Agora, para um widget de jogo inicial, provavelmente será apropriado colocar este texto um pouco mais

80
00:06:27,770 --> 00:06:28,250
‫acima.

81
00:06:28,250 --> 00:06:35,840
‫Portanto, para a Posição Y, posso clicar e arrastar para a esquerda, o que tornará o valor da posição Y negativo

82
00:06:35,840 --> 00:06:40,250
‫no editor de esquema do widget, o eixo y aponta para baixo.

83
00:06:40,250 --> 00:06:46,250
‫Então, se quisermos aumentar nosso widget de texto, faremos dessa posição y um valor menor.

84
00:06:46,250 --> 00:06:49,130
‫Vou colocá-lo aqui em cerca de -300.

85
00:06:49,130 --> 00:06:55,460
‫Agora na categoria de aparência, posso alterar várias propriedades para este texto.

86
00:06:55,460 --> 00:07:01,730
‫Se eu clicar no menu suspenso da fonte, posso alterar o tamanho da fonte para dizer algo como 42.

87
00:07:01,730 --> 00:07:04,070
‫Agora para tipo de letra em vez de negrito.

88
00:07:04,070 --> 00:07:06,140
‫Eu gosto do tipo de letra normal.

89
00:07:06,140 --> 00:07:07,970
‫Acho que agora está um pouco melhor.

90
00:07:07,970 --> 00:07:14,300
‫Observe que o texto do nosso widget de texto é maior que o retângulo verde aqui, mas podemos redimensionar esse

91
00:07:14,300 --> 00:07:15,230
‫retângulo verde.

92
00:07:15,230 --> 00:07:22,010
‫E como estou alterando o retângulo, você verá aqui no painel de detalhes que o tamanho X e o tamanho y

93
00:07:22,010 --> 00:07:22,880
‫estão mudando.

94
00:07:22,880 --> 00:07:26,270
‫Agora, observe que a posição X mudou um pouco desde que a alterei.

95
00:07:26,270 --> 00:07:32,180
‫Eu posso colocá-lo de volta a zero e como o alinhamento para o x é 0. 5, está perfeitamente centrado.

96
00:07:32,180 --> 00:07:35,540
‫Então agora eu tenho um widget que diz Prepare-se.

97
00:07:35,570 --> 00:07:40,400
‫A única coisa que resta a fazer é adicionar isso à janela de visualização para que possamos vê-lo na tela.

98
00:07:40,400 --> 00:07:46,370
‫Você notará que se eu apertar play e começar a jogar o jogo eu não vi aquele widget na tela.

99
00:07:46,370 --> 00:07:51,530
‫Isso porque temos que adicionar isso ativamente à tela, e é por isso que criamos esse

100
00:07:51,530 --> 00:07:56,960
‫evento implementável de blueprint no modo de jogo para que possamos adicionar esse widget à tela aqui.

101
00:07:56,960 --> 00:07:59,090
‫Então vamos falar sobre como fazer isso.

102
00:07:59,420 --> 00:07:59,840
‫Agora.

103
00:07:59,840 --> 00:08:05,930
‫A maneira de criar um widget a partir de blueprints é usando um nó de criação de widget.

104
00:08:05,960 --> 00:08:11,870
‫Você pode clicar com o botão direito do mouse no gráfico de eventos de qualquer blueprint e começar a digitar o nome de um nó

105
00:08:11,870 --> 00:08:13,760
‫e, em seguida, selecionar esse nó específico.

106
00:08:13,790 --> 00:08:16,040
‫O nó que precisamos é criar widget.

107
00:08:16,040 --> 00:08:20,990
‫Agora você verá que diz Create Coolness Widget.

108
00:08:20,990 --> 00:08:27,020
‫E isso porque assim que adicionei o nó Create Widget, selecionei a classe Widget Blueprint aqui

109
00:08:27,020 --> 00:08:29,150
‫na lista suspensa da classe.

110
00:08:29,150 --> 00:08:34,340
‫Isso é necessário para que o Unreal Engine saiba qual classe de widget criar.

111
00:08:34,370 --> 00:08:40,880
‫Agora, depois de usar um nó de criação de widget, usamos um nó add to viewport para realmente adicionar

112
00:08:40,880 --> 00:08:45,290
‫esse widget à viewport e então podemos vê-lo na tela do jogo.

113
00:08:45,320 --> 00:08:52,700
‫Observe que os fios de execução estão conectados e também que o nó create widget retorna essa saída azul

114
00:08:52,700 --> 00:08:59,300
‫e isso deve ser conectado à entrada de destino em add to viewport, pois add to

115
00:08:59,300 --> 00:09:06,290
‫viewport precisa saber qual widget adicionar à viewport e o nó create widget retorna o valor desse widget.

116
00:09:06,290 --> 00:09:11,570
‫Então, agora que você sabe como criar um widget em blueprints, você irá para a classe de modo

117
00:09:11,570 --> 00:09:14,960
‫de jogo BP tune tanks e usará um nó create widget.

118
00:09:14,990 --> 00:09:20,390
‫Você vai conectar isso a partir do nosso fio de execução de eventos implementáveis do blueprint.

119
00:09:20,500 --> 00:09:21,910
‫Chamamos Start Game.

120
00:09:21,910 --> 00:09:29,800
‫Agora, no nó Create Widget, precisamos selecionar a classe de widget para criar, então selecione WB start game widget, esse novo esquema

121
00:09:29,800 --> 00:09:36,700
‫de widget que acabamos de criar e, em seguida, use um nó add to viewport para realmente adicionar

122
00:09:36,700 --> 00:09:40,960
‫esse novo widget à viewport e gancho os fios de execução.

123
00:09:40,960 --> 00:09:47,560
‫E não se esqueça de conectar o valor de retorno de create widget à entrada de destino em add to viewport.

124
00:09:47,560 --> 00:09:52,900
‫Então, pause o vídeo e adicione esses nós ao modelo do modo de jogo do tanque de ajuste agora.

125
00:09:56,670 --> 00:10:03,090
‫Então, estou aqui na sintonia Tanks Game Mode Blueprint e vou clicar com o botão direito do mouse e digitar

126
00:10:03,090 --> 00:10:05,700
‫create widget e escolher Create Widget Node.

127
00:10:05,730 --> 00:10:07,830
‫Agora observe que diz Construir Nenhum.

128
00:10:07,830 --> 00:10:12,930
‫E isso porque vai dizer isso até selecionarmos a classe de widget apropriada na lista suspensa

129
00:10:12,930 --> 00:10:13,600
‫de classes.

130
00:10:13,620 --> 00:10:18,210
‫Mas antes de fazer isso, vou ligar o fio de execução dos eventos que iniciam o jogo.

131
00:10:18,210 --> 00:10:24,720
‫Então, na verdade, executamos essa funcionalidade assim que nosso jogo de início de evento implementável do blueprint

132
00:10:24,720 --> 00:10:26,700
‫é chamado de C++.

133
00:10:26,970 --> 00:10:34,830
‫Agora, para a lista suspensa da classe, vou selecionar WP Start Game Widget e agora o título do Node

134
00:10:34,830 --> 00:10:38,700
‫muda para dizer Create WP Start Game Widget Widget.

135
00:10:38,820 --> 00:10:41,880
‫Então agora podemos ver que este é um nó de criação de widget.

136
00:10:41,910 --> 00:10:48,660
‫Agora vou clicar no fio de execução e arrastar e digitar add to viewport.

137
00:10:48,660 --> 00:10:54,720
‫E então, se eu selecionar add to viewport, os fios de execução serão automaticamente conectados para

138
00:10:54,720 --> 00:11:01,410
‫mim, mas não conectará o valor de retorno de create widget à entrada de destino para add to viewport.

139
00:11:01,410 --> 00:11:04,070
‫Então eu preciso clicar e arrastar isso eu mesmo.

140
00:11:04,080 --> 00:11:10,920
‫Então, agora, quando o Start Game for chamado de C++ e da classe de modo de jogo, executaremos essa lógica

141
00:11:10,920 --> 00:11:18,330
‫de blueprint que resultará na criação de um novo widget baseado no widget WP Start Game e, em seguida, o adicionaremos à

142
00:11:18,330 --> 00:11:19,500
‫janela de visualização.

143
00:11:19,500 --> 00:11:23,220
‫Então eu vou clicar em play e lá está o widget Prepare-se.

144
00:11:23,400 --> 00:11:29,550
‫Agora, mencionamos que isso mostrará um cronômetro de contagem regressiva, mas ainda não implementamos

145
00:11:29,550 --> 00:11:32,220
‫essa funcionalidade, portanto, em breve.

146
00:11:32,490 --> 00:11:39,090
‫Então, em resumo, criamos o Start Game Widget Blueprint e, por enquanto, ele tem apenas um texto que

147
00:11:39,090 --> 00:11:39,930
‫diz Prepare-se.

148
00:11:40,260 --> 00:11:46,740
‫Também usamos um nó de criação de widget e um nó add to viewport para adicionar esse widget à janela de visualização para que

149
00:11:46,740 --> 00:11:48,990
‫possamos vê-lo assim que o jogo começar.

150
00:11:48,990 --> 00:11:55,620
‫E iniciamos essa funcionalidade usando nosso evento implementável de blueprint que criamos na classe C++ do modo de

151
00:11:55,620 --> 00:12:02,460
‫jogo chamada Start Game nos próximos vídeos, vamos alterar o texto neste widget em tempo de execução para

152
00:12:02,460 --> 00:12:09,270
‫que ele mostre quanto tempo resta nesse cronômetro de início do jogo para que o jogador saiba quanto

153
00:12:09,270 --> 00:12:13,140
‫tempo esperar antes de começar a jogar o jogo.

154
00:12:13,860 --> 00:12:14,850
‫Vejo você em breve.

