[游戏开发]js使用tween动画（Tween.js）

一、 itween.js是个非常强大的动画库，可以将它看成是动画脚本。在很多平台上都留有它的身影：Unity、UE4等平台。

????????下面几篇文章带你了解TweenJS的各种介绍，其中它的下载路径可以从github里下载最新版本，或者在我的资源库里下载2022年最新版。

github:

https://github.com/tweenjs/tween.js/

我的资源库：

TweenJS2022最新版本（tween.js）-Javascript文档类资源-CSDN下载

以下几篇供参考文章，详细介绍Twenn.js的功能。

https://codepen.io/mikebolt/pen/zzzvZg

https://sbcode.net/threejs/tween/

TweenJS v1.0.0 API Documentation : TweenJS

CreateJS | A suite of JavaScript libraries and tools designed for working with HTML5

二、将Gitclub上的TweenJS工程下载下来，或者在我的分享资源里下载下来，解压打开：在examples目录下就有TweenJS的使用demo

?三、以第一个hello_word.html为例

tween = new TWEEN.Tween(position) //position--变化的目标
	.to({x: 700, y: 200, rotation: 359}, 2000)//变化的最终值
	.delay(1000)  //延迟时间
	.easing(TWEEN.Easing.Elastic.InOut)//Tween的运动方式
	.onUpdate(update)//Tween的更新函数，提供实时刷新

Tween操控对象的运动，可以是对象的坐标、缩放值、旋转值等，也可以是单纯数值变量的大小调整方式。

四、Tween有多种运动方式，选择适合自己的直接在easing上调用即可

例如需要使用Quadratic下的InOut方式，修改为：.easing(TWEEN.Easing.Quadratic.InOut)即可。

五、更多效果，请直接查看效果介绍页，让你对Tween的运动方式有更直观的认识：

CreateJS | A suite of JavaScript libraries and tools designed for working with HTML5

https://createjs.com/demos/tweenjs/tween_sparktable