[Tutorial] Básico ao avançado - Movimentação avançada 2D

Olá!
Como é um assunto mais "básico", preferi não fazer um vídeo sobre isso, irei tentar postar esse tópico nas redes sociais também, com o intuito de atualizar o conteúdo do fórum e convidar novos membros
OBS. Não irei usar "gravity", nem "vspeed", nem "hspeed", nem "move_contact_solid", irei fazer tudo isso manual  
Porém, os códigos serão bem otimizados e pequenos, deixando a programação mais fluída e aprova de bugs, o tutorial ficou grande porque estou explicando detalhe por detalhe. VAMOS LÁ ENTÃO

Plataforma: Game Maker Studio 2.0
Dificuldade: Intermediário/Avançado (depende do ponto de vista)
Calma, se você for iniciante, irei ensinar do BÁSICO ao AVANÇADO

Nesse tutorial, vou ensinar uma movimentação mais avançada, pra você que já é experiente no GameMaker, talvez seja uma linha mais "básica" de conceitos.
Porém irei explicar cada detalhe, pois quero que você saia daqui SABENDO como fez tudo, e não apenas copiando e colando  

Motivos para aderir à essa movimentação no 2D: Colisão perfeita, movimento limpo, aprova de bugs

Iremos:

• criar uma colisão perfeita
  
• criar um movimento limpo
  
• criar gravidade usando coordenadas
  
• movimento de Plataforma e de Topdown (RPG)
  
• deslize ao movimentar (a velocidade abaixar e aumentar até chegar na velocidade máxima)
  

Então vamos começar.





Irei dar uma breve introdução sobre o que vou usar durante esse tutorial, embora não seja o foco, é importante entender as estruturas e funções para que os códigos que serão ensinados sejam fáceis e simples de serem manipulados. Lembrando que não é o foco do tutorial, caso queiram se aprofundar, posso fazer tutoriais sobre isso futuramente mais "afundo".

Estruturas de repetição

A primeira coisa que é importante entender, é a que vamos mais usar, que é a estrutura de repetição "While". Irei usar "Repeat" também, mas é mais simples, então pra ser mais dinâmico, iremos usar os dois. Mas simplificando, daria pra usar qualquer um dos dois, só de um, ou só do outro, ou até meso "for", basta usar da maneira correta, mas como o foco do tutorial não é esse, irei dar apenas uma breve explicação.

Mas enfim, como funcionam as estruturas de repetição?
De forma bem rápida, já que não é o intuito do tutorial, é simplesmente um código que se repete até que as condições sejam cumpridas no mesmo frame.

Como assim frame?:

exemplificando uma estrutura de repetição, vou dar um exemplo prático.


POSICAOX = 100;

ENQUANTO ( POSICAOX < 500 )
{ POSICAOX +=1; }

simplificando, minha posição inicial é 100, enquanto ela for menor do que 500, ela vai acrescentando 1 até chegar em 500, ou seja, vai repetir o código 400 vezes no mesmo frame (é muita coisa né?), isso significa que gasta mais memória, que é como se estivesse escrevendo o código 400 vezes.

Quer testar? então abra seu game maker, crie um objeto com uma sprite qualquer, e coloque ele em qualquer lugar na room. Agora coloque o seguinte código no create do objeto:

Código:

x = 100;
y = 100;

Agora no Step, coloque o seguinte código:

Código:

while( x < 500 ) { x+=1; }

O engraçado, é que assim que você executa o jogo, seu objeto fica na coordenada horizontal de 500, nem dá pra ver ele se movendo, porque acontece isso tudo em 1/60 segundos   . Ok, já que já deu pra entender o funcionamento do "while", o "Repeat" é bem mais simples de usar, basta eu especificar quantas vezes eu quero repetir o código, por exemplo:

Código:

repeat(500-x) { x+=1; }

Basicamente faz a mesma coisa que o código acima, se x for 100, irá repetir o código 500 - 100 vezes, ou seja, 400 vezes.

Funções numéricas

Agora, vamos passar umas funções numéricas que vamos usar:

Código:

abs(x)
sign(x)
clamp(x,valorminimo,valormáximo)

(irei fazer um tutorial focado só em funções númericas depois. Mas agora vou dar uma breve explicação)
o "abs" transforma qualquer valor em positivo, e o "sign" transforma qualquer valor em -1, 0 e 1, por exemplo:

Código:

valor = -100;
variavel = abs(valor);

o valor da "variavel" nesse caso, retorna "100".

Código:

valor = -100;
variavel = sign(valor) //retorna -1
valor2 = 100;
variavel2 = sign(valor2) //retorna 1

agora o "clamp" serve pra limitar o valor em mínimo, e máximo, exemplo:

Código:


//create
velocidade = 0;
//step
velocidade = clamp(velocidade, -10, 10)
velocidade + = 1 //ira acrescentar até ser 10

Finalmente, vamos começar nosso projeto
Nesse projeto, iremos usar uma sprite para o bloco, uma sprite para o personagem, um objeto para cada, e um script, então deve ficar mais ou menos assim:





No create do nosso personagem (O_player), vamos declarar as seguintes variáveis:

Código:

maxvel = 5; // isso irá definir a velocidade máxima do nosso personagem
jumpforc = 13; // com isso, iremos definir a força do pulo
grv = 0.5; // a força da gravidade
frict = 0.5; // será a intensidade do deslize
v_sp = 0; // apenas declarando a variável de velocidade vertical, a qual será usada para o pulo, movimento vertical, e gravidade
h_sp = 0; // declarando a velocidade horizontal


Porque no CREATE?:

Bom, agora chegamos a um ponto importante, iremos criar as nossas primeiras checagens, que são bem simples por sinal, no "Step" do personagem.

Porque no STEP?:

Primeira: verificando o chão

Vamos agora criar uma variável chamada "chao", que vai funcionar pra verificar se nosso personagem está pisando em um chão, serve mais para o movimento em plataforma, vamos lá então:

Código:

chao = place_meeting(x,y+1,O_block);

Explicação:

Então, declaramos que o tempo todo, o "chao" é IGUAL á colisão com o O_block abaixo do nosso personagem, se houver um bloco em baixo do nosso personagem, a função irá retornar 1 (true), se não houver, vai retornar 0 (false)

Segunda: verificando as teclas

Agora vamos criar as variáveis de controle do nosso personagem, que são as teclas que irão controlar nosso personagem.

Código:

lr = keyboard_check(vk_right) - keyboard_check(vk_left); //declarei que é IGUAL á tecla direita menos a tecla esquerda, ou seja, se eu pressionar VK_RIGHT, será 1, se eu pressionar VK_LEFT, será -1, se eu pressionar as duas, sera 1 - 1, ou seja, 0.
ud = keyboard_check(vk_down) - keyboard_check(vk_up); //o mesmo conceito, será usado para topdown.
jumpkey = keyboard_check_pressed(vk_up); //simplesmente reduzi o código, pra não precisar escrever toda vez "keyboard_pressed(vk_up)...

Bom, até então está pronto, vamos ENFIM para o script de movimentação.




Bom, decidi fazer esse tópico como um subtópico porque pode ser complexo de entender à primeira vista.
Vamos colocar o seguinte código logo após o código acima:

Código:

h_sp += ( frict * lr );
//v_sp += ( 0.5 * ud );    //OBS: Use isso apenas para movimento TOPDOWN ou RPG, como a primeira parte é plataforma, vamos deixar como comentário.

//caso queira testar para TopDown, retire o código abaixo
if !(chao) { v_sp += grv; } else {v_sp = -jumpforc * jumpkey; } // se eu não estiver no chao (repare o símbolo ! antes dos parênteses pra simbolizar o "NÃO") eu acrescento o valor da gravidade na velocidade vertical, se não, minha velocidade será a velocidade negativa do pulo caso eu pressione a tecla de pulo, e ao pular, eu vou estar no ar, ou seja, não vou estar mais no chão pra poder pular, isso já reduz 6 linhas de código

 
BRUNO_RIBEIRO, PORQUE VOCÊ TÁ CRESCENDO O VALOR DA VELOCIDADE SEM PARAR?  

Explicação:

Mas espera, você não está se confundindo Bruno_Ribeiro? Friction é atrito, ou seja, seria o contrário de aumentar a valocidade lentamente, seria reduzir a velocidade lentamente! Sim! Mas vamos fazer o inverso também, vamos fazer ela aumentar lentamente.





Lembra do script que criamos lá em cima? (na parte 1.5), então, o script "MOV"? iremos para ele agora, no GameMaker Studio 2.0, temos a vantagem de usar os scripts como "funções", deixando mais fácil e mais organizado nosso projeto, então vamos abusar desse recurso

vamos usar "function" para criar nosso script dentro do script "mov", declare os seguintes argumentos:

Código:

function xmov(velvar, solidobj) //velvar será uma variável temporária que criamos para jogar nossa variável de velocidade horizontal (h_sp), e o "solidobj" será o nome do objeto de colisão, no caso, como na imagem da parte 1.5, o O_block
{


}

Vamos criar um algoritimo em português (nossa linguagem) pra definir o que vamos fazer:

quero fazer uma checagem de comparação, vou criar uma variável com o valor 0 pra comparar com o valor atual da velocidade,
enquanto essa variavel for menor que minha velocidade atual, vou executar o comando a seguir, e logo após vou acrescentar o valor de 1 na minha variável, e quero que o comando seja repetido, até o valor ser igual.
o comando é:
se não houver em 1 pixel no lado a qual estou me movendo, o objeto solido, eu me movo 1 pixel para frente

ou seja, se minha velocidade é 100, e estou me movendo pra frente, vou verificar 100 pixels a frente (um por um) pra ver se tem o objeto solido, se houver eu paro, se não, eu continuo, se eu me mover pra trás, a mesma coisa.

TÁ ME CONFUNDINDO BRUNO_RIBEIRO, COMO FAÇO ISSO NO GAME MAKER?
Calma, calma, jovem jovem padawan, com o seguinte código:

Código:


 var i = 0;//criando uma variável temporária pra servir de checagem
 var i2 = sign(velvar);//verificando pra qual lado estou me movendo, independente da velocidade (se for -501293409123, vai retornar -1, mas não coloque essa velocidade que o jogo buga)
 
 while(i<abs(velvar)) //enquanto i (que é 0) for menor que minha variável de velocidade (no caso h_sp)
 {
 if !(place_meeting(x+1*i2, y, solidobj)) //verifico se NÃO tem um objeto no pixel +1 vezes o lado que estou me movendo, ou seja, se o lado for -1, será 1 * -1, que retorna -1.
 {
 x+=1*i2; //eu me movo um pixel para frente ou para trás
 } else { h_sp = 0; } //se não minha velocidade se torna 0.
 i ++; //acrescentamos o valor de 1 na variável temporária que criamos pra ela se aproximar da velocidade atual.
 }


final dessa função:

usando a MESMA LÓGICA, para o movimento vertical (sério, a mesma)
podemos fazer o seguinte código logo abaixo:

Código:

function ymov(velvar, solidobj)
{
 var i = 0;
 var i2 = sign(velvar);
 while(i<abs(velvar))
 {
 if !(place_meeting(x, y+1*i2, solidobj))
 {
 y+=1*i2;
 } else { v_sp = 0; }
 i ++;
 }
}

a única diferença, é que no lugar de trabalhar com o X, estou trabalhando com o Y, verifiquei no Y, me movi no Y, usei a variável de V_SP.


Agora, vamos colocar isso no nosso objeto player




voltando no STEP do nosso personagem, vamos colocar o seguinte código logo no final, depois de todos os outros códigos:

Código:

xmov( h_sp, O_block );
ymov( v_sp, O_block );

Aqui, basicamente eu só adicionei os códigos que criamos no nosso personagem, agora, vamos criar a "FRICTION", isso é, vamos fazer a velocidade abaixar lentamente.
Para isso, vamos criar uma nova função lá no nosso script "Mov", essa função irá retornar um valor, como "i = funcao()", após fazer declaramos, então, prosseguimos com o seguinte código:

Código:

function Fric(force, var_speed){ //novamente, iremos chamar a função lá no nosso código com esses argumentos, force, que é a força do friction, que vamos colocar "frict/3", porque pra nosso personagem não ficar travado no chão, nossa friction deve ser menor do que a velocidade que ele ganha ao se mover.

 var i1 = sign(var_speed); //criei uma variável temporária pra saber QUAL lado eu estou me movendo
 repeat(force*100) //vou repetir 100 vezes a força, no caso, minha força é 2.5 (5 / 2), ou seja, vou repetir esse código 250 vezes (uau)
 {
 if !(var_speed == 0) //se a variável de velocidade que atribuí lá em cima for diferente de 0, vai executar o código
 {
 
 switch(i1)  //SWITCH é a mesma coisa que eu ficar repetindo vários "IF", só que resumido, traduzindo isso aqui seria tipo "if (i1 == -1) {var_speed +=1;}", e o mesmo pra caso for -1
 {
 case -1: var_speed +=0.01; break; //se for -1 (ou seja, se a velocidade de movimento for negativa) irá acrescentar 0.01, até chegar em 0
 case 1: var_speed -=0.01; break; //se for 1, irá diminuir 0.01, até chegar em 0.
 }
 
 }
 if abs(var_speed)<=force {return 0;} //isso é importante, caso minha velocidade for menor que minha força, pode ocorrer de bugar e se mover bem devagar, então colocamos isso pra retornar o valor de 0 para a velocidade.
 }
 return var_speed; // retorna o valor atual para a velocidade
}

Deixei esse por último pois acho ele um pouco mais HARD de explicar, mas com todos os conceitos acima aprendidos, fica mais simples

Então, vamos definir esse valor para nossa variável de movimento.
voltando no step do nosso personagem, colocamos logo abaixo desses códigos:

Código:


h_sp += ( frict * lr );
//v_sp += ( 0.5 * ud ); //topdown
h_sp = clamp(Fric( frict/3, h_sp ), maxvel*-1, maxvel)
//v_sp = clamp(Fric( frict/3, v_sp ), maxvel*-1, maxvel) //topdown


basicamente aqui estou declarando que o valor da minha "h_sp" (ou "v_sp" para topdown) é igual ao script Fric(frict/3, h_sp), que retorna para nós o valor de h_sp, acrescentando ou reduzindo do valor da "friction" que criamos, limitado á máxima velocidade  (-5 e 5)


UFFA! ATÉ QUE EM FIM
Acredite, demorou mais pra eu fazer do que pra vocês lerem kkkkkk, tentei detalhar o máximo possível, e eu espero que não tenha esquecido de nada, pra vocês testarem agora, podem colocar no script do personagem no step, em qualquer lugar:

Código:

if keyboard_check(ord("Z")){maxvel = clamp(get_integer("speed value","5"),1,1000);}
if keyboard_check(ord("X")){jumpforc = clamp(get_integer("jump value","15"),1,500);}
if keyboard_check(ord("C")){frict = clamp(get_integer("friction value","0.5"),0.1,500);}

Obs. O código acima é apenas para testar valores diferentes, durante a execução do projeto, esse script serve para você alterar o valor da força do pulo (pressionando X), a força do deslize (pressionando "C") e a velocidade (pressionando "Z"), observem que coloquei um valor mínimo e um valor máximo utilizando o "clamp", pra limitar o valor pra não crashar o jogo (lembre que toda checagem é feita usando repetições, se o valor de repetição for muito alto, vai sobrecarregar o projeto, e sem motivos, porque chegando em um valor perto de 500, já fica invisível o movimento de tão rapido).


Obrigado pela atenção! PEÇO que mesmo se você não aprendeu nada aqui, me deem feedback, isso vai me incentivar a melhorar e a continuar com os tutoriais, qualquer coisa que não gostaram ou que acharam mal explicado podem falar também, estou aberto À críticas


Caso queiram ignorar meu tutorial e só queiram o arquivo editável:
Baixar

@Bruno_Ribeiro, parabéns pelo ótimo tutorial! Sem dúvidas, vai ajudar muito as pessoas que estão iniciando, principalmente por trazer conceitos mais atualizados (não conhecia a função clamp, utilizava ainda min(max(x, vmax), vmin) ) mas é bom ver um bom conteúdo assim! Bem explicado e detalhado, e ainda aplicável tanto para o top-down como para o plataforma. Obrigado pelo empenho e dedicação em repassar conhecimentos, você e nota 10

Parabéns pelo tutorial e parabéns pela iniciativa, ele está muito bem escrito e já capturando alguns pontos que alguém poderia não entender!

Código:

get_integer("speed value","5"),

Fiquei com um pouco de dúvida dessa função, além da questão dela usar uma string literal para referenciar talvez uma variavel, algo que dependendo a comlexidade do projeto, pode começar a ficar ruim de codar, fácil de perder as coisas.

theguitarmester escreveu:Parabéns pelo tutorial e parabéns pela iniciativa, ele está muito bem escrito e já capturando alguns pontos que alguém poderia não entender!

Código:

get_integer("speed value","5"),

Fiquei com um pouco de dúvida dessa função, além da questão dela usar uma string literal para referenciar talvez uma variavel, algo que dependendo a comlexidade do projeto, pode começar a ficar ruim de codar, fácil de perder as coisas.

Opa, valeu! 
Realmente não expliquei essa parte, embora fosse só pra fazer testes, não faz parte em si do projeto, chegando em casa edito e coloco uma explicação sobre isso 

TRFN escreveu:@Bruno_Ribeiro, parabéns pelo ótimo tutorial! Sem dúvidas, vai ajudar muito as pessoas que estão iniciando, principalmente por trazer conceitos mais atualizados (não conhecia a função clamp, utilizava ainda min(max(x, vmax), vmin) tongue ) mas é bom ver um bom conteúdo assim! Bem explicado e detalhado, e ainda aplicável tanto para o top-down como para o plataforma. Obrigado pelo empenho e dedicação em repassar conhecimentos, você e nota 10! 

Obrigado, o intuito é esse mesmo

A função clamp é muito útil, só não me lembro de qual versão do GM ela foi implementada

uma pergunta relacionado ao código do pulo
if !(chao) { v_sp += grv; } else {v_sp = -jumpforc * jumpkey; }

tipo oque eu não entendi foi, porque vc multiplica pelo botão de pular
quando eu faço esse código eu costumo fazer da seguinte forma
if(!chao)
{
velv -= grav
}
else
{
if(jump) velv = - jump
}

tipo se vc multiplicar pelo valor do pulo ele automaticamente funciona como uma verificação do pulo ?

chinogamo escreveu:uma pergunta relacionado ao código do pulo
if !(chao) { v_sp += grv; } else {v_sp = -jumpforc * jumpkey; }

tipo oque eu não entendi foi, porque vc multiplica pelo botão de pular
quando eu faço esse código eu costumo fazer da seguinte forma
if(!chao)
{
 velv -= grav
}
else
{
   if(jump) velv = - jump
}

tipo se vc multiplicar pelo valor do pulo ele automaticamente funciona como uma verificação do pulo ?

Só corrigindo seu código, seria velv += grav; então a gravidade seria pra cima sjsbuahs
E meu código é basicamente igual ao seu, eu multipliquei pela TECLA do pulo, quando eu pressiono pra cima, fica
keyboard_check_pressed(vk_up) = 1
Quando eu solto fica
keyboard_check_pressed(vk_up) = 0

As verificações também funcionam como valores, então traduzindo 

if !(chao) { v_sp += grv; } else {v_sp = -jumpforc * jumpkey; }

Supondo que minha força de pulo fosse 15


Se eu não pressionar vk_up
.....else {v_sp = - 15 * 0}

Se eu pressionar vk_up
.....else {v_sp = - 15 * 1}

Deu pra entender? Se não faço uma explicação mais detalhada, de qualquer forma, irei fazer um tutorial pra aprimorar, reduzir e resumir códigos, isso aí é basicamente uma parte do tutorial, reduzir as 8 linhas que você escreveu por uma.

a sim eu escrevi errado o codigo velv kkkkk, mas valeu pela explicação