elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado:


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Recomendar idea para sprite javascript
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Recomendar idea para sprite javascript  (Leído 2,318 veces)
SrTrp


Desconectado Desconectado

Mensajes: 327


Script/C#


Ver Perfil
Recomendar idea para sprite javascript
« en: 15 Abril 2020, 22:26 pm »

Hola que tal, ahora vengo con un pequeño detalle que me encuentro, al cambiar sprite shet, se nota mucho cuando lo tecleo ya que cambia la posición al momento, se me ocurrió guardar ya se su posición x o y y cuando haya un cambio en esa posición ahora si cambiar la imagen del sprite.
se ve algo así mi detalle

quizás también noten lo de al momento de dar la curva se ve algo cutre pero agregare otro sprite para evitar ese efecto.
Si piensan en alguna otra idea de como solucionar eso se los agradecería este es mi código
Código
  1. for (let i = 0; i < serpi.length; i++) {
  2.    if (i == 0 && serpi.length == 1) {
  3.      ctx.drawImage(obj3, serpi[i].x, serpi[i].y);
  4.    } else if (i == 0) {
  5.        if (d == "LEFT") ctx.drawImage(obj1, 25, 0, 25, 25, serpi[i].x, serpi[i].y, 25, 25);
  6.        if (d == "UP") ctx.drawImage(obj1, 0, 25*1, 25, 25, serpi[i].x, serpi[i].y, 25, 25);
  7.        if (d == "RIGHT") ctx.drawImage(obj1, 0, 0, 25, 25, serpi[i].x, serpi[i].y, 25, 25);
  8.        if (d == "DOWN") ctx.drawImage(obj1, 25*1, 25*1, 25, 25, serpi[i].x, serpi[i].y, 25, 25);              
  9.    }else if(i==serpi.length-1){
  10.      if (d == "LEFT") ctx.drawImage(obj1, 0, 0, 25, 25, serpi[i].x, serpi[i].y, 25, 25);
  11.      if (d == "UP") ctx.drawImage(obj1, 25*1, 25*1, 25, 25, serpi[i].x, serpi[i].y, 25, 25);
  12.      if (d == "RIGHT") ctx.drawImage(obj1, 25, 0, 25, 25, serpi[i].x, serpi[i].y, 25, 25);
  13.      if (d == "DOWN") ctx.drawImage(obj1, 0, 25*1, 25, 25, serpi[i].x, serpi[i].y, 25, 25);
  14.    }else {
  15.      ctx.drawImage(obj2, serpi[i].x, serpi[i].y);
  16.    }
  17.  }
  18.  
  19.  


En línea

[u]nsigned


Desconectado Desconectado

Mensajes: 2.397

JS/Node developer


Ver Perfil WWW
Re: Recomendar idea para sprite javascript
« Respuesta #1 en: 20 Abril 2020, 19:13 pm »

Podrias implementar las animaciones de Canvas. Es muy abstracto asi, pero por lo que entiendo de tu codigo, estas redibujando TODO el canvas en cada iteracion, porque veo que no estas moviendo nada, solo bibujando, y eso es una pesadilla en temas de rendimiento, estas renderizando todo el canvas completo en cada frame...no seria mas practico dejar el fondo estatico y solo mover la serpiente? en cada frame solo estarias renderizando los cambios con respecto al frame anterior, eso te daria muchisimo mas movimiento, ademas podrias usar animaciones de desplazamiento, rotacion y escaldo.

https://developer.mozilla.org/es/docs/Web/Guide/HTML/Canvas_tutorial/Basic_animations


En línea

No hay atajo ante la duda, el misterio se hace aquí...
Se hace carne en cada uno, el misterio es existir!
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
necsito un script para flash para recomendar my web¿
Diseño Gráfico
denacroxis 5 2,291 Último mensaje 21 Junio 2005, 05:12 am
por denacroxis
MOVIDO: Manual o tutorial para Visual Foxpro (Para recomendar)
Electrónica
skapunky 0 2,995 Último mensaje 6 Septiembre 2009, 22:23 pm
por skapunky
me podrian recomendar un antivirus para usb
Software
RedZer 2 2,413 Último mensaje 10 Octubre 2011, 19:56 pm
por RedZer
Ayuda con javascript en mi web(no tengo ni idea de javascript)
Desarrollo Web
jonathanmr 1 3,436 Último mensaje 1 Febrero 2013, 06:14 am
por Shell Root
Ayuda con javascript - Sprite canvas
Desarrollo Web
SrTrp 2 3,158 Último mensaje 3 Julio 2017, 23:35 pm
por SrTrp
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines