简介
gravity-aurora
是一个前端动画库,它允许用户创建出各种漂亮的交互式动画效果。它可以很好的被用于构建一些独立的 UI 动画,也可以被用在游戏设计等领域上。
安装
该库采用 npm 包的方式发布,所以 npm
安装和引入 gravity-aurora
就变得特别的容易。
--- ------- --------------
使用
引入
有两种方式可以引入 gravity-aurora
库:标准的 script
或者 import
包的方法。
- 标准
script
方式
--------- ----- ------ ------ ------- -------------------------------------------------------------------------------------- ------- ------ -------- -- --- ---- ------ ------ ------ ----- ------ - --------------------------------- ----- ------ - --- ------------------------- --------- ------- -------
import
包的方式,一般来说,如果您需要部分引用gravity-aurora
库,或者项目本身是由构建工具打包,那么推荐您采用该方式:
------ ------ ---- ----------------- ----- ------ - --------------------------------- ----- ------ - --- -------------------------
创建动画
创建一个简单的兔子在墙上跑的动画
--------- ----- ------ ------ ------- -------------- ------ ------ ---- ------------------------------------------------------------------------- ----- ------ - -------------------------------- ----- ------ - --- ------------------------- ----- --------- - --- -------- ------------- - --------------------- ---------------- - ---------- - ----- ------ - --------------- ---- ---------- -- -- -- -- -- --- -- --- ----------- - ---- --- -- -- --- -- --- --------------------------- --- ------ ----------------------------- -- - -------- -- -- - ---------- -- --------- - ------------- - -------- - ---------- - --- -- --------- ------- ------ ------- ------------------- ------- -------
接口
Animation(canvas, options)
构造函数。canvas 为渲染的画布对象,options 包含着一些基础的配置信息。
----- ------ - --- ------------------------ - ------ ---- -- ------ ------- --- ------- ---- -- ------ ------- --- ---------------- ------- -- --------- ------ ------ ------ -- ------------ ----- ---
sprite(options)
创建精灵对象。
----- ------ - --------------- ---- ---------- -- ---------- ----- -- ------- ---- -- -- -- --- - ------ - -- -- -- --- - ------ - -- --- -- -------- -- -- --- -- -------- -- ----------- - -- ---- ---- --- -- -- --- ----- --- -- -- --- -- -- ---------------- ----------------- ------ -- ------------- ------ --------------- -- -- ------------ -- ---------- ----- ----- -- -------------- ---- ---
texture(img)
创建纹理对象。img 为预加载好的图片对象。
----- ------------- - --------------------------
ticker.add(func)
渲染循环事件注册方法。func
为渲染循环周期执行的函数回调
----------------------------- -- - -- ------ ---
总结
gravity-aurora
是一个简单而强大的动画库。随着它的日益完善,它具有的功能和性能也在逐渐增强,越来越适合开发使用。这篇文章由浅入深地详细介绍了这个库的安装、基本使用、接口以及方法等方面,相信大家已经有了足够的知识储备来开始使用这个库进行自己的项目开发了。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/60066b5651ab1864dac66bba