Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Lógica II Aula 4 - Atividade 8 (bolinha passa dos limites da tela)

Referente ao curso JavaScript e HTML: pratique lógica com desenhos, animações e um jogo, no capítulo Movendo elementos: animações simples e atividade Movendo a bolinha pelo teclado

por Pedro Zanette de Campos
| 173.6k xp | 5 posts

No código disponibilizado na atividade quando você mantém qualquer tecla pressionada você consegue fazer a bolinha sumir já que ela sai dos limites da tela, certo? Bom, eu acabei adicionando um comando do console.log na função que lê o teclado para me retornar as posições x e y.

function leDoTeclado(evento) {
    if(evento.keyCode == cima) {
        y = y - taxa;
    } else if (evento.keyCode == baixo) {
        y = y + taxa;
    } else if (evento.keyCode == esquerda) {
        x = x - taxa;
    } else if (evento.keyCode == direita) {
        x = x + taxa;
    }
    console.log("("+ x + "," + y + "))";
}

Eu tentei de diferentes formas adicionar condições para que os incremento em x e y só acontecessem se a bolha estivesse dentro da tela, ou seja, quando 0 < x < 600 e 0 < y < 400. Mas, quando você passa dos limites da tela, o console ainda retorna a posição sendo altera enquanto a tecla esta pressionada.

Tem algum jeito de corrigir isto?

3 respostas
por Ricardo Bugan Debs
| 321.1k xp | 526 posts
Instrutor

No código q vc postou vc nao esta limitando a movimentação da bolinha em momento nenhum. Vc tm a versão dele com a limitação q vc tentou fazer?

solução!
por Alessandro Palmeira
| 115.9k xp | 163 posts
Instrutor

Olá Pedro,

modifiquei a lógica do leDoTeclado para só deixar sobrescrever o x e o y quando eles estiverem dentro dos limites.

function leDoTeclado(evento) {
    if(evento.keyCode == cima && y > 0) {
        y = y - taxa;
    } else if (evento.keyCode == baixo && y < 400) {
        y = y + taxa;
    } else if (evento.keyCode == esquerda && x > 0) {
        x = x - taxa;
    } else if (evento.keyCode == direita && x < 600) {
        x = x + taxa;
    }
    console.log("("+ x + "," + y + ")");
}

O console continua mostrando os valores, mas os valores nunca ultrapassam as margens.

Era essa a dúvida? Ou você queria que parasse de aparecer mensagens novas no console quando a bolinha estivesse parada no canto e você continuasse apertando pro lado?

Se for esse o caso, você pode colocar o log dentro de cada um dos ifs, logo depois de fazer a atualização do x ou do y.

por Pedro Zanette de Campos
| 173.6k xp | 5 posts

Ricardo, obrigado pela resposta. Eu não deixei o código porque eu fiquei mudando as condições de posição, mas nenhuma delas funcionou.

Obrigado pela ajuda, Alessandro. É isso ai que eu queria fazer, eu não queria que a bolinha saísse da área da tela. obs.: Quase certeza que eu fiz a mesma abordagem que você, mas não funcionou.