在 HTML 5 Canvas Animate CC 文档中包含代码文件

Posted 2023-02-16

【中文标题】在 HTML 5 Canvas Animate CC 文档中包含代码文件

【英文标题】：Including code files in HTML 5 Canvas Animate CC documents

【发布时间】：2016-09-12 10:16:49

【问题描述】：

我们目前正在从 CS6 中的 AS2 过渡到 Adob​​e Animate CC 中使用 javascript 的 html5 Canvas，同时努力保留多年来我们在 AS2 中构建的尽可能多的功能。

到目前为止，我无法以任何方式复制的最重要的东西是用于 AS2 的 #include 编译器指令。

有没有人找到解决这个问题的方法？

【问题讨论】：

动画需要手动编码，或者至少作为通过画布显示的视频，

@QBM5 是的，我们使用 createjs 对动画中的对象进行补间，但过去我们将 AS2 Tween 函数包装在我们自己的函数名称中，这对我们的非编码设计师同事更友好.我们还包含了其他代码，例如保持功能，因此设计人员可以指定在给定帧上等待的秒数。

向任何 Javascript API 添加功能应该很容易。这当然取决于 API 以及它们如何管理对象和原型链，但添加更多描述性命名和扩展核心功能很容易。虽然是一句警告。如果您在提供的界面之外深入研究 API，则可能会因可能会或可能不会宣布的内部更改而导致代码中断。

@Blindman67 Animate CC 是一个包含代码编辑器的图形编辑器，但代码与动画帧相关联。我不是在寻找如何在交付时扩展 API（最终嵌入到网页中使这很容易），而是如何在编译时复制包含代码的 Flash 和 AS2 中的行为，以便它存在于测试构建中无需编码人员每次为我们的艺术家手动添加。

【参考方案1】：

使用最新版本的 Animate CC (15.1.1.13)，您可以轻松编辑用于发布的 HTML 模板。

在“发布设置”中转到“高级”并导出默认模板。打开导出的 HTML 文件并在 <!-- write your code here --> 之后注入任何其他 JavaScript 库。

例如添加<script src="http://code.jquery.com/jquery-2.2.3.min.js"></script> 以使用jQuery。

保存 HTML 文件后，返回“发布设置”并使用“导入新...”导入修改后的模板。

您可以将此方法与您自己的库和相对路径一起使用，只需确保它们在输出文件的目录中可用（默认情况下与 .fla 相同）。

例如<script src="foo.js"></script>

【讨论】：

不像以前那么方便了，但这是迄今为止我见过的最好的解决方案。

这是我将要使用的解决方案，但还有另一个问题与不同的解决方案 - 基本上是在 Animate CC 中添加代码，通过将它们附加到正文来加载您想要的文件。这是一个链接：***.com/questions/36807123/…