用户指南 取消(C)

在 Animate 中通过代码片段添加交互性

 

“代码片段”面板使得非编程人员能够很快就开始轻松使用简单的 JavaScript 和 ActionScript 3.0。借助该面板,您可以将 代码添加到 FLA 文件以启用常用功能。使用“代码片段”面板不需要 JavaScript 或 ActionScript 3.0 方面的知识。

利用“代码片段”面板,您可以:

  • 添加能影响对象在舞台上行为的代码

  • 添加能在时间轴中控制播放头移动的代码

  • (仅限 CS5.5)- 添加允许触摸屏用户交互的代码

  • 将您创建的新代码片段添加到面板

使用 Animate 附带的代码片段也是开始学习 JavaScript 或 ActionScript 3.0 的一种较好的方式。通过查看片段中的代码并遵循片段说明,便可以开始了解代码结构和词汇。

Animate 中的代码片段选项
Animate 中的代码片段选项

准备事项

使用“代码片段”面板时,重要的是理解 Animate 的这些基本原理:

  • 许多代码片段都要求您对代码中的几个项目进行自定义。在 Animate 中,您可以在“动作”面板中执行此操作。每个片段都包含对此任务的具体说明。

  • 包含的所有代码片段都是 JavaScript 或 ActionScript 3.0 代码。

  • 有些片段会影响对象的行为,允许它被单击或导致它移动或消失。您将对舞台上的对象应用这些代码片段。

  • 某些代码片段在播放头进入包含该片段的帧时引起动作立即发生。您将对时间轴帧应用这些代码片段。

  • 当应用代码片段时,此代码将添加到时间轴中的“动作”图层的当前帧。如果您自已尚未创建“动作”图层,Animate 将在时间轴中的所有其他图层之上添加一个“动作”图层。

  • 为了使 ActionScript 能够控制舞台上的对象,此对象必须具有在属性检查器中分配的实例名称。

  • 您可以单击在面板中选择代码片段时出现的“显示说明”和“显示代码”按钮。

将代码片段添加到对象或时间轴帧

要添加影响对象或播放头的动作,请执行以下操作:

  1. 选择舞台上的对象或时间轴中的帧。

    如果选择的对象不是元件实例,则当您应用该代码片段时,Animate 会将该对象转换为影片剪辑元件。

    如果您选择的对象还没有实例名称,Animate 会在您应用代码片段时添加一个实例名称。

  2. 在“代码片段”面板中(“窗口”>“代码片段”),双击要应用的代码片段。

    如果选择的是舞台上的对象,Animate 会将该代码片段添加到“动作”面板中包含所选对象的帧中。

    如果选择的是时间轴帧,Animate 会将代码片段只添加到那个帧。

  3. “动作”面板中,查看新添加的代码并根据片段开头的说明替换任何必要的项。

动作面板中的代码片段

将新代码片段添加到“代码片段”面板。

您可以用两种方法将新代码片段添加到“代码片段”面板:

  • “新建代码片段”对话框中输入片段。

  • 导入代码片段 XML 文件。

要使用“新建代码片段”对话框,请执行以下操作:

  1. 在“代码片段”面板中,从面板菜单中选择“新建代码片段”。

  2. 在对话框中,为您的代码片段输入标题、工具提示文本和 JavaScript 或 ActionScript 3.0 代码。

    您可以单击“自动填充”按钮,添加当前在“动作”面板中选择的任何代码。

  3. 如果您的代码中包含字符串“instance_name_here”,并且您希望在应用代码片段时 Animate 将其替换为正确的实例名称,请选中“自动替换 instance_name_here”复选框。

    Animate 会以名为 Custom 的文件夹将新的代码片段添加到“代码片段”面板。

要导入 XML 格式的代码片段,请执行以下操作:

  1. 在“代码片段”面板中,从面板菜单中选择“导入代码片段 XML”。

  2. 选择要导入的 XML 文件,然后单击“打开”

要查看代码片段的正确 XML 格式,从面板菜单中选择“编辑代码片段 XML”。

要删除代码片段,请在面板中右键单击该片段,然后从上下文菜单中选择“删除代码片段”。

带有 HTML5 的交互式动画

某些动画需要代码片段来支持不同的发布平台。想要了解如何使用代码片段来使动画互动?在本示例结尾观看教程并按照这些步骤操作。

  1. “库”中,单击“发布设置”

  2. 选择 JavScript/HTML

  3. “HTML/JS” 选项卡中,单击“导出”并选择以下选项:

    • 文件名: 键入文件的名称。
    • 保存类型:选择“HTML”。
  4. 单击“确定”

如何增强 HTML5 交互式动画

观看视频以了解如何编辑代码。

更快、更轻松地获得帮助

新用户?