Tutorial: Criando terrenos para Cocos2d-x: Introdução à ferramenta Tiled – Parte 4

Uma das coisas que mais tomam tempo na hora de criar o cenário é colocar as bordas de gramas, água, barro ou areia. Saiba que existe uma forma de automatizar isso.

Imagina que legal você selecionar o rio e sair pintando de forma que a própria ferramenta gerencie as bordas para você.

Saibam, meus fiéis leitores, que isso existe.

No último tutorial eu mostrei para vocês como adicionar camadas de objetos no seu mapa. Incluímos diferentes objetos que representavam paredes e início do personagem e separamos esses objetos em diferentes camadas. Nesse tutorial voltaremos a nossa atenção a uma funcionalidade bastante prática do Tiled para criação de cenários: a ferramenta de terrenos.

Definindo informações do terreno

Antes de tudo, vamos criar um mapa novo. Crie um mapa de 20×20 tiles com tiles de 32×32 pixels. Adicione o mesmo arquivo dos tutoriais passados como conjunto de tiles. Se você não viu ou não lembra como se faz isso, faça esse tutorial. Não comece a “desenhar” o terreno já. Primeiramente vamos criar as informações dele.

Figura 1 - Botão que edita as informações do terreno

Figura 1 – Botão que edita as informações do terreno

No lado direito da tela principal, na aba “Tilesets”, clique no botão “Editar Informação do Terreno …”. A Figura 1 mostra a localização desse botão. Todos os tiles existentes no conjunto de tiles são mostrados na janela que abrir. A Figura 2 mostra essa janela.

O que tem de interessante nisso? Ali serão criados os diferentes tipos de terreno que o seu mapa tem. Nesse nosso exemplo temos vários tipos, destacando-se a grama baixa, o barro, a água e a grama alta. Então vamos criar esses terrenos e especificar quais são os tiles de cada um. Você já deve ter percebido que cada terreno tem um tile central todo preenchido, um tile que limita a parte superior, inferior, esquerda e direta, e um tile para cada diagonal. O que vamos fazer é basicamente especificar para o Tiled quais são esses tiles para cada terreno. Let’s play.

Figura 2 - Tela para editar as informações do terreno

Figura 2 – Tela para editar as informações do terreno

Vamos iniciar a brincadeira criando o terreno grama baixa. Para isso, clique no botão “+”, logo abaixo da região branca do lado esquerdo da tela mostrada na Figura 2. Nomeie o terreno como “Grama baixa”. Agora, pessoal, marque quais são os tiles que são referentes à grama baixa. Tente marcar todos os tiles possíveis, marcando certinho cada limite do tipo de terreno. Adicione também os terrenos “Barro”, “Agua” e “Grama alta”. A Figura 3 mostra como eu marquei os limites de cada um desses terrenos.

Figura 3 - Marcação dos diferentes terrenos

Figura 3 – Marcação dos diferentes terrenos

 

Usando os terrenos criados

Acabamos de especificar para o Tiled quais tiles são os limites dos terrenos que criamos. Agora faça o seguinte: clique na aba “Terrenos”, no lado direito da tela principal. Veja que ali estão os terrenos que você criou.

Primeiramente preencha todo o mapa com “Grama baixa”. Só nesse preenchimento, vocês podem perceber que o Tiled variou os tiles de chão, deixando um ambiente menos engessado. Agora selecione o terreno “Agua”, desenhe no cenário e veja a mágica acontecendo. Em questão de segundos eu criei o mapa mostrado na Figura 4. Se você quiser esse mapa, você pode baixá-lo aqui. Essa funcionalidade otimiza muito o tempo do projetista do cenário e a sua paciência também. ;D

Figura 4 - Um exemplo de mapa criado

Figura 4 – Um exemplo de mapa criado

É importante deixar claro que cada terreno precisa ter todos os tipos de limites diagonais, laterais, superiores e inferiores. Veja que o único terreno que tem tudo isso, no nosso exemplo, é a água. Mas já deu para mostrar o exemplo de como usar bem essa funcionalidade do Tiled.

 

Nesse tutorial nós vimos como definir diferentes terrenos para desenharmos nosso cenário. Mostrei como criar cada terreno e como especificar os limites dele no Tiled. Ao final criamos um terreno trabalhoso de desenhar em questão de segundos. No próximo tutorial falarei sobre outra funcionalidade do Tiled que ajuda muito o projetista na hora de fazer um cenário. Essa funcionalidade possibilita criar camadas de tiles e preenchê-las de forma automática, com base em algumas regras pré-definidas. Mas isso deixaremos para frente.

Um grande abraço e nos vemos depois. []

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