Aprendendo a programar jogos em Unity: iniciando a criação de uma área para a aplicação dos medicamentos

Seja bem-vindo(a) ao GameDev: Aprendendo a programar jogos em Unity de hoje! Após comemorarmos a marca de cem encontros em nossa série, é hora de darmos continuidade às atividades práticas para a elaboração de nosso game.

No penúltimo encontro, estivemos configurando a passagem de parâmetros entre os controladores do labirinto e das fases de nosso jogo; agora, com essa comunicação entre scripts devidamente configurada, vamos voltar a construir elementos importantes de nosso consultório, tais como uma área dedicada à concessão de pílulas de saúde aos pacientes acamados.

Se hoje for a primeira vez que você tem contato com conteúdos de nossa série, sinta-se especialmente convidado(a) a juntar-se a nós em uma trilha repleta de aprendizados sobre o universo do desenvolvimento de games. Por meio do uso da plataforma Unity, aprenderemos mais sobre diferentes aspectos do processo de criação de um jogo digital, desenvolvendo, na prática, interessantes projetos de programação.

No momento, estamos trabalhando no projeto de construção do game Consultório do Dr. Tratanildo. Trata-se de um jogo ambientado em um consultório médico tridimensional, cujas características de gameplay prestam homenagem a puzzles e arcades clássicos dos anos 1980 e 1990, tais como Pac-Man (Namco, 1980) e Dr. Mario (Nintendo, 1990).

Não se assuste se, à primeira vista, considerar os tópicos aqui abordados complexos ou de difícil compreensão. Nossa série é pensada para permitir a todos desenvolverem seus próprios jogos e, quem sabe, tirarem do papel os games que sempre sonharam em ver tornarem-se realidade.

Para isso, a partir do primeiro texto da série, são abordadas desde as etapas iniciais do processo, tais como a instalação e configuração da ferramenta Unity em nossos computadores, até etapas consideradas mais desafiadoras, tais como a configuração de elementos multimídia nas fases, as regras e interações que fazem parte da concepção de uma aventura virtual e a codificação de scripts controladores de comportamentos dos elementos de um game. 

Se você gostou dessa ideia, aproveite esta oportunidade e venha conosco nesta divertida jornada de novos conhecimentos e, claro, de muita diversão!

Relembrando a coleta das pílulas

Embora já tenhamos configurado métodos para a criação e o posicionamento de obstáculos e de agentes de doenças aos labirintos que representarão cada um dos pacientes de Tratanildo Doencita, um detalhe muito importante ainda precisa ser devidamente alinhado para prosseguirmos com a montagem das estruturas de nosso game: como iremos fornecer as pílulas de saúde ao “enfermo da vez”?

Apesar de termos reservado variáveis em ControllerFase e em MontaLabirinto que determinam a posição inicial de aparecimento das pílulas dentro do labirinto, na estrutura física do consultório não temos nenhum indicativo de onde poderemos fornecer os medicamentos aos pacientes antes de controlarmos o maquinário responsável pelas inclinações, que, finalmente, levarão os fármacos ao encontro dos agentes de doenças dentro do corpo de cada paciente.

Tendo isso em mente, vamos reservar uma pequena parte do cenário (bem em frente ao leito do paciente) para que, assim que o médico se posicione nessa localização, uma opção surja em tela, permitindo ao jogador conceder os medicamentos que estejam nas mãos de Tratanildo ao paciente deitado no leito.

Vamos, então, abrir nosso projeto para edição. No Unity Hub, clique duas vezes sobre o item referente ao projeto Consultório do Dr. Tratanildo. Na interface inicial do editor, na aba Project, abra a pasta Assets, Scenes e, por fim, clique duas vezes no ícone da cena ConsultorioScene.

Inicialmente, vamos recordar alguns aspectos sobre como são coletadas as pílulas no cenário. Na aba Hierarchy, selecione o objeto Pilula_azul, subordinado a PilulasCenograficas (que, por sua vez, encontra-se subordinado a CenarioFixo).

Após selecionar o objeto, na aba Inspector note que a coleta da pílula azul ocorre por intermédio de um componente Pega Pilula e de um Box Collider (em modo Trigger).

Caso os contornos do Box Collider não sejam visíveis na exibição da aba Scene, clique sobre o botão Gizmos, destacado em vermelho na imagem a seguir.

Além dos componentes atrelados ao GameObject em questão, a coleta da pílula também depende da interação do personagem com opções que são exibidas em tela pelo controlador da barra inferior do Canvas. Na aba Hierarchy, selecione o objeto BarraInferiorInfo, subordinado ao objeto Canvas, e note, via aba Inspector, a presença do componente Controller Barra Inferior.

A ideia para a concessão das pílulas ao paciente envolverá uma abordagem semelhante a essa que analisamos agora: utilizando um GameObject no cenário que tenha atrelado a si um Collider em modo Trigger, haverá a detecção da presença de Tratanildo no local designado e a opção para fornecimento da pílula ao enfermo será exibida em tela, por intermédio do controlador da barra inferior do Canvas.

Posicionando o GameObject em cena

O primeiro passo envolverá a criação e o posicionamento do objeto em cena responsável pela detecção da presença do médico no local adequado. Para tal, na aba Hierarchy, clique com o botão direito sobre o GameObject CenarioFixo. No menu suspenso apresentado, selecione a opção Create Empty.

Conceda o nome “AreaEntregaPilulas”, sem as aspas, ao novo objeto criado. Selecione-o e, via aba Inspector, altere os valores relativos aos atributos de seu componente Transform conforme indicado a seguir:

• Position X = 10, Y = 1.5, Z = -18;
• Rotation X, Y e Z = 0;
• Scale X, Y e Z = 1.

Para permitir ao jogador saber em que posição ele deve direcionar Tratanildo para dar sequência ao tratamento do paciente, inseriremos um indicador visual na posição de AreaEntregaPilulas. Esse indicador será bidimensional, embora inserido dentro de um ambiente 3D.

Ainda com o GameObject selecionado, na aba Inspector, clique sobre o botão Add Component e adicione um componente do tipo Sprite Renderer.

Quem nos acompanha desde a elaboração dos projetos anteriores já teve a oportunidade de experimentar o uso do componente Sprite Renderer no desenvolvimento de jogos 2D. A “novidade”, agora, vai ser a aplicação de um elemento gráfico bidimensional em um cenário estritamente 3D, dando um toque especial à ambientação de nosso consultório.

Ainda na aba Inspector, em relação ao atributo Sprite do componente recém-atrelado ao objeto, referencie a seu campo o sprite de nome “coracao”, conforme exemplificado pela imagem a seguir:

Por fim, adicione ao GameObject AreaEntregaPilulas um componente do tipo Sphere Collider, modificando os seguintes valores de seus atributos:

• Is Trigger: conceda o valor verdadeiro ao campo (true);
• Radius: conceda o valor 2.75.

Animação “à moda antiga”

Note que, sob determinados ângulos de câmera, a visualização do coração cenográfico fica prejudicada, justamente por tratar-se de uma imagem bidimensional. Para reduzir esse impacto visual, iremos animar o objeto, fazendo com que o coração gire constantemente em cena.

A adoção do Sphere Collider, em detrimento de outros tipos de Collider anteriormente utilizados (como o Box Collider, por exemplo), deve-se justamente por essa questão, visto que a rotação de um objeto não interferirá na área de alcance de um Collider esférico.

Ainda com AreaEntregaPilulas em evidência, na aba Inspector, adicione um componente do tipo Animation.

O componente Animation é um controlador legado de animação do Unity. Para a maioria dos casos de uso, o componente mais recente (Animator) é o mais recomendado, pois dá suporte aos fluxos de animação e outros atributos avançados; porém, é interessante aprendermos um pouco sobre seu funcionamento para que, caso venhamos a analisar algum projeto Unity mais antigo, sabermos como a animação está sendo aplicada a um objeto.

Agora, na aba Project, acesse as pastas Assets, Multimedia, 3D e, por fim, Animacoes. Clique com o botão direito sobre uma área vazia da pasta e, no menu suspenso, selecione a opção Create e, em seguida, Animation, conforme exemplificado pela imagem a seguir:

Conceda o nome “anim180graus” à nova animação criada. 

Como trabalharemos com um componente legado, é necessária a realização de um ajuste adicional, antes de continuarmos a editar a animação e os atributos do componente atrelado ao GameObject.

Selecione anim180graus e, na extremidade direita da aba Inspector, clique sobre o ícone superior de opções (três bolinhas, destacado em verde na imagem a seguir) e, no menu suspenso, selecione a opção Debug:

Deixe a opção Legacy selecionada, volte a clicar sobre o ícone superior de opções e retorne à visualização Normal:

De volta à visualização normal, note que as opções foram reduzidas, devido ao fato de estarmos utilizando uma animação em modo legado. Vamos aproveitar a oportunidade para modificar o valor do parâmetro Wrap Mode para Loop, auxiliando, posteriormente, na repetição de execução da animação ao término de seu ciclo.

Na aba Hierarchy, volte a selecionar AreaEntregaPilulas. Na aba Inspector, em relação a seu componente Animation, realize as seguintes intervenções:

• Atributo Animation: indique a animação anim180graus a seu respectivo campo;
• Caso o atributo Animations não receba automaticamente como primeiro valor a nova animação, modifique o tamanho de seu vetor para 1 e, em seguida, em relação a seu Element 0, também indique a animação anim180graus;
• Play Automatically: conceda ao atributo o valor verdadeiro (true).

Será necessário abrirmos a animação para edição por intermédio da entrada designada no novo componente. Isso é importante para que, na janela de edição que for aberta, possamos editar atributos do objeto AreaEntregaPilulas. Portanto, clique duas vezes sobre anim180graus presente na caixa de seleção do atributo Animation, conforme indicado na imagem a seguir:

Na janela de edição de animações que for exibida, clique sobre o botão Add Property. Em seguida, selecione a opção Transform e, por fim, clique sobre o símbolo de adição (+) ao lado da propriedade Rotation.

Como o nome do novo elemento inserido já sugere, a animação basicamente envolverá a rotação em 180 graus do objeto. Embora uma rotação completa envolva 360 graus, como a imagem do coração é simétrica, meia-volta já nos bastará, visto que a animação será repetidamente executada.

O primeiro passo envolverá determinarmos o valor inicial de rotação no eixo Y para o objeto em questão. Para o frame 0 (verifique o campo destacado em verde na imagem a seguir), o valor de Rotation.y também deverá ser zero:

Já para o frame 60 (altere o valor do campo destacado em verde na imagem a seguir), concederemos o valor 180:

Em princípio, a animação já estaria pronta, porém, devido à natureza do que pretendemos aplicar ao objeto (uma rotação contínua, sem oscilações na velocidade), teremos de realizar duas modificações adicionais à animação.

Ao clicarmos sobre o ícone do botão Play da janela Animation, uma prévia da rotação será exibida diretamente na visualização do objeto na aba Scene. Note que o Unity aplica uma suavização da movimentação no início e no final da animação:

Interrompa a simulação da animação, clicando novamente sobre o ícone do botão Play. Selecione o losango que representa a entrada do frame 0 da animação (destacado pela seta, na imagem a seguir), clique com o botão direito sobre ele e, no menu suspenso, selecione a opção Auto. 

Repita a operação, desta vez selecionando o losango que representa a entrada do frame 60 (também indicado por seta, na imagem a seguir).

Efetuando essas alterações, o Unity entende não ser necessária a atenuação da animação em seus extremos, deixando a animação bem mais fluida, como podemos notar ao simularmos a animação novamente:

Finalize a simulação da animação para realizarmos uma simulação geral da execução do jogo. Para tal, vá até a aba Game e clique sobre o ícone do botão Play:

Após interromper a simulação da execução do game, não se esqueça de salvar a cena (menu File, opção Save) e o projeto (menu File, opção Save Project) antes de fechar o editor do Unity.

Próximos passos

Por meio do posicionamento de um objeto cenográfico indicativo da posição de concessão das pílulas aos pacientes, pudemos experimentar um pouco das possibilidades de inserção e animação de objetos 2D dentro de ambientes tridimensionais.

Em breve, daremos sequência ao processo de configuração do novo elemento, por meio da criação e da edição de scripts controladores responsáveis pela concessão das pílulas aos pacientes.

Nosso próximo texto já encontra-se disponível, continue conosco nessa jornada de conhecimento e fique ligado sempre aqui no GameBlast!

Revisão: Ives Boitano