jcc2d-flowflower v0.0.2

Flowflower · 表情风暴组件

批量让物体自然掉落，每个sprite会被缓存优化

用法

var flowers = {
  assets: {
    great: './images/emoji/great.png',
    heart: './images/emoji/heart.png',
    kiss: './images/emoji/kiss.png',
    smile: './images/emoji/smile.png',
    star: './images/emoji/star.png',
  },
  begin: {
    x: 0,
    y: -160,
    width: 640,
    height: 200
  },
  end: {
    x: 0,
    y: 780,
    width: 640,
    height: 20
  },
};
var w = 800;
var h = 900;
var flyflower = new JC.Flowflower({
  stage: {
    dom: 'flyflower-stage',
    width: w,
    height: h,
  },
  flowers: flowers,
});
flyflower.start();
document.onclick = function() {
  flyflower.fallFlowers({
    flowers: [ 'great', 'heart', 'kiss', 'smile', 'star' ],
    flux: 20,
  });
}

view-demo

完整配置

Flowflower组件配置

方法调用

flyflower({
  flowers: [ 'great', 'heart', 'kiss', 'smile', 'star' ],
  flux: 20,
  begin: { x, y, ... }, // 可选配置 起始区域，会覆盖实例化时的该配置
  end: { x, y, ... }, // 可选配置 结束区域，会覆盖实例化时的该配置
});