Tutorial: Desenvolvendo um jogo de guiar bolinha em labirinto – Parte 1: Conceito e física aplica

Vimos várias técnicas de programação de jogos, mas programamos poucos deles com Cocos2d-x, para não dizer nenhum.

Essa próxima sequência de tutoriais será destinada ao desenvolvimento de um game, baseando-se no já vimos até agora.

Bora fazer o nosso primeiro jogo em Cocos2d-x e Box2D?

No último tutorial vimos como incluir música de fundo e efeitos sonoros nos jogos. O próprio Cocos2d-x já gerencia de forma automática a música de fundo e os efeitos sonoros, bastando iniciar os comandos de som quando bem entendermos.

Nesse tutorial nós daremos início ao desenvolvimento de um jogo bastante baixado há um tempo atrás, quando os acelerômetros começaram a se tornar elementos básicos nos aparelhos. Uma versão bastante conhecida desse jogo é o aTilt (créditos a FridgeCat Software), possível de ser baixado também no Google Play.

 

Conceito do jogo

Imagine você estar segurando em suas mãos um minilabirinto. Em algum lugar desse labirinto tem uma espécie de um buraco que, se uma bola de aço cair nele, ela ficará retida nesse lugar. Em um outro lugar desse labirinto é jogada uma bola de aço. O objetivo é levar a bola de aço ao buraco o mais rápido possível sem encostar nela, apenas angulando o minilabirinto com as mãos para fazer a bola correr para o lugar desejado. A Figura 1 mostra uma imagem do jogo aTilt.

Figura 1 - Jogo aTilt sendo executado

Figura 1 – Jogo aTilt sendo executado

Quando você angula o seu aparelho para frente, por exemplo, a bolinha de aço corre para cima. Você precisa levá – la até a canaleta correta, apenas angulando o seu aparelho celular. Note que será necessário utilizar os acelerômetros do aparelho.

 

Física de movimentação da bola

Quando falamos de física, vem automaticamente à cabeça aquele motor físico que eu apresentei a vocês: o Box2D. Utilizaremos o Box2D para obtermos um resultado legal sem precisar programar muito. Se você não viu ainda como programar com o Box2D, aconselho fortemente você a desempenhar a sequência de tutoriais sobre Box2D, partindo desse. Apesar de utilizarmos o Box2D, precisamos saber como funciona o básico da física por trás do jogo que estamos prestes a iniciar a programação. Agora você verá uma aplicação legal daquela física que você aprendeu no segundo grau. ;D

Vamos iniciar pela sequência lógica mostrada na Figura 2. Inicialmente temos o aparelho celular inclinado cerca de 30 graus em relação ao chão. Isso significa que a bolinha está em um labirinto inclinado da mesma forma. Essa bolinha (verde) está sofrendo ação da força de gravidade, ilustrada pela seta azul. Pelo fato da força ser uma grandeza vetorial, ela pode ser decomposta na soma de duas outras forças, essas ilustradas pelas setas laranja e verde. A seta laranja é perpendicular ao plano formado pelo celular, isso significa que ela não gera qualquer ação na bola verde. Apenas a força ilustrada pela seta verde que gera uma movimentação na bolinha, pelo fato dela ser paralela ao plano do celular. Então, basta encontrar o valor dessa força verde para podermos aplicá-la na bolinha e vê – la andando sobre o plano do celular.

Figura 2 - Força aplicada na bolinha de aço

Figura 2 – Força aplicada na bolinha de aço

Utilizando trigonometria, podemos calcular a força verde pela fórmula apresentada no final da sequência lógica mostrada na Figura 2, onde F é a força que será aplicada na bolinha e g é a força da gravidade. A força da gravidade podemos encontrar facilmente como sendo o valor da massa da bolinha verde multiplicado pelo valor da velocidade da gravidade, que utilizaremos como sendo igual a 9,78 m/s².

Resumindo, para encontrarmos a força que põe a bolinha em movimento, precisamos apenas da angulação do celular em relação ao chão e a massa da bolinha verde. A massa da bolinha será adquirida do próprio motor do Box2D, após criarmos um objeto rígido que representa a bolinha de aço. A angulação, será adquirida dos acelerômetros do celular. Não é tãaao complicado assim, né? ;D

 

Criando o projeto do jogo

Hoje não chegaremos a implementar essa física. Apenas apresentei uma introdução para vocês saberem mais ou menos o que faremos no próximo tutorial. Nesse, apenas criaremos um novo projeto e tiraremos o que não nos importa do Hello World padrão do Cocos2d-x.

Figura 3 - Criando um projeto Cocos2d-x

Figura 3 – Criando um projeto Cocos2d-x

Crie um novo projeto em Cocos2d-x com nome de pacote “com.Santy.Labirinto” e coloque o nome do projeto como “Labirinto”. A Figura 3 mostra os nomes ao criar um projeto. Se você não lembra ou não sabe como criar um projeto de Cocos2d-x, veja nesse tutorial. Após criado o projeto, apague a imagem de fundo padrão do projeto Hello World do Cocos2d-x. Para isso, entre na pasta “Resources” e apague o arquivo “HelloWorld.png”. A partir de agora ele será inútil.

Abra o arquivo “HelloWorldScene.cpp” e apague essas linhas de código:

/////////////////////////////

// 3. add your codes below…

// add a label shows “Hello World”

// create and initialize a label

CCLabelTTF* pLabel = CCLabelTTF::create(“Hello World”, “Thonburi”, 34);

Agora, apague todas as linhas de código partindo dessas (inclusive elas):

// position the label on the center of the screen

pLabel->setPosition( ccp(size.width / 2, size.height – 20) );

até essa (inclusive ela):

this->addChild(pSprite, 0);

Se você compilar agora, não aparecerá nada na tela. Apenas limpamos os códigos que não eram necessários para prepará-los para os próximos tutoriais.

Vimos nesse tutorial o conceito de um game que implementaremos em uma série de tutoriais. Mostrei para vocês alguns conceitos de física que serão utilizados no próximo tutorial. Veremos como incluir uma bolinha de aço no ambiente e como fazê-la andar de um lado para o outro, conforme a angulação dos acelerômetros do celular.

Por hoje é isso pessoal, nos vemos no próximo tutorial. []s

Santiago Viertel

Santiago Viertel

Formado em Bacharelado em Ciência da Computação (UDESC), mestre e doutorando em Análise de Algoritmos (UFPR). Foi programador da Céu Games por 8 anos. Possui a preferência por jogos de estratégia e de tiro em primeira pessoa. Jogando bastante DotA 2, Left 4 Dead 2 e Age of Empires II HD.

Send this to a friend