使用 HTML 扩展可以对 Animate CC 进行功能扩展。Adobe Extension Builder 3 允许您创建用于 Animate CC 的 HTML 扩展。在此之前,您只能使用 SWF 扩展对 Animate 进行功能扩展。不过,Adobe Extension Builder 3 允许您为 Creative Cloud 应用程序创建 HTML 扩展。为此,您需要下载并安装 Eclipse 和 Extension Builder 3.0。有关详细信息,请访问此链接。
创建 HTML 扩展
要创建 HTML 扩展,可执行以下操作:
启动 Eclipse。
在 New Project(新建项目)向导中,创建一个新的应用程序扩展项目。为该项目提供一个有意义的名称,然后单击 Next(下一步)。
在 New Adobe Application Extension Project(新建 Adobe 应用程序扩展项目)面板中,选择“Adobe Animate”。单击“下一步”。
使用以下可用选项配置扩展:
Bundle ID(绑定 ID)用于唯一标识扩展。
Menu name(菜单名称)是扩展的显示名称。菜单名称显示在 Animate CC 的“窗口”>“扩展 ”菜单中。
Window Details(窗口详情)这些选项用于自定义扩展的窗口类型和大小。
单击 Next(下一步)。
您可以在接下来的几个屏幕中进一步自定义扩展的引用库:
CEP Interface Library(CEP 接口库)提供与主机应用程序实现交互的功能。此选项默认为选中。
Frameworks(框架)用于常见的 Javascript 库,如 jQuery。
Services(服务)包括 Adobe IPC Communication Toolkit,用于实现 Adobe 应用程序、扩展及外部应用程序之间的通信。它作为 Creative Cloud 通信的一个中枢,通过 CEP Service Manager 提供一个消息传送协议。
单击 Finish(完成)将创建一个新的 Eclipse 项目。
在 Animate CC 中调试扩展
可以直接从 Eclipse 运行扩展:
右键单击项目,并选择 Run As(运行作为)> Adobe Flash Extension(Adobe Flash 扩展)。这将启动 Animate CC。
在 Animate CC 中,选择“窗口 ”>“扩展 ”菜单项。这将打开扩展面板。
导出扩展
要分发扩展,需要将其作为一个 ZXP 包导出。之后在 Creative Cloud 应用程序上由 Adobe Extension Manager 下载并运行该 ZXP 包:
在 Eclipse 中,切换到 Script Explorer 视图,右键单击项目并选择 Export(导出)>Adobe Extension Builder 3 > Application Extension(应用程序扩展)。这将显示 Export Wizard(导出向导)。
您必须具有证书才能对扩展包进行签名。浏览到现有证书,或单击 Create(创建),创建一个新的证书。
单击 Finish(完成)。
导出完成后,会在项目文件夹下找到该扩展的 ZXP 包,便可用来分发了。
注意:要安装扩展,需要访问 \.staged-extension\CSXS\manifest.xml 文件并更新 host 标记,以便将 Animate 的最低版本设为 13.0。
在 Animate CC 中安装扩展
您可以使用 Adobe Extension Manager,在 Animate CC 中安装 HTML 扩展。HTML 扩展可帮助您扩展 Animate 的功能。要安装扩展,请参阅此链接。
向 HTML 扩展添加交互性
通过添加控件、定义行为,您可以构建一个 HTML 扩展与 Animate 实现交互,然后获取主机(包括 Animate 和操作系统)环境的有关信息。这可以通过两种方式来实现:
使用 CEP 接口库:CEP 接口库提供一些用于获取主机环境信息的 API 和一个允许您运行 JSFL 的 eval 脚本。要了解有关 CEP 接口库的更多信息,可在 Eclipse 中打开 Help(帮助)> Help Contents(帮助内容)> Adobe Extension Builder > References(参考)。
使用 JSFL:可以使用 CEP 接口库的 Eval 脚本 API 来运行 JSFL 脚本。要了解有关 JSFL 的更多信息,请参阅此链接。
除 JSFL 外,Animate 中的 CEP 架构还提供以下事件,这些事件仅可以用在 HTML 面板中。
com.adobe.events.flash.documentChanged:当前活动文档发生改变时触发。
com.adobe.events.flash.timelineChanged:对当前活动文档的时间轴进行更改时触发。
com.adobe.events.flash.documentSaved:保存当前文档时触发。
com.adobe.events.flash.documentOpened:打开新文档时触发。
com.adobe.events.flash.documentClosed:关闭当前活动文档时触发。
com.adobe.events.flash.documentNew:创建新文档时触发。
com.adobe.events.flash.layerChanged:选择另外的图层时触发。
com.adobe.events.flash.frameChanged:选择另外的帧时触发。
com.adobe.events.flash.selectionChanged:选择舞台上另外的对象时触发。
com.adobe.events.flash.mouseMove:在舞台上移动鼠标时触发。
示例
csinterface.addEventListener("com.adobe.events.flash.selectionChanged", CallbackFunction)
在上面的代码片段中:
csinterface:CEP 接口库的对象。
com.adobe.events.flash.selectionChanged:对象选择发生更改时触发的事件。也可以使用上述任一事件。
CallbackFunction:侦听所触发事件的方法。