Tutorial ua

Tutorial: Baseline 2D Platformer

Visão geral

Parte 1: A Plataforma

Parte 2: O Jogador

Parte 3: Movimento do Jogador

Parte 4: Salto

Parte 5: Todo o Código

Neste tutorial, iremos criar um "Baseline 2D Platformer". Neste contexto, "linha de base" significa
as funções básicas. Portanto, em um jogo de plataforma 2d de linha de base, você pode ver ou
experimentar o seguinte:

A plataforma para o jogador se mover.

O avatar / personagem do jogador.

A capacidade do jogador de se mover para a esquerda e para a direita.

A habilidade do jogador de pular.

Parte 1: A plataforma

Primeiro, vamos criar a plataforma. Para fins de tutorial, a plataforma é um retângulo branco que
envolverá a metade inferior da janela do jogo.

plataforma = {}

função amor . load ()

- Esta é a altura e a largura da plataforma.

plataforma . largura = amor . gráficos . getWidth () - Torna a plataforma tão ampla quanto toda a
janela do jogo.

plataforma . altura = amor . gráficos . getHeight () - Isso torna a plataforma tão alta quanto toda a
janela do jogo.

- Estas são as coordenadas onde a plataforma será renderizada.

plataforma . x = 0 - Isso começa a desenhar a plataforma na borda esquerda da janela do jogo.

plataforma . y = plataforma . altura / 2 - Este começa a desenhar a plataforma bem no meio da
janela do jogo

final

função amor . atualização ( dt )

fim

função amor . desenhar ()

amor . gráficos . setColor ( 1 , 1 , 1 ) - Isso define a cor da plataforma para branco.

- A plataforma agora será desenhada como um retângulo branco enquanto considera as variáveis
que declaramos acima.

amor . gráficos . retângulo ( 'preencher' , plataforma . x , plataforma . y , plataforma . largura ,

plataforma . altura )

final

Portanto, terá algo parecido com isto:

Parte 1 O Platform.PNG

Legal! Agora temos uma plataforma branca simples!

Parte 2: o jogador

O próximo será o personagem do jogador. Para fins de tutorial, o personagem do jogador será um
bloco roxo de 32x32. Desta vez, em vez de usar love.graphics.rectangle , usaremos
love.graphics.draw . A razão para isso é porque o bloco roxo seria um arquivo externo. Assim, você
aprenderá a desenhar uma imagem "internamente" e também a desenhar uma imagem "externa".
Você pode obter o bloco roxo aqui .

Nota: Apenas como uma referência rápida, love.graphics.rectangle permite que você desenhe um
retângulo na janela do jogo. Podemos considerar isso como uma forma de "renderização de
arquivo interno" (não o termo exato ou apropriado), uma vez que estamos declarando seus
(possíveis) parâmetros no código do jogo. Por outro lado, love.graphics.draw permite desenhar
uma imagem na janela - desde que o tipo de arquivo seja compatível. Podemos considerar isso
como uma forma de "renderização de arquivo externo" (novamente, não é o termo exato ou
apropriado), uma vez que a imagem que estamos renderizando é um arquivo externo sendo
chamado pelo código do jogo.

...

player = {} - Adicione isto abaixo da variável de plataforma

função amor . load ()

...

- Adicione isso abaixo das variáveis de plataforma.

- Estas são as coordenadas onde o personagem do jogador será renderizado.

jogador . x = amor . gráficos . getWidth () / 2 - Define o jogador no meio da tela com base na
largura da janela do jogo.

jogador . y = amor . gráficos . getHeight () / 2 - Define o jogador no meio da tela com base na altura
da janela do jogo.

- Isso chama o arquivo chamado "purple.png" e o coloca na variável chamada player.img.

jogador . img = amor . gráficos . newImage ( 'purple.png' )

end

função amor . atualização ( dt )

fim

função amor . draw ()

...

- Adicione isso abaixo da linha love.graphics.rectangle.

- Isso atrai o jogador.

amor . gráficos . desenhar ( jogador . img , jogador . x , jogador . y , 0 , 1 , 1 , 0 , 32 )

fim

Agora temos algo parecido com isto:

Parte 2 O personagem do jogador. PNG

Bem! Agora o jogador existe!

Parte 3: Movimento do jogador

Temos a plataforma, temos o jogador! É hora de fazer esse cara se mexer. Lembre-se de que em
plataformas 2d, o jogador deve ser capaz de se mover para a esquerda e para a direita! Não
podemos simplesmente deixar o jogador avançar para a direita para sempre. Para fazer isso,
precisamos declarar a velocidade de movimento do jogador, bem como atribuir entradas de
teclado para que quando o jogador pressionar um determinado botão, o personagem se mova para
a esquerda ou direita dependendo do que está codificado.

função amor . load ()

...

player . velocidade = 200 - Esta é a velocidade do jogador. Este valor pode ser alterado de acordo
com sua preferência.

fim

função amor . update ( dt )

- Veja como atribuir entradas de teclado.

se amor . teclado . isDown ( 'd' ) then - Quando o jogador pressiona e mantém pressionado o botão
"D":

player . x = jogador . x + ( jogador . velocidade * dt ) - O jogador move-se para a direita.

elseif amor . teclado . isDown ( 'a' ) then - Quando o jogador pressiona e mantém pressionado o
botão "A":

player . x = jogador . x - ( jogador . velocidade * dt ) - O jogador move-se para a esquerda.

fim

fim

Se você executar o código, o jogador agora pode se mover para a esquerda e para a direita!
CONTUDO! Há um problema. Se você ainda não percebeu, se continuar movendo o personagem
para a direita (ou para a esquerda), ele passará pela janela do jogo e ficará fora da visão do
jogador. Para fins de tutorial, não queremos isso. Portanto, dentro da função love.update ():

função amor . atualizar ( dt )

se amor . teclado . isDown ( 'd' ) then

- Isso garante que o personagem não passe pela borda direita da janela do jogo.

se jogador . x < ( adoro . gráficos . getWidth () - player . img : getWidth ()) e depois

player . x = jogador . x + ( jogador. speed * dt )

end

elseif love . teclado . isDown ( 'a' ) then

jogador . x - ( jogador . velocidade * dt ) end end end- Isso garante que o personagem não
ultrapasse a borda esquerda da janela do jogo.

se jogador . x > 0 então

jogador . x =

Parte 3 - Player Movement.gif

Agora o jogador não consegue passar pela tela. Desta forma, o personagem do jogador estará
sempre dentro dos limites da janela do jogo.

Parte 4: salto

Tudo o que resta agora é pular. Você não pode ter um jogo de plataforma 2D sem pular. Sem ele, o
jogador não pode realmente superar obstáculos como fossos ou paredes. É hora de um pouco de
física básica. Para que algo pule e caia, um objeto (neste caso, o personagem do jogador) precisa
ter uma velocidade do eixo Y, uma altura de salto e gravidade. Para fins de tutorial, não levaremos
em consideração a massa de um objeto, entretanto, vale a pena mencionar que dar massa a um
objeto pode mudar o funcionamento de sua física. Primeiro, vamos declarar as três coisas que
mencionamos anteriormente. Também estarei adicionando uma variável chamada "solo". Isso é
para indicar onde está o terreno. Pense nisso como o lugar onde os pés devem se tocar e pousar
após o salto.

função amor . load ()

...

- Adicione isto abaixo do

player player.img . solo = jogador . y - Isso faz o personagem pousar na plataforma.

jogador . y_velocity = 0 - Sempre que o personagem ainda não saltou, a velocidade do eixo Y está
sempre em 0.

jogador . jump_height = - 300 - Sempre que o personagem pula, ele pode atingir essa altura.
jogador . gravidade = - 500 - Sempre que o personagem cair, ele descerá nesta taxa.

fim

Nota: Sinta-se à vontade para alterar os valores de player.jump_height e player.gravity de acordo

com sua preferência. Apenas lembre-se disso na maior parte, a menos que você queira que a
física do jogo não funcione da maneira usual, player.gravity> player.jump_height

Depois de declarar as variáveis, iremos agora fazer o salto do caractere. Para fazer isso,
precisamos atribuir uma tecla que fará o personagem pular.

...

função amor . update ( dt )

...

- Adicionar abaixo a atribuição de tecla certa.

- Este é o responsável pelo salto do jogador.

E se amor . teclado . isDown ( 'espaço' ) então - Sempre que o jogador pressiona ou mantém
pressionada a barra de espaço:

- O jogo verifica se o jogador está no solo. Lembre-se de que quando o jogador está no solo, a
velocidade do eixo Y = 0.

se o jogador . y_velocity == 0 então

jogador . y_velocity = jogador . jump_height - A velocidade do eixo Y do jogador é definida para a

altura do salto.

fim

fim

fim

Não terminamos ainda. Se você tentar pular, o personagem não pulará ainda. Isso ocorre porque
ainda não adicionamos a física do salto.

...

função amor . update ( dt )

...

- Adicionar abaixo da atribuição da tecla de salto.

- Este é o responsável pela física do salto.

se jogador . y_velocity ~ = 0 then - O jogo verifica se o jogador "pulou" e saiu do solo.

jogador . y = jogador . y + jogador . y_velocity * dt - Isso faz o personagem subir / pular.

jogador . y_velocity = jogador . y_velocity - jogador . gravidade * dt - Aplica a gravidade ao

personagem.

fim

- Este é o responsável pela colisão, garantindo que o personagem caia no chão.

se jogador . y > jogador . ground then - O jogo verifica se o jogador saltou.

jogador . y_velocity = 0 - A velocidade do eixo Y é definida de volta para 0, o que significa que o
personagem está no chão novamente.

jogador . y = jogador . ground - A velocidade do eixo Y é definida de volta para 0, o que significa que
o personagem está no chão novamente.

fim

fim

E, finalmente, o personagem agora pode pular!

Parte 4- Jumping.gif

Parte 5: Todo o Código

Parabéns! Você criou um Baseline 2D Platformer! Agora, para referência, todo o código:

plataforma = {}

jogador = {}

função amor . plataforma load ()

. largura = amor . gráficos . plataforma getWidth () . altura

= amor . gráficos . getHeight ()

plataforma . x = 0

plataforma . y = plataforma . altura / 2

jogador . x = amor . gráficos . getWidth () / 2

jogadores . y = amor . gráficos . getHeight () / 2

jogador . velocidade = 200

jogador . img = amor . gráficos . newImage ( 'purple.png' )

jogador . solo = jogador . y

jogador . y_velocity = 0

jogador . jump_height = - 300

jogadores . gravidade = - 500

final

função amor . atualizar ( dt )

se amor . teclado . isDown ( 'd' ) então

se jogador . x < ( adoro . gráficos . getWidth () - player . img : getWidth ()) e depois

player . x = jogador . x + ( jogador . velocidade * dt )

extremidade

elseif love . keyboard . isDown ( 'a' ) então

se player . x > 0 então

jogador . x = jogador . x - ( jogador . velocidade * dt )

end

end

se amor . teclado . isDown ( 'espaço' ) e depois

se jogador . y_velocity == 0 então

jogador . y_velocity = jogador . jump_height

end

end
se jogador . y_velocity ~ = 0 então

jogador . y = jogador . y + jogador . y_velocity * jogador dt

. y_velocity = jogador . y_velocity - jogador . gravidade * dt end

se jogador . y > jogador . chão então

jogador . y_velocity = 0

jogador . y = jogador . fim de terra

fim

função amor . desenhar ()

amor . gráficos . setColor ( 1 , 1 , 1 )

amor . gráficos . retângulo ( 'preencher' , plataforma . x , plataforma . y , plataforma . largura ,

plataforma . altura )

amor . gráficos . sorteio ( jogador . img , jogador . x , jogador . y , 0 , 1 , 1 , 0 , 32 )

fim

Espero que este tutorial tenha ajudado de alguma forma e agradeço por ler e experimentar este
tutorial.