1

Para movimentar a cobrinha neste jogo https://leonardovita.github.io/javascript-snake-game/ utilizando o touch screen do celular, preciso calcular a posição do click na tela, como no exemplo da imagem abaixo, só uma direção pode ser recebida

ou qualquer outra solução nativa javascript mais eficiente que de para movimentar a cobrinha com o touch

  const screenWidth = window.screen.width;
  const screenHeight = window.screen.height;

  document.addEventListener("click",handleClickTouchPad)
  function handleClickTouchPad(event){

    //calcula o X e o Y para determinar qual triangulo da imagem abaixo foi o click

    if(up === true ){

      //move para cima   
    }
    else if ( right === true){
        //move para direita
    }else 
    ...
  }

inserir a descrição da imagem aqui

1 Resposta 1

1

Acho que agora esse código resolve:

    //elemento em que ocorrerá o touch swipe
    let area = document.querySelector("#area");
    let centerPosition = {
        x:area.clientWidth/2,
        y:area.clientHeight/2
    };
    area.onclick = (event) => {
        let clickPosition = {
            x:event.offsetX,
            y:event.offsetY
        }
        
        let x = clickPosition.x - centerPosition.x;
        let y = clickPosition.y - centerPosition.y;

        if(Math.abs(x) > Math.abs(y)){
            if(x > 0){
                console.log("right");
            }else{
                console.log("left");
            }
        }else{
            if(y > 0){
                console.log("bottom");
            }else{
                console.log("top");
            }
        }
    };
2
  • cara interessante a sua solução, bem legal trabalhar com o touch assim, porem o jogo da cobrinha precisa de mais velocidade se não o jogador perde, jogar arrastando o dedo e muito lento, o certo mesmo seria só nos toques 14/03/2021 às 21:41
  • Valew man, eu tentei ajustar de acordo com o que vc me relatou, então eu editei minha solução e acho que agora pode te ajudar. 14/03/2021 às 22:17

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .