Анимированная частота кадров PNG в p5js - PullRequest
Новая
       3

Анимированная частота кадров PNG в p5js

1 голос
/ 20 января 2020

Я попробовал анимированный PNG с p5, и он, кажется, работает:

https://editor.p5js.org/dirkk0/sketches/q4Y5HzOYC

Есть ли способ управления частотой кадров?

1 Ответ

2 голосов
/ 20 января 2020

P5 имеет frameRate() функцию , но это меняет частоту кадров холста, а не вашего gif, поэтому я предполагаю, что вы этого не хотите.

Я думаю, что это будет Хорошая идея - взглянуть на библиотеку p5.play - она ​​обладает множеством функциональных возможностей, которые вы можете использовать, включая loadAnimation (), которая принимает ваш gif и создает объект анимации - частоту кадров которой вы можно изменить, используя animation.frameDelay.

Так что ваш пример - с библиотекой p5.play - будет выглядеть так: 

var anim;
var sprite;

function preload() {
  // loads all the image files
  anim = loadAnimation('test.png');
}

function setup() {
  createCanvas(600, 600);

  // change how many frames (of draw loop) each animation frame is
  // visible for. bigger #s = slower speed
  anim.frameDelay = 2;

  // create a sprite from a single image
  sprite = createSprite(300, 150);
  sprite.addAnimation("test", anim);
}

function draw() { 
  background(220);
  drawSprites();
}

вот действительно хороший пример https://editor.p5js.org/kjhollen/sketches/BJ1a_DIkM

...