canvasTrigger

define objects in canvas and dispatch canvas event to those objects.

2015/8/3 by DKZ update 2016/1/22

github

List

• canvasTrigger define objects in canvas and dispatch canvas event to those objects.

• animationsCtrl nimation controler to control frame animation

Guide

canvasTrigger

canvasTigger是一个用于在canvas标签内部定义对象并将浏览器的事件分发给这些对象的工具。

基于observe模式设计。轻量级核心代码仅150行。具有良好扩展性，可自己定义形状、线段、图片等对象。包含简单的基于时间的帧动画和可视化编辑方法。

quick example

var ctcanvas=new ctCanvas('canvas');
ctcanvas.addTrigger('click');

var a=new ctFillRect(100,100,200,200,'#f00');
ctcanvas.addObj(a);

a.on('click',function(){
    console.log('a click');
});

ctCanvas

canvas对象并包含注册在它上的ctObj对象。并包含注册、解绑、通知、重绘、添加删除初始化ctObj对象方法等。

ctObj

canvas上的显示对象父类，所有的显示对象都要继承它。包含基本的坐标、长宽属性，绘制和动画方法。可向其注册事件。

animationsCtrl

animationsCtrl是一个基于时间的帧动画控制器。用于控制多个显示对象参与的复杂的动画。采用基于时间的帧动画，可有效解决复杂动画导致的浏览器fps下降造成的游戏卡顿问题。

quick example

aC_startMainLoop();
var i=0;
var anmt=new animationCtrl();
anmt.start();
anmt.on(function(){
    i++;
    console.log(i);
    if(i>2000){
        anmt.stop();
        aC_stopMainLoop();
    }
},this);

animationCtrl

控制器类，基于observe模式设计。包含注册解除启动结束暂停继续等方法。