Fgun

简单轻量的渲染引擎

Application

import { Application } from 'Fgun'
let app = new Application(800/* default is screen width */, 800/* default is screen height */)
document.body.appendChild(app.canvas)
app.showStats = true // stats

loader

资源加载

import { loader } from 'Fgun'

loader.load([
	{name: 'avatar', url: '' /* avatar url */}
	// ......
]).on('progress', function (current, count, percentage) {
	
}).on('complete', function () {
	// 加载完成
})

Sprite

import { Sprite } from 'Fgun'

let avatar = new Sprite('avatar')
avatar.anchor.set(0.5, 0.5)
avatar.position.set(app.size.width / 2, app.size.width / 2)
avatar.alpha = 0.8
avatar.scale.set(0.8, 0.8)
app.ctg.addChild(avatar)
avatar.rotation = 90

Text

文字

import { Text } from 'Fgun'
let txt = new Text('Hello Fgun!', 10 /* fontSize  default 10 */)
txt.fontSize = 24
txt.color = 'yellow'
txt.anchor.set(0.5, 0.5)
txt.position.set(app.size.width / 2, app.size.height / 2)
app.ctg.addChild(txt)

Rect

import { Rect } from 'Fgun'
// Rect(x, y, width, height, radius)
let rectangle = new Rect(0, 0, app.size.width, app.size.height)
rectangle.radius = 20
rectangle.bgColor = 'blue'
app.ctg.addChild(rectangle)

ticker

// add and remove
function animFn() {
	rectangle.rotation += 1
}

app.ticker.add(animFn)

setTimeout(function () {
	app.ticker.remove(animFn)
}, 3000)

// context
app.ticker.add(() => {
	this.rotation += 2
}, 300, txt)

// addOnce
app.ticker.addOnce(() => {
	console.log('once')
}, 600);

qrcode 二维码

const { qrcode } from 'Fgun'
let img = new Image
img.src = qrcode('htttps://www.google.com', {width: 200, height: 200}).base64 // width && height default 400
document.body.appendChild(img);

mask

let maskCircle = new Circle()
maskCircle.r = 30
avatar.mask = maskCircle