tinyjs-plugin-dust

Dust is a quick and easy particle effects engine

查看demo

http://tinyjs.net/plugins/tinyjs-plugin-dust.html#demo

引用方法

• 推荐作为依赖使用

  • npm install tinyjs-plugin-dust --save

• 也可以直接引用线上cdn地址，注意要使用最新的版本号，例如：

  • https://gw.alipayobjects.com/os/lib/tinyjs-plugin-dust/0.3.0/index.js
  • https://gw.alipayobjects.com/os/lib/tinyjs-plugin-dust/0.3.0/index.debug.js

起步

首先当然是要引入，推荐NPM方式，当然你也可以使用CDN或下载独立版本，先从几个例子入手吧！

1、最简单的例子

引用 Tiny.js 源码

<script src="https://gw.alipayobjects.com/os/lib/tinyjs/tiny/1.5.0/tiny.js"></script>

var Dust = require('tinyjs-plugin-dust');
// 或者
// import Dust from 'tinyjs-plugin-dust';

// 新建 APP
var app = new Tiny.Application({
  width: 320,
  height: 320
});
// 创建容器
var container = new Tiny.Container();
// 初始化
var dust = new Dust(100, 100, function () {
    return new Tiny.Sprite.fromImage('https://gw.alipayobjects.com/as/g/tiny/resources/1.0.0/images/heart.png')
  }, container,
  {
    number: 50,
    gravity: 0.1,
    randomSpacing: true,
    minAngle: 0, maxAngle: 6.28,
    minSize: 12, maxSize: 24,
    minSpeed: 1, maxSpeed: 2,
    minScaleSpeed: 0.005, maxScaleSpeed: 0.01,
    minAlphaSpeed: 0.005, maxAlphaSpeed: 0.01,
    minRotationSpeed: 0.05, maxRotationSpeed: 0.1
  });

app.run(container);
app.onUpdate(function () {
  dust && dust.update();
});

依赖

• Tiny.js: Link

API文档

http://tinyjs.net/plugins/tinyjs-plugin-dust.html#docs