Projetando e desenvolvendo níveis de jogos 2D com Unity e C#
Avalie esse Tutorial
Se você está acompanhando a série de desenvolvimento de jogos que eu (Nic Raboy) e Adrienne Tacke estamos criando, provavelmente já viu como criar uma loja de perfil de usuário para um jogo e mover um jogador na tela com o Unity.
Para continuar com a série, que também está sendo transmitida no Twitch, estamos em um ponto em que precisamos nos preocupar em criar um nível para o jogo em vez de apenas explorar uma tela em branco.
Neste tutorial, veremos como criar um nível, que também pode ser chamado de mapa ou mundo, usando o C# simples e o Unity Tilemap Editor.
Para ter uma ideia melhor do que planejamos realizar, dê uma olhada na imagem animada a seguir.
Você perceberá que estamos movendo um sprite não animado pela tela. Você pode pensar à primeira vista que o nível é uma grande imagem, mas na verdade são muitos blocos colocados cuidadosamente no Unity. Os blocos de borda têm limites de colisão para evitar que o jogador saia da tela.
Se você está olhando para a imagem dinâmica acima e se pergunta onde oMongoDB se encaixa nisso, a resposta curta é que não se encaixa. O jogo que Adriene e eu estamos construindo aproveitará o MongoDB, mas algumas partes do processo de desenvolvimento do jogo, como o design de níveis, não precisarão de um banco de dados. Estamos tentando contar uma história com esta série.
Há muitas maneiras de criar um nível para um jogo, mas, conforme mencionado anteriormente, usaremos tilemaps. O Unity facilita isso para nós porque o software oferece uma experiência semelhante à pintura, na qual podemos desenhar ladrilhos na tela usando qualquer imagem disponível que carregamos no projeto.
Para este exemplo, usaremos a seguinte folha de textura:
Em vez de criar um novo projeto e repetir as etapas explicadas anteriormente, vamos continuar de onde paramos no tutorial anterior. O arquivoportadash-level.png deve ser colocado no diretórioAssets/Textures do projeto.
Embora não estejamos explorando imagens neste tutorial específico, se você quiser a folha de papéis usada na imagem bonita, faça o download abaixo:
O arquivopipmie.png deve ser adicionado ao diretório Ativos/Texturas do projeto. Para saber como apoiar a folha de atores, dê uma olhada em um tutorial anterior que escrevi sobre o tópico.
Dentro do editor Unity, clique no arquivoportadash-level.png que foi adicionado. Vamos fazer algumas coisas antes de podermos trabalhar com cada bloco como imagens independentes.
- Altere o modo Sprite para Multiple.
- Defina os pixels por unidade reais dos blocos na imagem empacotada de consistência.
- Divida os blocos usando o Editor de Sprites.
Na imagem acima, você pode notar que o valor depixels 255 por unidade é, enquanto os blocos reais são 256. Ao definir os blocos como um ponto menor, estamos tentando remover qualquer borda entre as imagens dos blocos que possa fazer o nível parecer estranho devido ao preenchimento.
Ao usar o Editor de gráficos , certifique-se de fatiar a imagem pelo tamanho da célula usando as dimensões corretas de largura e altura dos blocos. Para maior clareza, os blocos que anexei têm 256x256 de resolução.
Se você planeja usar a spritesheet para o personagem Plummie, certifique-se de repetir as mesmas etapas para essa spritesheet também. É importante que tenhamos acesso às imagens individuais em uma folha de sprites em vez de tratar todas as imagens como uma única imagem.
Com as imagens prontas para uso, vamos nos concentrar em desenhar o nível.
No menu Unity, escolha Componente -> Tilemap -> Tilemap para adicionar um novo mapa de blocos e um objeto de grade principal à palco. Para obter os melhores resultados, vamos querer colocar vários mapas de blocos em camada em nossa cenário. Clique com o botão direito do mouse no objetoGrid 2na cenário e escolha ObjetoD -> Tilemap. Você desejará três mapas de bloco no total para este exemplo específico.
Queremos várias camadas de tilemap porque isso adicionará profundidade à cena e mais controle. Por exemplo, uma camada representará a parte mais distante do nosso plano de fundo, talvez a sujeira ou o piso. Outra camada representará qualquer tipo de decoração que ficará em cima do chão - aay, por exemplo, setas. Então, a camada final do mapa de blocos pode representar nossas paredes ou obstáculos.
Para garantir que as camadas sejam renderizadas na ordem correta, o renderizador de mapa de blocos para cada mapa de blocos deve ter uma camada de classificação definida corretamente. Se continuar com o tutorial anterior, você se lembrará que criamos uma camadaBackground e uma camadaTimeObject. Eles podem ser usados ou você pode continuar a criar e atribuir mais. Apenas lembre-se de que a ordem de renderização das camadas de classificação é de cima para baixo, o oposto do que você experimentaria em softwares de edição de fotos como oAdobe Studio.
A próxima etapa é abrir a janela Paleta de blocos dentro do Unity. No menu, escolha Janela -> D -> Paleta de2 blocos. A paleta estará vazia para começar, mas você desejará arrastar suas imagens uma de cada vez ou várias de cada vez para a janela.
Com imagens na paleta de azulejos, elas podem ser desenhadas na cena como se fossem pinturas em uma tela. Primeiro, clique na imagem do mosaico que deseja usar e, em seguida, escolha a ferramenta de pintura que deseja usar. Você pode pintar azulejo por azulejo ou pintar vários azulejos de uma só vez.
É importante que você tenha o Active Tilemap adequado selecionado ao desenhar seus blocos. Isso é importante devido à ordem em que cada bloco é renderizado e quaisquer limites de colisão que adicionamos posteriormente.
Dê uma olhada no seguinte resultado possível:
Lembre-se, estamos projetando um nível, então isso significa que seus ladrilhos podem exceder a visão da câmera. Use seus blocos para tornar seu nível tão grande e bizarro quanto você quiser.
Supondo que mantivemos a mesma lógica do tutorial anterior, Começando com o Unity para criar um jogo 2D, podemos mover nosso jogador pelo nível, mas o jogador pode exceder a tela. O jogador ainda pode ser uma caixa branca ou o ator Plummie, dependendo do que você escolheu fazer. Independentemente disso, queremos garantir que nossa camada que representa os limites atue como um limite com colisão.
Adicionar limites de colisão a blocos em um mapa de blocos é muito fácil e não requer mais do que alguns cliques.
Selecione o mapa de blocos que representa nossas portas ou limites e escolha Adicionar componente no inspetor. Você desejará adicionar um Tilemap Collider 2D e um Rígidocorpo 2D. O Tipo de Corpo do Rígidocorpo 2D deve ser estático para que a gravidade e outros eventos relacionados à física não sejam aplicados.
Depois de fazer essas etapas curtas, o jogador não deve mais conseguir Go além dos blocos dessa camada.
Podemos melhorar as coisas!
No momento, cada bloco que faz parte do nosso mapa de blocos com os componentes Tilemap Collider 2D e Corpo Rígido 2D tem uma área de colisão completa ao redor do bloco. Isso vale mesmo que os blocos sejam adjacentes e partes do bloco nunca possam ser alcançadas pelo jogador. Imagine ter quatro blocos criando um quadrado grande. Das possíveis 16 regiões de colisão, apenas oito podem ser interagidas. Vamos mudar isso, o que melhorará muito o desempenho.
No mapa de blocos com os componentesTilemap Collider 2D eCorpo rígido 2D,adicione um componente Composite Collider 2 D. Após adicionar, habilite o campoUsado Por Composto no componenteTilemap Collider 2D.
Da mesma forma, há menos regiões que estão rastreando colisões, o que aumentará o desempenho.
No momento, temos nosso jogador, que pode ser um Plummie ou um pixel branco, e temos nosso nível cuidadosamente elaborado feito de peças. O problema é que nossa câmera só pode caber muito na visão, o que provavelmente não é o escopo completo do nosso nível.
O que podemos fazer como parte da experiência de jogo é fazer com que a câmera siga o jogador enquanto ele percorre o nível. Podemos fazer isso com C#.
Selecione a Canon Principal dentro da imagem atual. Vamos adicionar um novo componente de script.
Dentro do script C# que você precisará anexar, inclua o seguinte código:
1 using System.Collections; 2 using System.Collections.Generic; 3 using UnityEngine; 4 5 public class CameraPosition : MonoBehaviour 6 { 7 8 public Transform player; 9 10 void Start() {} 11 12 void Update() 13 { 14 transform.position = new Vector3(player.position.x, 0, -10); 15 } 16 }
No código acima, estamos olhando para a transformação de outro objeto de jogo não relacionado. Vamos anexar esse objeto de jogo em um momento. Sempre que o quadro é atualizado, a posição da câmera é atualizada para corresponder à posição do player no eixo x. Neste exemplo, estamos corrigindo o eixo y e o eixo z, então estamos seguindo apenas o jogador na direção esquerda e direita. Dependendo de como você criou seu nível, isso pode precisar mudar.
Lembre-se de que esse script deve ser anexado à máquina principal ou a qualquer que seja a sua máquina para a imagem.
Lembre-se da variável
player no script? Você o encontrará no inspetor da gravação. Arraste seu objeto de jogador da hierarquia do projeto para esse campo e esse será o objeto seguido pela máquina .A execução do jogo fará com que a câmera fique centralizada no jogador. À medida que o jogador se move pelo nível do tilemap, o mesmo acontece com a câmera. Se o jogador tentar colidir com qualquer um dos blocos que tenham limites de colisão, o movimento será interrompido.
Você acabou de ver como criar um 2mundo D no Unity usando imagens de bloco e o Editor de Mapa de Blocos do Unity. Essa é uma ferramenta muito poderosa porque você não precisa criar imagens massivas para representar mundos e não precisa se preocupar em criar mundos com quantidades massivas de objetos de jogo.
Os ativos que usamos neste tutorial são baseados em uma série que eu (Nic RaBoy) e AdrienhaTacke estamos construindo intitulada Plummeting Persons. Esta série aborda o tópico de criar um jogo multijogador com o Unity que aproveite o MongoDB. Embora este tutorial em particular não inclua o MongoDB, muitos outros tutoriais da série incluirão.
Se você acha que este tutorial pulou algumas etapas, ele pulou. Recomendamos que você leia alguns dos tutoriais anteriores da série para se atualizar.
Se você quiser construir Plummeting Personas conosco, siga-nos no Twitch, onde trabalharemos para criá-lo ao vivo, a cada duas semanas.