CreateJS 指南

https://zhuanlan.zhihu.com/p/40799542
简介

CreateJS是基于HTML5开发的一套模块化的库和工具，基于这些库，可以非常快捷地开发出基于HTML5的游戏、动画和交互应用。

历史可以追溯到7年前 flash 使用慢慢变少那个时代，gskinner 开发它作为“下一代”的富交互的工具库，Adobbe、微软、火狐官方资助的一个项目，API 在很多地方和 Flash 是很像，同时可以通过Adobe Animate CC（替代 flash）直接导出Canvas在Web中使用。

在 18年终于发布了 1.0 版本，同时官方正在开发 2.0 版本，相信不就会有一个更现代化的 Createjs 呈现给开发者。

模块组成

CreateJS 提供的 4 个模块可以帮助处理游戏开发中常见操作：
EaselJS：用于位图、图形、Sprites、文本的绘制，还包含 Ticker 定时器
TweenJS：用来创建补间动画效果
PreloadJS：游戏资源的预加载和管理，包括图片、音频、json等资源
SoundJS：播放和处理音频

更好使用

目前官方版本的 createjs 不支持通过 npm 方式的使用，导致在 ES6 开发中，需要在 html 中手动引入一个

createjs-npm 通过 imports-loader、exports-loader 对官方库加了一层胶水，让大家可以向使用 npm 包方式一样使用，具体为：

// 安装后和官方 createjs 1.0 使用一致
npm install createjs-npm -S// 引入全部模块
import createjs from 'createjs-npm';// 只引入单个模块（xx 可以是 easel、preload、tween、sound）
import createjs from 'createjs-npm/lib/xx';
EaselJS 的使用
EaselJS 在 Createjs 中承担 画 的能力，比如说你要画图片、画图形、画帧动画、画文字可以使用它的 API 实现。

步骤

比如说你需要在画一个红色的圆，必含步骤为创建舞台->创建对象->设置对象属性->添加对象到舞台->更新舞台呈现下一帧：

//创建一个舞台，得到一个参考的画布const stage = new createjs.Stage("myCanvas");//创建一个形状的显示对象const circle = new createjs.Shape();circle.graphics.beginFill("red").drawCircle(0, 0, 40);//形状实例的设置位置circle.x = circle.y = 50;//添加形状实例到舞台显示列表stage.addChild(circle);//更新舞台将呈现下一帧stage.update();

CreateJS 指南相关推荐

在Vue中使用 createjs
CreateJS | A suite of JavaScript libraries and tools designed for working with HTML5 CreateJS 新司机开车指 ...
超详细中文预训练模型ERNIE使用指南-源码
作者 | 高开远,上海交通大学,自然语言处理研究方向最近在工作上处理的都是中文语料,也尝试了一些最近放出来的预训练模型(ERNIE,BERT-CHINESE,WWM-BERT-CHINESE),比对 ...
入门指南目录页 -PaddlePaddle 飞桨入门指南 FAQ合集-深度学习问题
入门指南目录页 -PaddlePaddle 飞桨入门指南 FAQ合集 GT_Zhang关注 0.1012019.08.01 18:43:34字数 1,874阅读 795 Hi,欢迎各位来自Paddl ...
ASIC设计-终极指南
ASIC设计-终极指南 ASIC Design – The Ultimate Guide ASIC设计-终极指南 ASICs代表特定于应用的集成电路,指的是针对特定应用而设计的半导体解决方案,与其他解 ...
Python神经网络集成技术Guide指南
Python神经网络集成技术Guide指南本指南将介绍如何加载一个神经网络集成系统并从Python运行推断. 提示所有框架的神经网络集成系统运行时接口都是相同的,因此本指南适用于所有受支持框架(包 ...
深度学习框架集成平台C++ Guide指南
深度学习框架集成平台C++ Guide指南这个指南详细地介绍了神经网络C++的API,并介绍了许多不同的方法来处理模型. 提示所有框架运行时接口都是相同的,因此本指南适用于所有受支持框架(包括Te ...
HTML5与CSS3权威指南之CSS3学习记录
title: HTML5与CSS3权威指南之CSS3学习记录 toc: true date: 2018-10-14 00:06:09 学习资料--<HTML5与CSS3权威指南>(第3版) ...
Maven入门指南⑦：Maven的生命周期和插件
Maven入门指南⑦:Maven的生命周期和插件一个完整的项目构建过程通常包括清理.编译.测试.打包.集成测试.验证.部署等步骤,Maven从中抽取了一套完善的.易扩展的生命周期.Maven的生命周 ...
ini文件怎么使用_ftp文件下载工具，ftp文件下载工具是怎么使用的？使用指南
ftp文件下载工具是什么工具,可能有人会回答说不知道,因为一般只有从事网站管理的工作者会使用的多一点.但不是每个人生来就会的,所以刚开始肯定都会学习怎么使用.这篇文章就来教一下大家ftp文件下载工具是 ...

CreateJS 指南

CreateJS 指南相关推荐

最新文章

热门文章