Página 1 de 1

[GRAF] MapGen - Pt.1

Enviado: Sex Abr 29, 2016 11:02 am
por Tutoriais & Aulas
Autor original: Gongalves
O objetivo do tutorial é ajudar a entender como construir um mapgen num jogo 2D top-down e os conhecimentos podem até servir para outros tipos de generators de estilos de jogos diferentes, espero que consiga ser claro com a explicação.

ARRAYS

Para fazer um mapgen, precisamos criar uma array 2d e "populá-la" com valores, que depois serão usadas como referência para a colocação de tiles. Para quem não conhece como as arrays funcionam, tentarei uma breve explicação: as arrays são variáveis que têm diversos índices (0 a 32000), nesses indíces, podem ser colocados quaisquer valores normais de uma variável. Uma ilustração de array[] de 3 índices (0 a 2):

Imagem

Nesses índices, como dito antes, podemos inserir valores como em variáveis, tendo como nome da nossa array array[] mesmo, poderíamos manipulá-la assim:

Código: Selecionar todos

array[0]=1
array[1]="casa"
array[2]=5.8861
Assim, teríamos como resultado:

Imagem

Já nas array 2D, não temos só uma linha com várias colunas, passamos a ter 0-32000 linhas e 0-32000 colunas, uma array 2D com 3 linhas e três colunas seria representada, ilustrativamente, dessa forma:

Imagem

Podendo, da mesma forma, manipular como na 1D, portando devemos especificar a [linha,coluna] que queremos editar:

Código: Selecionar todos

array[2,0]=32
array[1,1]="casa"
array[0,2]="axasdw"
array[2,2]=4.8
Podemos representar isso com:

Imagem

Para fazer um mapgen usaremos exatamente o mesmo conceito, só que numa array bem maior.

FOR


Para fazer também precisaremos do pesadelo da maior parte da galera aqui: o FOR. :pale:

Para explicar o FOR, antes vou explicar o REPEAT, já que o FOR é um REPEAT mais complexo. O tal REPEAT faz com que um certo código ocorra X vezes diretamente (no mesmo frame de jogo), travando o mesmo se necessário (caso de algoritmos muitos pesados). Um exemplo:

[Create]

Código: Selecionar todos

repeat(5)
{
     show_message("REPEAT")
}
Isso faria essa mensagem aparecer 5 vezes seguidas. Agora, um exemplo mais complexo:

Código: Selecionar todos

var Repeats=0;

//Antes do repeat, nossa var ainda é 0

repeat(5)
{
     show_message("Repeats: "+string(Repeats))
     Repeats+=1
}
Agora mostraremos uma mensagem onde na primeiro teríamos Repeats: 0, na próxima Repeats: 1, e depois Repeats:2, assim por diante...

Agora, se quisessemos criar e preencher uma array 1D de 5 índices, poderiamos fazer o seguinte:

Código: Selecionar todos

var I=0; //var que usaremos da mesma forma que Repeats acima

//Antes do repeat, nossa var ainda é 0

repeat(5)
{
     Array[I]=5
     I+=1
}
Nisso teremos preenchido nossa array até o indíce 4 (ou seja, 5 índices - 0 a 5) com o valor 5:

Imagem

Agora, se fazemos isso, por exemplo:

Código: Selecionar todos

var I=0; //var que usaremos da mesma forma que Repeats acima

//Antes do repeat, nossa var ainda é 0

repeat(5)
{
     Array[I]=I*5
     I+=1
}
Resultado seria:

Imagem

Já que o primeiro slot foi preenchido quando I era 0, e 0*5=0. No segundo slot, I era 1, e 1*5=5. No terceiro slot era 2, e 2*5=10, assim por diante...

Agora o FOR, ele é a simplificação desse sistema aí de cima que fizemos, "traduzindo" pro FOR, teriamos isso:

Código: Selecionar todos

for(I=0;I<5;I+=1)
{
     Array[I]=I*5
}
A primeira parte do for (I=0) nós criamos uma variável, como fizemos antes do repeat acima. Na segunda parte (do meio) nós defnimos a condição pro repeat continuar "rodando": ao invés de definir o número de repeats, no FOR nós definimos a condição pra ele não parar, só isso. No caso acima colocamos I<5, ou seja, enquanto I for menor que 5, o loop continua, logo, começando de 0, teremos nosso repeat acontecendo 5x. A terceira parte é a variável que será acrescido no fim do final, como acima, simplesmente colocamos o I pra aumentar em 1.

Para a gente definir a array 1D, usamos um for, tranquilo, mas para uma 2D, teremos que usar dois FOR casados. Como assim? Um FOR dentro do outro, isso mesmo, assim faremos ele passar por todas as linhas e colunas da array:

Código: Selecionar todos

for(I=0;I<10;I+=1)
     for(J=0;J<10;J+=1)
          Array[I,J]=8
Você pode estranhar de cara isso, sem problema, aconteceu comigo também. Só bem depois de muito usar que fui entender. O resultado é uma array de 10 linhas e 10 colunas, com TODAS as slots preenchidas com o valor 8.

Como aplicar isso tudo num mapgen? Simples. Se criarmos uma array de 10 colunas e 8 linhas (10x8):

Imagem

Na geração, iriamos preencher as slots com valores que definiriam se seria, por exemplo: grama, água, terra ou árvore.

Podemos dar a cada elemento desse um valor:

0: Grama (vou mostrar com a cor base que usei nas demonstrações acima)
1: Água (usarei azul para mostrar as slots de valores 1, de água)
2: Terra (usarei marrom para mostrar as slots de valores 2, de terra)
3: Árvore (usarei azul para mostrar as slots de valores 3, de árvore)

Começariamos criando a array e definindo tudo como grama:

Código: Selecionar todos

for(I=0;I<10;I+=1)
     for(J=0;J<8;J+=1)
          Map[I,J]=0
Usando irandom() num repeat já poderiamos começar a mudar alguns valores por ali, correto? Exemplo:

Código: Selecionar todos

repeat(5)
{
     var Rx=irandom(9) //pegamos um valor de 0 a 9 para usar
     var Ry=irandom(7) //pegamos um valor de 0 a 7 para usar
     
     //Dessa forma, teremos (0-9,0-7), e assim podemos mudar na array

     Map[Rx,Ry]=1
}
Isso de pegar uma linha e coluna e preencher num slot da array vai acontecer 5x, o resultado seria mais ou menos esse:

Imagem

Claro, esse é só um de milhares de possíveis resultados. Com mais um pouco de complexidade já poderiamos transformar nossa array e algo do tipo:

Imagem

Fazendo o que só passei acima dificilmente teriamos um resultado assim com "blocos" de água e terra, mas vou passar uma forma de fazer isso a seguir.

Ficou bem grande já, na próxima parte vou entrar mais com a parte de códigos.

Flw! :)