Olá pessoal!
Tudo bem com vocês?
Hoje vamos aprender a criar a movimentação do Personagem sem scripts, sem códigos! Vamos utilizar os eventos e ações pré-determinados do GameMaker Studio.
OBS.: Antes de mais nada, quero deixar claro que esse Tutorial é para aqueles que já possuem os conhecimentos básicos do GameMaker, como criar Sprites, Objects, Rooms, etc. Se você ainda não possui tais conhecimentos, recomendo assistir algumas aulas no Youtube: Aulas GameMaker ou ler algum post anterior.
1. Primeiro vamos criar um novo Projeto no GameMaker. Abra o GameMaker e clique na Aba New e renomeie o nome do Seu Projeto para: “Fazendo um objeto andar no GameMaker. Depois clique no Botão Create. Ilustração abaixo:
2. Em seguida, clique com o Botão Direito na opção Sprites – Create Sprite. Figura abaixo:
3. Na janela que se abre, vamos clicar em Edit Sprite. Figura abaixo:
4. Depois, vamos clicar no Menu File – Add from Strip…. Figura abaixo:
5. Procure a imagem dos sprites em movimentos no seu computador. No nosso caso, a imagem está dentro da Pasta Imagens. Selecione a imagem e clique em Abrir. Figura abaixo:
Obs.: Você deve procurar a imagem dos sprites em movimentos na Internet e salvar em seu PC antes de seguir esse tutorial.
6. Assim que clicar em Abrir, aparecerá essa janela com essas configurações abaixo:
7. Para alterar a largura e altura de seu Sprite, modique os valores dos campos “image width” (largura) e “image height” (altura). No nosso caso, alteramos a largura para 90 e altura para 120 e clicamos em OK para finalizar o primeiro Sprite. Observe a figura abaixo:
Obs.: A seleção retangular em volta do Sprite corresponde exatamente os valores digitados na largura e altura. Portanto, muito cuidado para não cortar parte do Sprite, digitando valores inferiores.
8. Agora, vamos repetir o mesmo procedimento do passo 4: clicar no Menu File – Add from Strip. Selecionar a mesma imagem e clicar em Abrir. Vamos aproveitar a seleção retangular criada para o primeiro Sprite e arrastá-la para o segundo Sprite. Figura abaixo:
9. Depois disso, repete o mesmo procedimento do passo 8 até a última figura do seu Sprite, selecionando cada parte do seu Sprite. O resultado final ficará assim:
Obs.: Cada figura que compõe o Sprite é um frame. O conjunto desses frames cria um movimento em ordem sequencial ou crescente. Ex: Primeiro aparece a “image 0”, depois “image 1”, e assim sucessivamente até o último frame.
10. Para exibir o movimento de todos os frames é só marcar a opção Show Preview. Caso queira diminuir ou aumentar a velocidade da execução do movimento, basta apenas mudar o valor na opção Speed. Você também poderá mudar a cor do plano de fundo do Sprite na opção Background Color. Figura abaixo:
11. Depois, salve o seu Sprite, clicando em Ok, save changes. Figura abaixo:
12. Agora, vamos renomear o Sprite para jogador_movimento e clicar em OK. Figura abaixo:
13. Depois, vamos criar outro Sprite. Só que dessa vez um Sprite parado, ou seja, apenas um frame ou figura. Clique com o Botão Direito na opção Sprites – Create Sprite.
14. Agora, vamos renomear o Sprite para jogador_parado e clique em OK. Figura abaixo:
15. Depois, vamos clicar com o Botão Direito na opção Objects – Create Object. Figura abaixo:
16. Em seguida, vamos renomear o objeto para obj_jogador_parado. Depois selecionar o Sprite jogador_parado, e clicar em OK.
17. Agora, vamos duplicar o Sprite do jogador_movimento e inverter a direção para esquerda. Para isso, clique com o Botão Direito em cima do Sprite jogador_movimento e selecione a opção Duplicate.
18. Em seguida, clique na opção Edit Sprite. Depois clique no Menu Transform – e selecione a opção Mirror/Flip. Figuras abaixo:
Figura 1
Figura 2
19. Verifique se as opções Mirror Horizontally e Apply to all images in the Sprite estão marcadas e clique em OK.
Obs.: Esta opção serve para modificar a direção do seu Sprite na horizontal. No nosso caso, já tínhamos um Sprite do jogador em movimento para direita. Duplicamos esse Sprite e invertemos sua direção para a esquerda e aplicamos essa modificação em todas as imagens do nosso Sprite.
20. Observe agora que todas as imagens do nosso Sprite estão para esquerda. Clique em OK, save changes para salvar as alterações. Figura abaixo:
21. Agora, vamos renomear o Sprite para jogador_movimento_esq e clicar em OK. Figura abaixo:
22. Depois vamos repetir o mesmo procedimento dos passos 13 e 14. Vamos criar outro Sprite. Só que dessa vez um Sprite do jogador_parado para esquerda, ou seja, apenas um frame ou figura. Clique com o Botão Direito no Sprite jogador_movimento_esq e selecione a opção Duplicate. Em seguida clique em Edit Sprite. Delete os sprites, deixando apenas um para esquerda e clique em OK, save changes para salvar as alterações Clique em Figura abaixo:
23. Agora, vamos renomear o Sprite para jogador_parado_esq e clicar em OK. Figura abaixo:
24. Pronto! Criamos todas as Sprites necessárias para fazer o objeto andar. Agora vamos adicionar alguns eventos e ações no objeto. Para isso, clique 2 vezes no objeto obj_jogador_parado. Em seguida, clique em Add Event – Key Press – e selecione Right. Figuras abaixo:
Figura 3
Figura 4
Obs.: O evento corresponde pressionar no teclado a seta direcional para direita. Agora vamos colocar a ação do objeto.
25. Na Aba Move, clique na opção Move Fixed e arraste para dentro da janela Actions (Ações). Aparecerá uma janela de configurações. Selecione a direção para Direita e digite 3 no campo Speed (velocidade). Em seguida, clique em Ok.
26. Depois, clique na Aba main1, no grupo Sprite, e arraste a opção Change Sprite para dentro da janela Actions. Aparecerá outra janela de configurações. Selecione o Sprite jogador_movimento. No campo subimage, digite -1 para o movimento começar no 1 frame. E no campo speed, digite 3. Depois, clique em OK.
27. Agora, vamos adicionar um evento para quando soltarmos a tecla direcional para direita, o jogador parar. Clique em Add event – Key Release – e selecione Right.
28. Depois, Na Aba Move, clique na opção Move Fixed e arraste para dentro da janela Actions. No controle de Direção, selecione Parar e clique em OK.
29. Em seguida na Aba main1 novamente, no grupo Sprite, arraste a opção Change Sprite para dentro da janela Actions. Aparecerá outra janela de configurações. Selecione o Sprite jogador_parado e depois, clique em OK.
30. Repita os mesmos procedimentos do Passo 24 ao 29, só que dessa vez selecione Left (Esquerda) e todos os Sprites para a esquerda (jogador_movimento_esq e jogador_parado_esq) com suas ações correspondentes. Depois clique em OK para salvar as configurações no objeto. Figura abaixo:
31. Agora, vamos criar uma Tela de jogo e adicionar o jogador_parado. Clique com o Botão Direito na opção Rooms e selecione Create Room. Figura abaixo:
32. Na Janela Room Properties, clique na Aba Backgrounds – Color – Escolha um cor para a sua Tela. Figura abaixo:
33. Em seguida, clique na Aba Objects e selecione o objeto jogador_parado. Vá até a Room e dê clique com o Botão Esquerdo para adicionar o Jogador na Tela. Depois clique em Close the form, saving changes para salvar as alterações. Figura abaixo:
34. Para finalizar, clique no Menu Run – e selecione a opção Run normally, ou simplesmente pressione F5 para executar o jogo. Utilize as setas direcionais esquerda e direita para movimentar o jogador. Figura abaixo:
35. O resultado final ficará como na figura abaixo:
Bons estudos e divirta-se!
Quem gostou desse tutorial e poder me ajudar e ao mesmo tempo aprender mais sobre o GameMaker, agradeço. Basta inscreve-se em meu canal no Youtube: Aulas GameMaker
E dar aquele Like =) Desde já agradeço pessoal!
Qualquer dúvida sobre o tutorial, só deixar um comentário abaixo.
Abraço e fiquem com Deus.