Nesse vídeo vamos adicionar alguns
elementos de interface de usuário ao nosso jogo
incluindo títulos para quando começamos o jogo e mudamos de fase
e text para mostrar o placar do jogador.
Para fazer isso vamos usar o sistema de UI da Unity.
Vamos clicar em Game Object - UI - Canvas.
O canvas vai conter todos
os elementos de interface.
O primeiro elemento que iremos criar será
uma imagem que utilizaremos
como fundo para nossos títulos.
Vamos clicar em Game Object - UI - Image.
Perceba que esse objeto é criado como filho de Canvas
e a primeira coisa que faremos
e mudar para a nossa scene view e afastar o zoom.
E vamos usar os anchors pre-configurados
para esticar essa imagem fazendo ctrl+click (option-click no MacOS).
Vamos configurar a cor para preto.
E chamar de Level Image.
Em seguida vamos criar um objeto de texto
que irá mostrar qual a fase
em que o jogador está
quando começamos o jogo ou mudamos de fase.
Vamos selecionar a imagem
Clicar em Game Object - UI - Text.
Vamos chamar de Level Text.
A primeira coisa que vamos fazer é ancorar a imagem
ao centro da tela, vamos clicar nos anchor presets
e fazer alt-click (option click no MacOS) no preset do centro.
Agora vamos configurar a cor do texto
para branco clicando em Colour
e arrastando até branco.
Vamos configurar o tamanho da fonte para 32.
Perceba que quando fazemos isso o texto desaparece.
Isso acontece porque o texto ficou
muito grande para encaixar na largura
e altura especificadas no rect transform.
Como vamos ter um texto que vai variar
de tamanho mostrando tanto o número da fase e nossa mensagem de fim de jogo
vamos usar a configuração de overflow
horizontal e vertical para permitir que o texto "vaze".
Vamos configurar o overflow horizontal para overflow
e o overflow vertical para overflow também.
Agora nosso texto aparece de novo, vamos também centralizá-lo
na horizontal e na vertical.
Vamos configurar a fonte clicando no asset picker.
E selecionar Press Start.
Essa fonte vem com o projeto.
Finalmente vamos configurar o texto padrão, que vai ser "Day 1".
E isso é suficiente para o texto da fase.
Agora vamos transformar o Level Text num filho de Level Image
dessa maneira quando desativamos Level Image
Level Text também será desativado.
Agora vamos criar o texto para a pontuação.
Selecione o Canvas,
clique em Game Object - UI - text.
Este text nós vamos alinhar com o fundo
da tela no centro.
Vamos clicar no anchor presets
e clicar no preset bottom center
pressionando o botão alt (ou option no MacOS).
Mais uma vez vamos configurar a cor para branco.
Clique em Colour, arraste para white.
Vamos configurar o tamanho da fonte para 24.
Alinha no centro na horizontal e vertical
e configurar o texto default para Food 100.
Vamos configurar a fonte
para PressStart2P-Regular
Perceba que novamente o texto foi cortado.
Vamos configurar os overflows horizontal
e vertical para Overflow.
Vamos chamar o texto de FoodText
e o que nós podemos ver aqui é que o objeto FoodText
está sendo exibido na frente da imagem de título da fase.
Não queremos que isto ocorra então o que vamos fazer
é mover FoodText para mais alto na hierarquia
para que ele fique diretamente embaixo de Canvas.
Isso significa que ele será renderizado atrás
de LevelImage e seu filho LevelText.
A última coisa que vamos fazer é
desativar temporariamente LevelImage
e mover FoodText para cima
só um pouco do fundo da tela.
Vamos fazer isso configurando os anchors.
Vamos configurar Y anchor para 0.05.
Podemos ver que o texto se move na interface
e vamos configurar Max para 0.05 também.
Perca que o texto não se moveu quando fizemos isso.
mas ocorreu um offset de -13 pixels no rect transform.
Vamos configurar a posição Y para 0
e veremos o texto se mover para cima.
Vamos reativar LevelImage
e agora podemos criar o script
para controlar os elementos de interface.
Vamos para o folder Scripts
e abrir o script Game Manager no Monodevelop.
Em seguida vamos adicionar o código que precisamos
no Game Manager para gerenciar a interface
e também para gerenciar a transição entre níveis.
Vamos reiniciar o variável level para 1
para que agora o jogo inicie na fase 1.
A primeira coisa que vamos fazer é adicionar ao script Game Manager
é a declaração de namespace using UnityEngine.UI.
Em seguida vamos adicionar uma variável public float
chamada levelStartDelay.
Esse é o tempo que vamos esperar antes
de mudar de fase, em segundos.
Agora vamos adicionar uma variável private
do tipo Text chamada levelText.
Este será o texto que será exibirá
o número da fase atual que acabamos de configurar
para "Day 1" no editor.
Vamos também declarar uma variável private
do tipo GameObject chamada levelImage.
Vamos usar essa variável para armazenar a imagem LevelImage
para que possamos ativar e desativar a imagem
conforme necessário.
Vamos também adicionar uma variável private boolean
chamada doingSetup que vamos usar para
verificar se estamos criando a fase e evitar
que o jogador se mova durante a criação.
Depois da função Awake vamos adicionar
uma nova função private que retorna void
chamada OnLevelWasLoaded que recebe um parâmetro integer
chamado index.
OnLevelWasLoaded é parte da API da Unity
e é chamada toda vez que uma cena é carregada.
Vamos utilizar essa função para incrementar o número da fase
e chamar a função InitGame
depois que uma fase é carregada.
Vamos usar InitGame para gerenciar
os elementos de UI e configurar cada fase.
Vamos começar configurando a variável doingSetup para true.
Isso significa que o jogador não poderá se mover enquanto
o título da fase é exibido.
Agora vamos obter uma referência
para o objeto LevelImage
usando GameObject.Find.
Aqui vamos procurar por nome, portanto
certifique-se que o nome do seu game object
no editor é exatamente igual ao nome que é passado
a função GameObject.Find.
Vamos fazer o mesmo para LevelText
mas vamos também obter uma referência ao
componente Text.
Em seguida vamos configurar o texto
do objeto LevelText para o número da fase atual.
O texto que estamos configurando será uma string portanto
temos que fornecer a variável "Day " com um
espaço no final e vamos adicionar
o número da fase no final da string,
nesse caso o texto será "Day 1".
Vamos ativar o objeto LevelImage
usando SetActive.
Em seguida vamos declarar uma função private
que retorna void chamada HideLevelImage.
Vamos usar essa função para desativar LevelImage
quando estivermos prontos para iniciar a fase, e vamos chamar
essa função de dentro de InitGame.
Dentro de HideLevelImage vamos desativar
o objeto LevelImage.
E vamos também configurar DoingSetup
para false para que o jogador possa agora se mover.
De volta a InitGame vamos
chamar HideLevelImage
passando LevelStartDelay como o tempo de espera.
Isso significa que enquanto exibimos o título da fase
vamos esperar 2 segundos antes de desligá-lo.
Em Update vamos adicionar uma
verificação de DoingSetup ao if.
É isso que irá evitar que o jogador se mova
caso DoingSetup seja verdade.
Em GameOver vamos mostrar a mensagem para o jogador
dizendo quantos dias ele sobreviveu.
A mensagem vai ser
"After level number of days you starved".
Vamos também ativar nosso fundo preto.
Vamos salvar o script e retornar ao editor.
Em seguida vamos adicionar algumas
linhas de código ao script Player
para que a classe Player possa atualizar o objeto FoodText
conforme o valor muda.
Vamos abrir o script Player no Monodevelop
Em Player vamos também adicionar a declaração de namespace
using UnityEngine.UI.
Em seguida vamos adicionar a variável public
do tipo Text chamada foodText.
Na função Start vamos configurar o valor
de foodText para o valor atual de Food.
Em AttemptMove vamos fazer o mesmo
depois de subtrairmos do placar do jogador.
Vamos também mostrar uma mensagem
quando o jogador pega uma comida
ou soda.
Quando o jogador pega um objeto de comida
vamos mostrar "+ pointsPerFood"
junto com o valor atual do placar.
Vamos fazer o mesmo para soda.
Em loseFood vamos exibir uma mensagem
similar mostrando quantos pontos
o jogador perdeu quando foi atacado.
Vamos salvar o script e retornar ao editor.
No editor vamos configurar uma referência
para o objeto FoodText ao nosso jogador.
Vamos escolher Player
e em seguida vamos arrastar FoodText
para a variável FoodText.
Vamos executar nossa cena e testar.
Podemos ver o título da fase, isso está funcionando.
Quando movemos o jogador o texto com o placar do jogador é atualizado.
Há a espera quando mudamos para uma nova fase.
O título é exibido com o número da nova fase.
Quando o inimigo nos ataca
Nós vemos a mensagem "-10".
Então parece que está tudo funcionando.
Agora que os elementos de UI estão funcionando
no próximo vídeo vamos adicionar
efeitos sonoros e música
e os scripts necessários para o controle dos mesmos.