最佳做法 - SWF 应用程序创作指南

  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 中处理角色 Rig
    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. 使用视频提示点
    9. 使用 Animate 绘制和创建对象
    10. 改变线条和形状
    11. Animate CC 中的笔触、填充和渐变
    12. 使用 Adobe Premiere Pro 和 After Effects
    13. Animate CC 中的颜色面板
    14. 使用 Animate 打开 Flash CS6 文件
    15. 在 Animate 中使用传统文本
    16. 向 Animate 中置入图稿
    17. 在 Animate 中导入的位图
    18. 3D 图形
    19. 在 Animate 中使用元件
    20. 使用 Adobe Animate 绘制线条和形状
    21. 在 Animate 中使用库
    22. 导出声音
    23. 在 Animate CC 中选择对象
    24. 在 Animate 中使用 Illustrator AI 文件
    25. 使用喷涂刷工具应用图案
    26. 应用混合模式
    27. 排列对象
    28. 使用“命令”菜单自动处理任务
    29. 多语言文本
    30. 在 Animate 中使用摄像头
    31. 将 Animate 与 Adobe Scout 一起使用
    32. 使用 Fireworks 文件
    33. 图形滤镜
    34. 声音和 ActionScript
    35. 绘制首选参数
    36. 用钢笔工具绘图
  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. 最佳做法 - 辅助功能指南
    12. Animate 工作区中的辅助功能
    13. 编写和管理脚本
    14. 启用自定义平台支持
    15. 自定义平台支持概述
    16. 创建辅助内容
    17. 使用自定义平台支持插件
    18. 调试 ActionScript 3.0
    19. 启用自定义平台支持
  8. 导出和发布
    1. 如何从 Animate CC 导出文件
    2. OAM 发布
    3. 导出 SVG 文件
    4. 使用 Animate 导出图形和视频
    5. 发布 AS3 文档
    6. 导出移动应用程序和游戏引擎的动画
    7. 导出声音
    8. 导出 QuickTime 视频文件
    9. 使用 ActionScript 控制外部视频播放
    10. 最佳做法 - 移动设备内容创建技巧
    11. 最佳做法 - 视频惯例
    12. 最佳做法 - SWF 应用程序创作指南
    13. 最佳做法 - 构造 FLA 文件
    14. 在 Animate 中优化 FLA 文件的最佳做法
    15. ActionScript 发布设置
    16. 指定 Animate 的发布设置
    17. 导出放映文件
    18. 导出图像和动画 GIF
    19. HTML 发布模板
    20. 使用 Adobe Premiere Pro 和 After Effects
    21. 快速分享和发布动画

关于 SWF 应用程序指南

创建 Animate 应用程序的最佳方法取决于要创建的应用程序以及构建应用程序所使用的技术。

使用在线应用程序,用户可以通过与应用程序进行交互来影响 Web 站点。 例如,应用程序可以收集用户提供的信息(如注册的用户名和密码),并可能将信息添加到站点(如论坛),用户也可以与其他的站点访问者进行交互(比如通过聊天室或交互式白板)。 来自服务器的结果通常以 SWF 文件形式出现,这取决于交互行为。 这些示例中的应用程序涉及用户和不同类型的服务器交互。 不使用访问者信息或数据的 Web 站点不是应用程序(如公文包、卡通动画或静态信息站点)。 Animate 应用程序包括用户、Web 应用程序和服务器之间的交互过程。基本过程如下:

  1. 用户将信息输入到一个 SWF 文件中。

  2. 信息被转换成数据。

  3. 系统对数据进行格式设置,然后将其发送给 Web 服务器。

  4. Web 服务器收集数据并发送给应用程序服务器(如 ColdFusion、PHP 或 ASP)。

  5. 系统对数据进行处理,然后将其发送回 Web 服务器。

  6. Web 服务器将结果发送给 SWF 文件。

  7. SWF 文件接收已格式化的数据。

  8. 您的 ActionScript 将对数据进行处理,以便应用程序可以使用它。

在构建应用程序时,必须选择一种用于传输数据的协议。 发送或接收数据时,协议将就数据传输格式及其处理服务器响应的方式对应用程序进行通知。 在收到以 SWF 文件形式发送的数据后,必须对数据进行处理和格式设置。 如果您使用了某种协议,那么就无需担心数据会以意想不到的格式出现。 如果使用名称-值对来传输数据,则可以检查数据的格式设置。 请检查数据格式是否正确,以至于不会收到 XML 格式的数据,并且 SWF 文件将知道会收到和处理什么样的数据。

收集数据和对数据进行格式设置

应用程序依靠用户与 SWF 文件的交互。 通常,它依靠将数据输入到表单中的用户。 Animate 提供了多种方法,您可以使用这些方法在 Animate 应用程序中输入数据并对这些数据进行格式设置。之所以存在这种灵活性,是因为您拥有动画方面的功能,并对界面拥有创造性控制,而且您还可以用 ActionScript 来检查错误和执行验证。

用 Animate 来构建表单以收集数据的优点包括以下几点:

  • 更出色的设计控制。

  • 页面刷新次数减少或无需进行页面刷新。

  • 共用资源得以重复使用。

    提示:若要保存从用户那里收集到的信息,可以将它保存在用户计算机上的共享对象中。使用共享对象,您能够在用户计算机上存储数据,这类似于使用 Cookie。 有关共享对象的详细信息,请参阅《ActionScript 2.0 语言参考》或《ActionScript 3.0 语言和组件参考》中的 sharedObject 类。

发送和处理数据

在将信息发送给服务器之前通常应对信息进行处理,即以服务器能够识别的方式对其进行格式设置。 服务器收到数据后,可以用多种方式对数据进行处理,然后以 SWF 文件能够接收的格式将数据发送回 SWF 文件,这些格式从名称-值对到复杂对象不等。

注意:

应用程序服务器的输出的 MIME 类型必须设置为 application/x-www-urlform-encoded。 如果缺少 MIME 类型,则到达 Animate 的结果通常是不可用的。

下表列出了使用 Animate 向服务器发送数据和接收数据的几种选项:

发送数据

描述

LoadVars.sendLoadVars.sendAndLoad

将名称-值对发送到服务器端脚本以进行处理。 LoadVars.send 将变量发送到远程脚本并忽略任何响应。 LoadVar.sendAndLoad 将名称-值对发送到服务器并将响应加载或分析到目标 LoadVars 对象。

XML.sendXML.sendAndLoad

LoadVars 类似,但 XML.sendXML.sendAndLoad 发送 XML 包,而非名称-值对。

getURL

通过使用 getURL() 函数或 MovieClip.getURL 方法,可以将变量从 Animate 发送到帧或弹出窗口。

Remoting

让您轻松实现 Animate 和 ColdFusion、ASP.NET、Java 及其他更多应用程序服务器之间的复杂信息交换。您还可以通过 Animate Remoting 来使用 Web 服务。

Web 服务

Adobe Animate 包括 WebServiceConnector 组件,您可以使用该组件连接到远程 Web 服务、发送和接收数据,并将结果绑定到组件。这使得 Animate 开发人员无需编写任何 ActionScript,即可迅速创建富 Internet 应用程序。

您可以通过使用 WebServiceClasses 来使用远程 Web 服务,但这可能需要编写复杂的 ActionScript。

添加数据加载和验证

在将数据发送给服务器之前,应对取得的所有信息进行验证。 这样可减轻远程服务器的压力,因为如果用户未填写必填字段,服务器就不会处理请求。 绝不能单纯依赖任何应用程序的客户端验证,还必须执行服务器端验证。

即便只是构建简单的注册或登录表单,也应该检查用户是否输入了他们的名称和密码。 在将请求发送给远程服务器端脚本并等待返回结果之前,请务必执行此验证。 切勿只依赖服务器端验证。 如果用户仅输入用户名,则服务器端脚本一定是接收请求、验证发送的数据,然后将一则错误信息返回 Animate 应用程序,指出必须填写用户名和密码。同样,如果仅在客户端(在 SWF 文件内)执行验证,则用户可能会侵入 SWF 文件、避开验证,并试图将恶意数据发送到您的服务器。

客户端验证非常简单,通常只确保表单字段的长度至少为一个字符,或者保证用户输入的是数值而非字符串。 例如,若要验证电子邮件地址,则应确保 Animate 中的文本字段不为空,并且至少包含 @ 符号和点 (.) 字符。 就服务器端验证而言,应添加更复杂的验证并检查电子邮件地址是否属于某个有效域。

您必须编写 ActionScript 来处理从服务器加载到 SWF 文件的数据。 将数据加载到 SWF 文件之后,即可从该位置访问数据。 用 ActionScript 检查数据是否全部加载。 可以使用回调函数或侦听器发送一个信号,指明数据已加载到文档中。

加载数据时,可采用多种方式对数据进行格式设置:

  • 您可以加载 XML,这样您就能使用 XML 类的方法和属性来分析数据和使用它。 如果使用名称-值对,这些对将转变成变量,您可以将它们当成变量来处理。

  • 您可以接收到来自 Web 服务或 Animate Remoting 的数据。

在这两种情况下,都可以接收复杂的数据结构(如数组、对象或记录集),您必须对它们进行适当的分析和绑定。

使用错误处理和调试

应用程序需要具有足够的可靠性,能够预见到某些错误并采取相应处理措施。

在 ActionScript 2.0 中执行错误处理的最佳方式之一是使用 try-catch-finally 块,您可以用它来引发和捕获自定义错误。通过创建自定义错误类,您可以在整个应用程序内重复使用代码,而不必重新编写错误处理代码。 有关引发自定义错误的详细信息,请参阅《ActionScript 2.0 语言参考》中的 Error 类。 有关 try-catch-finally 块的详细信息,请参阅 try..catch..finally(在《ActionScript 2.0 语言参考》中)。

在 ActionScript 3.0 中,使用 flash.errors 类捕获错误。

有关详细信息,请参阅《ActionScript 3.0 编程》中的“在应用程序中处理同步错误”。

组织文件和存储代码

开始组织文件和存储代码之前,请考虑以下原则:

  • 是否将 SWF 文件分为多个 SWF 文件?如果这样,它们应如何交互?

  • 可以在 SWF 文件间共享哪些资源?

  • 要动态加载哪些文件?

  • 以何种方式存储 ActionScript 以及存储位置?

    开发应用程序时,请以有条理的目录结构存储服务器端代码和文件,这与 ActionScript 包中的情况类似。 以这种方式组织代码可以保证代码组织条例清晰并减少代码被覆盖的风险。

    对于大型应用程序,将客户端-服务器通信和服务封装在类中。 使用类有以下几个方面的好处:

  • 可在多个 SWF 文件中重复使用代码。

  • 可以在一个位置集中编辑代码,然后通过重新发布所有 SWF 文件来更新它们。

  • 可以创建单个 API,此 API 可以处理不同的 UI 元素或执行相似功能的其他资源。

使用 MVC 设计模式

MVC 设计模式用于分离应用程序中的信息、输出和数据处理。 应用程序分为三种元素:模型、视图和控制器;每种元素用于处理过程中的不同部分。

模型

将应用程序的数据和规则结合在一起。 应用程序的大部分处理过程发生在设计模式的这一部分。 模型还包含所有组件(例如,CFC、EJB 和 Web 服务)和数据库。 在过程的这一部分,返回的数据并未针对应用程序界面(或前端)进行格式化。 返回的数据可以用于不同的界面(或视图)。

视图

处理应用程序的前端(与用户交互的界面),并呈现模型的内容。 界面指定了模型数据的呈现方式并输出视图供用户使用,而且允许用户访问或处理应用程序的数据。 如果模型发生变更,则会通过推送或提取数据(发送或请求数据)更新视图来反映这种变更。 如果创建混合型 Web 应用程序(例如,包括 Animate 并与页面上的其他应用程序进行交互这样的应用程序),可考虑在设计模式的视图中使用多个界面。 MVC 设计模式支持处理各种视图。

控制器

满足模型和视图处理和显示数据的需要,通常包含大量代码。 控制器根据来自界面(或视图)的用户请求调用模型的任意部分,并包含特定于应用程序的代码。 由于该代码特定于应用程序,因而通常无法重复使用。 但是,设计模式中的其他组件是可以重复使用的。 控制器不处理或输出数据,而是接收用户请求并确定需要调用模型或视图组件的哪个部分,此外还确定将数据发往何处以及如何格式化返回的数据。 控制器用于确保视图可以访问它们必须显示的模型数据的多个部分。 控制器通常用于传递和响应涉及模型和视图的更改。

模型的每个部分在整个过程中都构建为自我包含组件。 如果更改模型的一个部分(例如,重做界面),通常不需要修改过程的其他部分,这有助于减少问题的出现。 如果创建的设计模式正确无误,则可以更改视图,而无需重写模型或控制器。 如果应用程序不使用 MVC,则在任何地方进行更改都会在整个代码中引起连锁反应,与使用特定设计模式相比,这需要进行更多的更改工作。

使用 MVC 模式的一个重要原因是将数据和逻辑与用户界面分离。 通过分离进程中的这些部分,您可以拥有使用相同的模型和未格式化数据的多个不同图形界面。 也就是说,您使用的应用程序可以具有不同的 Animate 界面(例如,Web 界面、Pocket PC 界面、移动电话界面,或者是完全不使用 Animate 的 HTML 界面)。将数据与应用程序的其他部分分离开来可以极大地减少开发、测试甚至是更新多个客户端界面的时间。 类似地,如果有现成的模型可用,则为同一应用程序添加新的前端会更加容易。

如果是构建大型或复杂应用程序,例如电子商务网站或电子教学应用程序,则只能使用 MVC。 使用此体系结构需要规划和理解 Animate 以及这种设计模式的工作原理。请认真考虑不同部分之间的交互方式,这通常需要进行测试和调试。 与典型的 Animate 应用程序相比,使用 MVC 时,测试和调试会更加频繁和困难。如果需要构建更复杂的应用程序,请考虑使用 MVC 来组织您的工作。

创建安全的应用程序

无论是构建用户可以登录和阅读文章的小型门户站点还是构建大型的电子商务站点,都存在恶意用户攻击应用程序的可能。 出于这个原因,请考虑采取以下步骤来确保应用程序的安全。

  • 将需要确保安全的数据发送到 HTTPS。 在将 Animate 中的值发送到远程服务器进行处理之前首先进行加密。

    注意:绝不要在 SWF 文件中存储不希望用户看到的任何信息或代码。使用第三方软件可以轻易地分解 SWF 文件并查看其中的内容。

  • 添加跨域策略,防止未经授权的域访问您的资源。

 

Adobe 徽标

登录到您的帐户