1.0.3 • Published 4 months ago

@silkytone/sequence-frame v1.0.3

Weekly downloads
-
License
MIT
Repository
github
Last release
4 months ago

Sequence Frame

简单序列帧动画的实现

引入 umd.js

const { Barrage, TextBarrage } = window.SequenceFrame

渲染器

  • canvas2D

帧实现

  • MultipleFrames 多图片路径实现

使用示例

import { Sequence, MultipleFrames } from '../lib';

const frame = new MultipleFrames(Array.from(new Array(514)).map((_, index) => {
  return `/image/sequence_${index + 1}.jpg`;
}), { framesRate: 60 });

const sequence = new Sequence('#loop .canvas', frame, { loop: true, limit: 10 });

const button = document.querySelector('#sequence button')!;

sequence.on('progress', progress => {
  console.log('[loop]: progress -> %s', JSON.stringify(progress));
});

sequence.on('complete', () => {
  button.removeAttribute('disabled');
});

sequence.load();

button.addEventListener('click', () => {
  if (sequence.isPlay) {
    sequence.pause();
  } else {
    sequence.play();
  }
});
1.0.3

4 months ago

1.0.2

4 months ago

1.0.1

4 months ago

1.0.0

4 months ago