recherche

Maison  >  Questions et réponses  >  le corps du texte

Comment requestAnimationFrame contrôle-t-il la fréquence d’images ?

Je souhaite implémenter une animation dans le canevas. Chaque image d'animation est dessinée sur Sprite et connectée en une seule image. J'ai essayé d'utiliser setTimeout pour implémenter l'animation et j'ai constaté que l'image sautait. Cependant, requestAnimationFrame ne peut pas contrôler la fréquence d'images. faire si je veux dessiner 7 images en 1, gérer ?

仅有的幸福仅有的幸福2857 Il y a quelques jours823

répondre à tous(3)je répondrai

  • 过去多啦不再A梦

    过去多啦不再A梦2017-05-16 13:46:28

    requestAnimationFrame est appelé lorsque le navigateur restitue l'image suivante, on peut donc considérer que le taux d'appel de requestAnimationFrame est le taux de rafraîchissement du navigateur, qui est généralement de 60 images

    Mais lorsque requestAnimationFrame appelle le rappel, un paramètre d'horodatage sera transmis. Vous pouvez juger en fonction de ce paramètre pour traiter la fréquence d'images dont vous avez réellement besoin

    Par exemple, si vous voulez 7 images par seconde, vous pouvez l'écrire comme ceci

    let step = (timestamp, elapsed) => {
        if (elapsed > 1000 / 7) {
            //TO DO SOMETHING
            elapsed = 0
        }
        
        window.requestAnimationFrame(
            _timestamp => step(_timestamp, elapsed + _timestamp - timestamp)
        )
    }
    window.requestAnimationFrame(timestamp => step(timestamp, 0))

    répondre
    0
  • PHP中文网

    PHP中文网2017-05-16 13:46:28

    Cela semble incontrôlable, le navigateur le calcule tout seul

    répondre
    0
  • 迷茫

    迷茫2017-05-16 13:46:28

    Le taux de rafraîchissement de 1s7 images... est essentiellement l'effet du "saut d'images"...

    répondre
    0
  • Annulerrépondre