Solo logré que rebotara una sola vez | Lógica de programación: Practicando con juegos y animaciones | Alura Latam

2
respuestas

por Edgar Mauricio Gómez Pérez

| 150.4k xp | 61 posts

Desarrollo de software(JR).

Despues vengo a mirar otra alternativa, me consumió toda la tare. Si logro darle con el chiste vengo a corregir.

<meta charset="UTF-8">

<canvas width="600" height="400"></canvas>

<script>

    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");

    pincel.fillStyle = "purple";  //rectangulo
    pincel.fillRect(0,0,600,400);  //plasme el dibujo



    function diseñarCirculo(x,y,radio){
        pincel.fillStyle = "blue";
        pincel.beginPath();
        pincel.arc(x,y,radio,0,2*Math.PI);
        pincel.fill(); //llena circunferencia
    }

    function limpiaPantalla(){
        pincel.clearRect(0,0,600,400);
    }

    var R = 0;
    function avanzarPantalla(){
       limpiaPantalla();
       diseñarCirculo(R,20,10);
        return R++;
    } 

    var x = 600;
    function retrocederPantalla(){
       limpiaPantalla();
       diseñarCirculo(x,20,10);
        return x--;
    }  

     var aux;  

    function vectorPantalla (){
          //600     0    
      if( x > R ){
            retrocederPantalla();

          // 0      600 
      }else{            
             avanzarPantalla();
       }                  
    }
    setInterval(vectorPantalla ,6);

    //setInterval(diseñarCirculo(20,20,10)); //para que grafique en pantalla ya que for no funciona
      //setInterval(exibirMensaje,1000); muestra el mensaje cada segundo
</script>

2 respuestas

por Edgar Mauricio Gómez Pérez

| 150.4k xp | 61 posts

Desarrollo de software(JR).

12/04/2023

Me costo un buen paro al fin corre como se debe.

<meta charset="UTF-8">


<style> #bordo {border: solid 6px skyblue ;}</style>

<canvas width="600" height="400" id= "bordo"></canvas>

<script>

    var VELOCIDAD = 6;
    var WIDTH =  600;
    var HEIGHT = 400;
    var Radio =  20;
    var x = 0;
    var x1 = 600;

    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");

    pincel.fillStyle = "purple";  //rectangulo
    pincel.fillRect(0,0,WIDTH,HEIGHT);  //plasme el dibujo

    function diseñarCirculo(x,y,radio){
        pincel.fillStyle = "blue";
        pincel.beginPath();
        pincel.arc(x,y,radio,0,2*Math.PI);
        pincel.fill(); //llena circunferencia
    }

    function limpiaPantalla(){
        pincel.clearRect(0,0,WIDTH,HEIGHT);
    }

    function aceleraDI(){   
       if(x1 > 0 ){
         limpiaPantalla();
         diseñarCirculo(x1+10,20,10);
          x = x1;
          return x1--;

      } else if(x < 600){
          limpiaPantalla();
          diseñarCirculo(x-10,20,10);
          return x++;
             x1 = x 
      }
       x1 = x;     
    }

    function acelerarTotal(){
      var ID = HEIGHT;
      aceleraDI();       
    } 

     setInterval(acelerarTotal,VELOCIDAD);   
</script>

por Bruno Botelho de Souza

| 3933.7k xp | 14897 posts

Alura Scuba Team Scuba Team | Front-end

02/05/2023

Hola, Gracias por tu participación en el foro. Sin embargo, no hace falta que publiques la respuesta a tu ejercicio aquí. Puedes hacerlo en Discord, donde hay un canal específico para eso. El foro es más bien para plantear tus dudas y ayudar a otros compañeros. Recordamos que no es obligatorio responder a ningún ejercicio en el foro, ni suman puntos o son usados como criterio para el avance en el programa. Pedimos que siempre que sea posible, por favor etiquetes tu tópico para que sea más sencillo identificar si es una duda, sugerencia, etc. ¡Deseamos que puedas cumplir con todos tus objetivos y tener éxito en tus estudios, saludos!

Si este post te ayudó, por favor marca como solucionado ✓ ¡Continúa con tus estudios!