Como fazer o jogo da cobrinha funcionar do jeito certo
A maioria das pessoas tenta programar o joguinho joguinho da cobrinha de uma forma que parece lógica no papel mas trava na prática. O problema principal é o controle da velocidade e a detecção de colisão. A cobra não deve se mover sozinha sem um timer consistente, e verificar se ela bateu na própria cauda exige cuidado com a ordem dos cálculos.
joguinho joguinho da cobrinha - o básico que ninguém explica direito
Você precisa de uma grade. Não um canvas livre, mas uma grid com coordenadas fixas. Comece com uma matriz 20x20 e trate cada célula como 20 pixels. A cobra é uma lista de pares de coordenadas. O corpo segue a cabeça naturalmente se você adicionar uma nova posição na frente e remover a última da cauda a cada frame, a menos que tenha comido algo. A armadilha onde quase todo mundo erra é a detecção de colisão. Se você verificar a colisão antes de mover a cobra, ela vai que está viva quando na verdade já entrou na parede. A ordem correta é: mover, verificar colisão com paredes e corpo, depois verificar se comeu a maçã. Testei isso na minha primeira versão e a cobra simplesmente atravessava paredes porque o check acontecia no frame errado.
A lógica do movimento
Use um setInterval ou requestAnimationFrame com controle de FPS. Eu recomendo travar em 10 ou 12 frames por segundo no começo. Velocidade alta aqui causa bug onde a cobra pula células inteiras e atravessa o próprio corpo. O intervalo ideal depende da complexidade que você quer, mas para um jogo jogável, 12 FPS é o ponto seguro. Para o controle, capture as teclas de seta e armazene a direção desejada. O detalhe importante é que você não pode mudar para a direção oposta imediatamente. Se a cobra está indo para a direita e você aperta esquerda no mesmo frame, ela colide consigo mesma. Solução simples: armazene a direção e só aplique na próxima atualização do jogo, não no momento do evento de teclado.
Questões que as tutoriais não cobrem
Um problema real que encontrei foi com a maçã aparecendo em cima do corpo da cobra. A solução ingênua é gerar aleatoriamente e torcer. A solução real é manter uma lista de posições ocupadas e descartar as repetidas até encontrar um espaço livre. Isso adiciona talvez 5 linhas de código mas evita um bug que estraga completamente a jogabilidade. Outro ponto: aumentar o tamanho da cobra quando ela come. Simplesmente adicionar um segmento novo funciona, mas a posição que você adiciona na cauda importa. Se você não respeitar o tamanho atual e simplesmente pushar uma posição aleatória, a cobra vai teletransportar partes do corpo. O correto é adicionar na posição da cauda atual e deixar o movimento normal ocupar o espaço nos próximos frames.
👉 Clique no botão abaixo para saber mais sobre o assunto!
Implementação prática
Se você estiver usando JavaScript puro, aqui vai o esqueleto que funciona: Crie um array snake com a posição inicial. Defina direction como 'right'. No loop principal, calcule a nova posição da cabeça baseada na direction. Verifique colisão com paredes e com o próprio corpo. Se a nova posição for igual à posição da maçã, cresça a cobra e gere uma nova maçã. Senão, remova o último segmento. Renderize tudo limpo a cada frame.
O rendering é simples: limpa o canvas, desenha o fundo, desenha a cobra como retângulos verdes e a maçã como um retângulo vermelho. Não precisa de gráficos elaborados. Limpar o canvas inteiro a cada frame é o método mais confiável. Usar overdraw causa rastros visuais que confundem o jogador.
Limitações e quando algo dá errado
O jogo da cobrinha clássico tem um limite natural de dificuldade. Depois que a cobra atinge cerca de 80% da grade, o jogo fica impossível de forma prática porque não há espaço suficiente. Isso não é bug, é. Se você quer continuar jogando, precisa implementar um sistema onde a cobra encurta ao comer ou onde o tabuleiro é infinito com wrap-around nas bordas. Uma alternativa ao formato tradicional é transformar em um campo aberto com obstáculos fixos, mas aí você está essencialmente criando um jogo novo. Para o joguinho joguinho da cobrinha clássico, o mais honesto é aceitar que a dificuldade escala até um ponto onde o espaço se esgota e o jogo termina.
Se quiser testar algo pronto, procure por implementações open source em Python com pygame ou JavaScript com canvas. Código de exemplo não falta. O importante é entender a lógica por trás antes de copiar, porque qualquer bug desses que mencionei aqui vai aparecer se você apenas colar e esperar que funcione.