cc新建html文档,使用 Animate CC 创建 HTML 扩展 - Adobe Animate 用户指南

使用 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:侦听所触发事件的方法。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值