- TweenMax 中文手册 / TweenLite 中文手册
- TweenMax()
- TweenMax.to()
- TweenMax.from()
- TweenMax.fromTo()
- TweenMax.staggerTo()
- TweenMax.staggerFrom()
- TweenMax.staggerFromTo()
- TweenMax.delayedCall()
- TweenMax.set()
- delay
- ease
- paused
- immediateRender
- overwrite
- useFrames
- lazy
- autoCSS
- callbackScope
- repeat
- repeatDelay
- yoyo
- yoyoEase
- startAt
- cycle
- onComplete
- onCompleteParams
- onCompleteScope
- onReverseComplete
- onReverseCompleteParams
- onReverseCompleteScope
- onStart
- onStartParams
- onStartScope
- onUpdate
- onUpdateParams
- onUpdateScope
- onOverwrite
- onRepeat
- onRepeatParams
- onRepeatScope
- .eventCallback()
- .play()
- .pause()
- .paused()
- .restart()
- .resume()
- .reverse()
- .reversed()
- .seek()
- .timeScale()
- .duration()
- .totalDuration()
- .time()
- .totalTime()
- .progress()
- .totalProgress()
- .delay()
- .invalidate()
- .isActive()
- .updateTo()
- .startTime()
- .endTime()
- .repeat()
- .repeatDelay()
- .yoyo()
- .data
- TweenLite.defaultEase
- TweenLite.defaultOverwrite
- TweenLite.onOverwrite
- TweenLite.selector
- .target
- .timeline
- .vars
- TweenMax.ticker
- TweenMax.getTweensOf()
- TweenMax.getAllTweens()
- .kill()
- TweenMax.killDelayedCallsTo()
- TweenMax.killTweensOf()
- TweenMax.killAll()
- TweenMax.killChildTweensOf()
- TweenLite.render()
- TweenMax.lagSmoothing()
- TweenMax.globalTimeScale()
- TweenMax.isTweening()
- TweenMax.pauseAll()
- TweenMax.resumeAll()
- 下载 TweenMax
文章来源于网络收集而来,版权归原创者所有,如有侵权请及时联系!
TweenMax.ticker
TweenMax.ticker : Object
设置动画核心引擎,每当引擎update时这个对象将分配tick事件,你可以添加你自己的listener来运行自定义逻辑(非常适合游戏开发人员) 。
简约的监听方法
//添加监听
TweenMax.ticker.addEventListener("tick", myFunction);
function myFunction() {
//核心引擎update时处理这个事件
}
//移除监听
TweenMax.ticker.removeEventListener("tick", myFunction);
目前主流浏览器都由requestAnimationFrame事件驱动,通常,requestAnimationFrame事件每秒发生约60次,但这取决于浏览器并且还取决于系统性能。如果requestAnimationFrame 不支持,则ticker会自动回退到使用setTimeout()这种所有浏览器都支持的常规模式。
自定义ticker
要ticker使用setTimout()而不是requestAnimationFrame,您可以使用useRAF()方法:
//关闭requestAnimationFrame,切换ticker使用setTimeout()来替换
TweenMax.ticker.useRAF(false);]
如果你想调整帧速率,可以使用fps()方法,帧速率超过60无效
//帧速调整为30
TweenMax.ticker.fps(30);
如果你确实想将帧速率调整到100(不推荐),你可以先把requestAnimationFrame关闭TweenMax.ticker.useRAF(false)转为setTimeout(),再设定TweenMax.ticker.fps(100)即可。
完整的监听方法
如果你还想定义一下监听函数的作用域等,可以这样写
addEventListener(type, callback, scope, useParam, priority)
参数名 | 类型 | 必填 | 说明 |
---|---|---|---|
type | String | 是 | 监听类型,一般是"tick" |
callback | Function | 是 | 事件触发的函数 |
scope | Object | 否 | 限定函数的范围,一般是"this" |
useParam | Boolean | 否 | 如果设置为true每次触发时将产生事件对象,事件对象包含type(一般是"tick")和target,默认是false以提高性能 |
priority | Integer | 否 | 函数调用的优先级,高级的比低级的优先处理 |
//添加请求事件对象参数event的侦听器,将范围绑定到当前范围(this),并将优先级设置为1,以便优先处理
TweenMax.ticker.addEventListener("tick", myFunction, this, true, 1);
function myFunction(event) {
//核心引擎update时处理这个事件
}
//移除监听
TweenMax.ticker.removeEventListener("tick", myFunction);
TweenMax.ticker适用于TweenMaxTweenLite
TweenMax.ticker的参数
TweenMax.ticker 示例
.box {
width:50px;
height:50px;
border-radius:6px;
margin-top:4px;
display:inline-block
}
.green{
background-color:#6fb936;
}
new TweenMax('.box', 3, {
x: 500,
});
TweenMax.ticker.fps(3);//设置帧速率为3,每秒钟触发三次tick监听事件
TweenMax.ticker.addEventListener("tick", myFunction,this,true,1);
function myFunction(event) {
console.log(event);//useParam设置为true时产生事件对象,如果设置为false则event为undefined但会提高性能
}
TweenMax.ticker返回值
TweenMax.ticker的补充说明
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论