createjs初学-关于Ticker

tick本来的意思是钟表的滴答声,在createjs中的Ticker当然就是于时间相关的。

Ticker是一个静态类,提供了好多静态方法和属性,不要去实例化它。

在API文档中对Ticker的介绍是它是一个集中的间隔广播,侦听tick时间后再设定的时间间隔会调用侦听函数。

但是我觉着在Beginning HTML5 Games with CreateJS这本书中的解释更好。Ticker类为游戏开发提供了一个主要的定时类。它主要的目的就是把stage渲染的工作集中起来,也就是说定时调用stage.update()这个方法。Ticker设置的频率也就是游戏的帧数了。

要注意一点就是在CPU使用率过高时,Ticker可能会比设定的要慢。这个很容易理解。

Ticker的使用如下,Ticker静态类侦听tick事件,然后设置好相应的函数就行

createjs.Ticker.addEventListener("tick", handleTick);
function handleTick(event) {
    //todo
}

对于更新舞台来说就是,可以先设置一个帧频

createjs.Ticker.setFPS(30);
createjs.Ticker.addEventListener("tick", handleTick);
function handleTick(event) {
    stage.update();
}

也可以这样写

createjs.Ticker.setFPS(30);
createjs.Ticker.addEventListener("tick",stage);

因为addEventListener这个方法是这样的

addEventListener (type listener [useCapture] )

其中参数listener可以是一个方法,也可以是一个对象,这个对象里面有handleEvent这个方法,来出来侦听事件。
而Stage类里面就有handleEvent这个方法,而且就是用来处理tick事件的,看Stage里面的源码就知道

p.handleEvent = function(evt) {
    if (evt.type == "tick") { this.update(evt); }
};

tick事件的event

function handleTick(event) {
    //todo
}

在侦听函数中event的数据
1.event.paused 表示ticker是否处于暂停状态
2.event.delta 在上一次tick事件之后到这次事件的时间间隔,以毫秒为单位。
3.event.time 在Ticker被初始化以后的时间总和,以毫秒为单位。
4.event.runTime 在Ticker被初始化以后没有暂停的时间总和,以毫秒为单位。

Ticker类的属性
1.interval 这个就是用来设置间隔的时间,以毫秒为单位。默认为50。
在RAF模式下,这个参数就会被忽略。
2.framerate 这个参数用来直接设置fps,其实内部实现就是设置interval
interval=1000/framerate。
3.maxDelta 指定tick事件中的delta最大值。文档中推荐这个值为interval的两倍。
4.paused 在ticker暂停时,所有的侦听器仍然会接受到tick事件,但是事件中的paused会是true;

createjs.Ticker.addEventListener("tick", handleTick);
createjs.Ticker.paused = true;
function handleTick(event) {
    console.log(event.paused);
}

5.timingMode指定tick的timing模式。一共有三种模式,TIMEOUT、RAF和RAF_SYNCHEN。
(1)TIMEOUT,这种模式下使用的就是setTimeOut这个方法实现的。是timingMode的默认模式。
(2)RAF 在这个模式下使用requestAnimationFrame,完全忽略Ticker的帧频。如果requestAnimationFrame API不支持的话就用TIMEOUT模式。
(3)RAF_SYNCHEN 在这个模式下使用requestAnimationFrame,但是试图与ticker的帧频同步。如果requestAnimationFrame API不支持的话就用TIMEOUT模式。

Ticker类的方法
1.getTime ([runTime=false] )
返回Ticker初始化以后的总时间,如果没有初始化就返回-1。(初始化时在添加第一个侦听时进行的)。参数runTime表示返回的是否包含暂停时间,true的话只有tick运行的时间,false的话是所有时间。
2.getEventTime (runTime ) 和getTime差不多,但是返回的是最近一次tick事件的时间。
3.getMeasuredFPS() 获得当前的实际帧频。
4.getMeasuredTickTime 获得平均一次tick所有的时间,大概就是在这一次tick所用的时间。
5.getTicks (pauseable) 获得初始化后所有tick的次数 参数表明是否包含暂停的tick
6.reset() 停止Ticker并且移除所有的侦听。

你可能感兴趣的:(createjs)