在 Animate 中使用元件

Animate

Animate

打开应用程序
  1. Adobe Animate 用户指南
  2. Animate 简介
    1. Animate 新增功能
    2. 图示术语表
    3. Animate 系统要求
    4. Animate 键盘快捷键
    5. 在 Animate 中使用多种文件类型
  3. 动画
    1. Animate 动画基础知识
    2. 如何在 Animate 中使用帧和关键帧
    3. 在 Animate 中使用逐帧动画
    4. 如何在 Animate 中使用经典补间动画
    5. 画笔工具
    6. 运动辅助线
    7. 补间动画和 ActionScript 3.0
    8. 关于运动补间动画
    9. 补间动画
    10. 创建补间动画
    11. 使用属性关键帧
    12. 用补间对位置进行动画处理
    13. 如何使用动画编辑器编辑补间动画
    14. 编辑补间动画的运动路径
    15. 处理补间动画
    16. 添加自定义缓动
    17. 创建和应用动画预设
    18. 设置动画的补间范围
    19. 处理另存为 XML 文件的补间动画
    20. 补间动画与传统补间
    21. 形状补间
    22. 在 Animate 中使用骨骼工具动画
    23. 在 Animate 中处理角色操纵
    24. 如何在 Adobe Animate 中使用遮罩层
    25. 如何在 Animate 中使用场景
  4. 交互性
    1. 如何使用 Animate 创建按钮
    2. 将 Animate 项目转换为其它文档类型格式
    3. 在 Animate 中创建和发布 HTML5 Canvas 文档
    4. 在 Animate 中通过代码片段添加交互性
    5. 创建自定义 HTML5 组件
    6. 使用 HTML5 Canvas 中的组件
    7. 创建自定义组件：示例
    8. 自定义组件的代码片段
    9. 最佳做法 - 使用 Animate 制作广告
    10. 虚拟现实创作和发布
  5. 工作区和工作流
    1. 创建和管理画笔
    2. 在 HTML5 Canvas 文档中使用 Google 字体
    3. 使用 Creative Cloud Libraries 和 Adobe Animate
    4. 使用 Animate 的舞台和工具面板
    5. Animate 工作流程和工作区
    6. 在 HTML5 Canvas 文档中使用 Web 字体
    7. 时间轴和 ActionScript
    8. 使用多个时间轴
    9. 设置首选参数
    10. 使用 Animate 创作面板
    11. 使用 Animate 创建时间轴图层
    12. 导出移动应用程序和游戏引擎的动画
    13. 移动和复制对象
    14. 模板
    15. 在 Animate 中查找和替换
    16. 撤消、重做和历史记录面板
    17. 键盘快捷键
    18. 如何在 Animate 中使用时间轴
    19. 创建 HTML 扩展
    20. 图像和动画 GIF 的优化选项
    21. 图像和 GIF 的导出设置
    22. Animate 中的资源面板
  6. 多媒体与视频
    1. 在 Animate 中变形和合并图形对象
    2. 在 Animate 中创建并使用元件实例
    3. 图像描摹
    4. 如何在 Adobe Animate 中使用声音
    5. 导出 SVG 文件
    6. 创建用于 Animate 中的视频文件
    7. 如何在 Animate 中添加视频
    8. 使用 Animate 绘制和创建对象
    9. 改变线条和形状
    10. Animate CC 中的笔触、填充和渐变
    11. 使用 Adobe Premiere Pro 和 After Effects
    12. Animate CC 中的颜色面板
    13. 使用 Animate 打开 Flash CS6 文件
    14. 在 Animate 中使用传统文本
    15. 向 Animate 中置入图稿
    16. 在 Animate 中导入的位图
    17. 3D 图形
    18. 在 Animate 中使用元件
    19. 使用 Adobe Animate 绘制线条和形状
    20. 在 Animate 中使用库
    21. 导出声音
    22. 在 Animate CC 中选择对象
    23. 在 Animate 中使用 Illustrator AI 文件
    24. 应用混合模式
    25. 排列对象
    26. 使用“命令”菜单自动处理任务
    27. 多语言文本
    28. 在 Animate 中使用摄像头
    29. 图形滤镜
    30. 声音和 ActionScript
    31. 绘制首选参数
    32. 用钢笔工具绘图
  7. 平台
    1. 将 Animate 项目转换为其它文档类型格式
    2. 自定义平台支持
    3. 在 Animate 中创建和发布 HTML5 Canvas 文档
    4. 创建和发布 WebGL 文档
    5. 如何打包 AIR for iOS 应用程序
    6. 发布 AIR for Android 应用程序
    7. 发布用于桌面的 Adobe AIR
    8. ActionScript 发布设置
    9. 最佳做法 - 管理应用程序中的 ActionScript
    10. 如何在 Animate 中使用 ActionScript
    11. Animate 工作区中的辅助功能
    12. 编写和管理脚本
    13. 启用自定义平台支持
    14. 自定义平台支持概述
    15. 使用自定义平台支持插件
    16. 调试 ActionScript 3.0
    17. 启用自定义平台支持
  8. 导出和发布
    1. 如何从 Animate CC 导出文件
    2. OAM 发布
    3. 导出 SVG 文件
    4. 使用 Animate 导出图形和视频
    5. 发布 AS3 文档
    6. 导出移动应用程序和游戏引擎的动画
    7. 导出声音
    8. 最佳做法 - 移动设备内容创建技巧
    9. 最佳做法 - 视频惯例
    10. 最佳做法 - SWF 应用程序创作指南
    11. 最佳做法 - 构造 FLA 文件
    12. 在 Animate 中优化 FLA 文件的最佳做法
    13. ActionScript 发布设置
    14. 指定 Animate 的发布设置
    15. 导出放映文件
    16. 导出图像和动画 GIF
    17. HTML 发布模板
    18. 使用 Adobe Premiere Pro 和 After Effects
    19. 快速分享和发布动画
  9. 故障排除
    1. 已修复的问题
    2. 已知问题

 

关于元件

元件 是指在 Animate（以前名为 Flash Professional CC）创作环境中或使用 SimpleButton (AS 3.0) 和 MovieClip 类一次性创建的图形、按钮或影片剪辑。然后，您可在整个文档或其他文档中重复使用该元件。

元件可以包含从其他应用程序中导入的插图。您创建的任何元件都会自动成为当前文档的库的一部分。

实例 是指位于舞台上或嵌套在另一个元件内的元件副本。 实例可以与其父元件在颜色、大小和功能方面有差别。编辑元件会更新它的所有实例，但对元件的一个实例应用效果则只更新该实例。

在文档中使用元件可以显著减小文件的大小；保存一个元件的几个实例比保存该元件内容的多个副本占用的存储空间小。 例如，通过将诸如背景图像这样的静态图形转换为元件然后重新使用它们，您可以减小文档的文件大小。 使用元件还可以加快 SWF 文件的播放速度，因为元件只需下载到 Flash® Player 中一次。

在创作时或在运行时，可以将元件作为共享库资源在文档之间共享。 对于运行时共享资源，可以把源文档中的资源链接到任意数量的目标文档中，而无需将这些资源导入目标文档。 对于创作时共享的资源，可以用本地网络上可用的其他任何元件更新或替换一个元件。

如果导入的库资源和库中已有的资源同名，您可以解决命名冲突，而不会意外地覆盖现有的资源。

可从下列资源获得有关元件的其他介绍性说明：

元件的类型

每个元件都有一个唯一的时间轴和舞台，以及几个图层。 可以将帧、关键帧和图层添加至元件时间轴，就像您可以将它们添加至主时间轴一样。 创建元件时需要选择元件类型。

  • 图形元件 可用于静态图像，并可用来创建连接到主时间轴的可重用动画片段。 图形元件与主时间轴同步运行。 交互式控件和声音在图形元件的动画序列中不起作用。 由于没有时间轴，图形元件在 FLA 文件中的尺寸小于按钮或影片剪辑。

  • 使用按钮元件 可以创建用于响应鼠标单击、滑过或其他动作的交互式按钮。 可以定义与各种按钮状态关联的图形，然后将动作指定给按钮实例。 有关详细信息，请参阅《ActionScript 3.0 开发人员指南》中的处理事件。

  • 使用影片剪辑元件 可以创建可重用的动画片段。 影片剪辑拥有各自独立于主时间轴的多帧时间轴。您可以将多帧时间轴看作是嵌套在主时间轴内，它们可以包含交互式控件、声音甚至其他影片剪辑实例。 也可以将影片剪辑实例放在按钮元件的时间轴内，以创建动画按钮。 此外，可以使用 ActionScript® 对影片剪辑进行脚本编写。

  • 使用字体元件可以导出字体并在其他 Animate 文档中使用该字体。

    Animate 提供了各种内置组件（即带有已定义参数的影片剪辑），您可以使用这些组件将用户界面元素（如按钮、复选框或滚动条）添加到文档中。有关详细信息，请参阅使用 ActionScript 3.0 组件中的关于 ActionScript 3.0 组件。

    要在 Animate 创作环境中预览组件实例中的动画和 9 切片缩放影片剪辑的缩放，请选择“控制”>“启用实时预览”。

创建元件

可以通过舞台上选定的对象来创建元件，也可以创建一个空元件，然后在元件编辑模式下制作或导入内容，并在 Animate 中创建字体元件。 元件可以拥有 Animate 能够创建的所有功能，包括动画。

通过使用包含动画的元件，您可以创建包含大量动作的 Animate 应用程序，同时最大程度地减小文件大小。 如果一个元件中包含重复或循环的动作，例如鸟的翅膀上下翻飞，则应该考虑在元件中创建动画。

若要向文档添加元件，请在创作时或在运行时使用共享库资源。

将选定元素转换为元件

  1. 在舞台上选择一个或多个元素。 请执行下列操作之一：

    • 选择“修改”>“转换为元件”。

    • 将选中元素拖到“库”面板上。

    • 右键单击 (Windows) 或者按住 Control 键单击 (Macintosh)，然后从上下文菜单中选择“转换为元件”。

  2. 在“转换为元件”对话框中，键入元件名称并选择行为。
  3. 在注册网格中单击，以便放置元件的注册点。
  4. 单击“确定”。

    Animate 会将该元件添加到库中。舞台上选定的元素此时就变成了该元件的一个实例。 创建元件后，您可以通过选择“编辑”>“编辑元件”以在元件编辑模式下编辑该元件，也可以通过选择“编辑”>“在当前位置编辑”以在舞台的上下文中编辑该元件。 您也可以更改元件的注册点。

创建空元件

  1. 请执行下列操作之一：

    • 选择“插入”>“新建元件”。

    • 单击“库”面板左下角的“新建元件”按钮。

    • 从“库”面板右上角的“库面板”菜单中选择“新建元件”。

  2. 在“创建新元件”对话框中，键入元件名称并选择行为。
  3. 单击“确定”。

    Animate 会将该元件添加到库中，并切换到元件编辑模式。在元件编辑模式下，元件的名称将出现在舞台左上角的上面，并由一个十字光标指示该元件的注册点。

  4. 要创建元件内容，可使用时间轴、用绘画工具绘制、导入介质或创建其他元件的实例。
  5. 若要返回到文档编辑模式，请执行下列操作之一：

    • 单击“返回”按钮。

    • 选择“编辑”>“编辑文档”。

    • 在编辑栏中单击场景名称。

      在创建元件时，注册点位于元件编辑模式中的窗口的中心。 可以将元件内容放置在与注册点相关的窗口中。 要更改注册点，在编辑元件时，应相对于注册点移动元件内容。

  6. 在“ActionScript 链接”部分中，您可以选择“为 ActionScript 导出”复选框，以便为 ActionScript 导出。将自动显示“类”和“基类”（您可以选择重新为类命名）。Animate 将在一个外部 AS 文件或一个链接的 SWC 文件中搜索类定义。如果 Animate 在这些位置未找到类定义，它将自动生成类文件。

（仅限 Animate ）交换多个元件

使用“交换元件”选项，您可以使用选定的元件或位图来替换元件。

  1. 在您的 Animate 文档中，选择舞台上的多个元件。

  2. 在“属性”面板中，单击“交换”。
  3. 在“交换元件”对话框中，选择您要用来替换所有选定元件/位图的元件。
  4. 单击“确定”。

将舞台上的动画转换为影片剪辑元件

若要在舞台上重复使用一个动画序列或将其作为一个实例操作，请选择该动画序列并将其另存为影片剪辑元件。

  1. 在主时间轴上，选择您想使用的舞台上动画的每一层中的每一帧。 有关选择帧的信息，请参阅在时间轴中插入帧。
  2. 执行下列操作之一来复制帧：

    • 右键单击 (Windows) 或者按住 Control 单击 (Macintosh) 任何选定的帧，然后从上下文菜单选择“复制帧”。 若要在将该序列转换为影片剪辑之后删除它，请选择“剪切”。

    • 选择“编辑”>“时间轴”>“复制帧”。 若要在将该序列转换为影片剪辑之后删除它，请选择“剪切帧”。

  3. 取消选择所选内容并确保没有选中舞台上的任何内容。 选择“插入”>“新建元件”。
  4. 为元件命名。 对于“类型”，请选择“影片剪辑”，然后单击“确定”。
  5. 在时间轴上，单击第 1 层上的第 1 帧，然后选择“编辑”>“时间轴”>“粘贴帧”。

    此操作将把您从主时间轴复制的帧（以及所有图层和图层名）都粘贴到该影片剪辑元件的时间轴上。 所复制的帧中的所有动画、按钮或交互性现在已成为一个独立的动画（影片剪辑元件），您可以重复使用它。

  6. 若要返回到文档编辑模式，请执行下列操作之一：

    • 单击“返回”按钮。

    • 选择“编辑”>“编辑文档”。

    • 单击舞台上方编辑栏内的场景名称。

重制元件

通过重制元件，您可以使用现有元件作为创建元件的起始点。

若要创建具有不同外观的各种版本的元件，也可使用实例。

使用库面板重制元件

  1. 在“库”面板中选择元件，然后执行下列操作之一：

    • 右键单击 (Windows) 或按住 Control 键单击 (Macintosh)，然后从上下文菜单中选择“直接复制”。

    • 从“库面板”菜单中选择“重制”。

通过选择实例来重制元件

  1. 在舞台上选择该元件的一个实例。
  2. 选择“修改”>“元件”>“重制元件”。

    该元件会被重制，而且原来的实例也会被重制元件的实例代替。

编辑元件

编辑元件时，Animate 会更新文档中该元件的所有实例。通过以下方式编辑元件：

  • 使用“在当前位置编辑”命令在舞台上与其他对象一起进行编辑。 其他对象以灰显方式出现，从而将它们和正在编辑的元件区别开来。 正在编辑的元件的名称显示在舞台顶部的编辑栏内，位于当前场景名称的右侧。

  • 在单独的窗口中使用“在新窗口中编辑”命令。 在单独的窗口中编辑元件使您可以同时看到该元件和主时间轴。 正在编辑的元件的名称会显示在舞台顶部的编辑栏内。

    使用元件编辑模式，可将窗口从舞台视图更改为只显示该元件的单独视图来编辑它。 正在编辑的元件的名称会显示在舞台顶部的编辑栏内，位于当前场景名称的右侧。

    编辑元件时，Animate 会更新文档中该元件的所有实例，以反映编辑的结果。 编辑元件时，可以使用任意绘画工具、导入媒体或创建其他元件的实例。

  • 通过使用任意元件编辑方法来更改元件的注册点，该点由坐标 (0, 0) 标识。

 

在当前位置编辑元件

  1. 请执行下列操作之一：

    • 在舞台上双击该元件的一个实例。

    • 在舞台上选择元件的一个实例，右键单击 (Windows) 或按住 Control 键单击 (Macintosh)，然后选择“在当前位置编辑”。

    • 在舞台上选择该元件的一个实例，然后选择“编辑”>“在当前位置编辑”。

  2. 编辑元件。
  3. 要退出“在当前位置编辑”模式并返回到文档编辑模式，请执行下列操作之一：

    • 单击“返回”按钮。

    • 从编辑栏中的“场景”菜单选择当前场景名称。

    • 选择“编辑”>“编辑文档”。

    • 双击元件内容的外部。

在新窗口中编辑元件

  1. 在舞台上选择该元件的一个实例，右键单击 (Windows) 或按住 Control 键单击 (Macintosh)，然后选择“在新窗口中编辑”。
  2. 编辑元件。
  3. 单击右上角 (Windows) 或左上角 (Macintosh) 的关闭框来关闭新窗口，然后在主文档窗口内单击以返回到编辑主文档。

在元件编辑模式下编辑元件

  1. 执行下列操作之一来选择元件：

    • 双击“库”面板中的元件图标。

    • 在舞台上选择该元件的一个实例，右键单击 (Windows) 或按住 Control 键单击 (Macintosh)，然后从上下文菜单选择“编辑”。

    • 在舞台上选择该元件的一个实例，然后选择“编辑”>“编辑元件”。

    • 在“库”面板中选择该元件，然后从“库面板”菜单中选择“编辑”，或者右键单击 (Windows) 或按住 Control 单击 (Macintosh) “库”面板中的该元件，然后选择“编辑”。

  2. 编辑元件。
  3. 要退出元件编辑模式并返回到文档编辑状态，请执行下列操作之一：

    • 单击舞台顶部编辑栏左侧的“返回”按钮。

    • 选择“编辑”>“编辑文档”。

    • 单击舞台上方编辑栏内的场景名称。

    • 双击元件内容的外部。

更多此类内容

更快、更轻松地获得帮助

新用户？

快速链接

查看您的所有计划 管理您的计划
查看快速链接
隐藏快速链接

法律声明    |    在线隐私政策

Copyright © 2024 Adobe。保留所有权利。