第1章 Animate CC动画制作基础 Animate CC是一款优秀的动画、游戏和多媒体制作软件，从其诞生开 始，对它的定义就在不断改变。Animate的前身是大名鼎鼎的Flash，2015 年2月2日，Adobe公司宣布了将Flash Professional未来的版本正式更名 为Animate CC。相较于Flash，Animate CC增加了大量的新特性，是一款 定位于游戏设计、应用程序开发和Web开发的交互式矢量动画设计软件。 本章将介绍Animate CC的界面及基本操作的知识，引导读者进入Animate CC的学习之旅。 本章主要内容： .　Animate CC的工作环境； .　文档的基本操作； .　影片的测试和导出； .　文件的发布。 1.1　Animate CC的工作环境 操作界面是Animate CC为用户提供的工作环境，也是软件为用户提供工具、信息和 命令的工作区域。熟悉操作界面有助于提高工作效率，使操作得心应手。 1.1.1　Animate CC的操作界面 启动Animate CC并创建一个新文档，此时将打开Animate CC的工作窗口并创建空白 影片文档。Animate CC的“传统”工作区界面窗口构成如图1.1所示。 菜单栏 【时间轴】面板 【工具】面板 【文档】面板 舞台 面板组 图1.1　Animate CC的工作窗口 AnimateCC 操作界面 Animate动画制作实用教程（微课视频版） 2 Animate CC的工作窗口主要包括菜单栏、绘图工具箱、时间轴、舞台和面板等构成 要素。 1．菜单栏 菜单栏包含Animate CC的操作命令，主要有【文件】【编辑】【视图】【插入】【修改】 等11个菜单项，单击每一个菜单项都可以弹出一个下拉菜单，使用菜单中的命令将能够 实现各种操作。 2．【工具】面板 【工具】面板是Animate CC的一个重要面板，其中包含了用于图形绘制和编辑的各种 工具，利用这些工具可以绘制图形、创建文字、选择对象、填充颜色、创建3D动画等。 单击【工具】面板中的【折叠为图标】按钮，可以将面板折叠为图标。在面板的某些工 具的右下角有一个三角形符号，表示这里存在一个工作组，单击该按钮后按住鼠标不放， 则会显示工具组的工具。将鼠标移到打开的工具组中，单击需要的工具，即可使用该工 具，如图1.2所示。 在【工具】面板中单击某个工具按钮选择该工具，此时在【属性】面板中将显示工具 设置选项。使用【属性】栏，可以对工具的属性参数进行设置，如图1.3所示。 单击将【工具】 面板折叠为图标 单击打开工具组 图1.2　打开隐藏的子工具组　　　图1.3　在【属性】面板设置工具属性 专家点拨：按F4键将能够显示或隐藏【工具】面板和所有的面板。拖曳【工具】 面板顶端的灰条可以移动该面板，此时面板成为一个浮动面板。将浮动面板拖放到程序窗 口左右两侧的边框上，可以将面板停靠在窗口边框上。 3．【时间轴】面板 【时间轴】面板是一个显示图层和帧的面板，用于控制和组织文档内容在一定时间内 播放的帧数，同时可以控制影片的播放和停止。Animate CC动画与传统的动画原理相 同，是按照画面的顺序和一定的速度来播放影片的。与胶片一样，Animate CC动画将 时长分为帧，每一帧中包含了不同的画面，这些画面分别是一组连贯工作的分解画面， 按照一定的顺序将画面在时间轴中排列，连贯起来播放就好像动起来了。图层就像一 张张透明的玻璃纸，每个图层中包含一个显示在舞台上的对象，一层层地叠加上去就 第1章　Animate CC动画制作基础 3 构成了一幅完整的图画。 Animate CC中的【时间轴】面板主要包含图层、帧和播放头，其结构如图1.4所示。 在面板中，时间轴顶部标题数字指示帧编号，蓝色的标记线为播放头，播放头可以在时间 轴上任意移动，在工具栏中显示出在舞台上的当前帧。如果需要定位时间轴上的某一帧， 可以单击时间轴上的帧格，也可以拖动播放头将其放置到该帧格上。 图层控制区工具栏 帧数栏 时间栏播放头 图1.4　【时间轴】面板 单击【时间轴】面板右侧的按钮将打开一个菜单，使用该菜单中的选项可以对【时 间轴】面板的显示样式进行设置。如勾选【预览】选项，时间轴的关键帧将显示该帧的对 象和动画设置。勾选【时间轴控件-底部】选项，可以将【时间轴】面板中的工具栏放置 到面板的下方，如图1.5所示。 图1.5　设置面板的样式 专家点拨：在【时间轴】面板上双击【时间轴】标签，可以隐藏面板。隐藏后再次 双击该标签将取消面板的隐藏。 4．面板组 面板组是多个面板的集合，其中放置着Animate CC常用的功 能面板，如【颜色】面板、【对齐】面板和【信息】面板等。在面 板组中单击某个按钮，可以直接打开该面板，如图1.6所示。在面 板组中，将按钮拖放到面板组的外面可以使其成为单独的浮动面 板。将一个浮动面板拖放到面板组中可以将该面板添加到组列表 中。同时，在面板组中上下拖放面板按钮可以改变其在面板组中 的位置。 5．舞台和场景 在Animate CC窗口中，对动画内容进行编辑的整个区域称为场景，用户可以在整个 区域内对对象进行编辑绘制。在场景中，舞台用于显示动画文件的内容，供用户对对象进 图1.6　面板组 Animate动画制作实用教程（微课视频版） 行浏览、绘制和编辑，舞台上显示的内容始终是当前帧的内容。 在默认情况下，舞台的背景色为白色，当在舞台区域放置了覆盖整个区域的图形，则 该图形将作为Animate动画的背景。在舞台的周围存在着黑色区域，放在该区域中的对象 可以进行编辑修改，但不会在导出的动画中显示出来。因此，所有需要在最终动画文件中 显示的元素必须放置在舞台中，如图1.7所示。 舞台中的图形，在 播放的SWF文件中 将显示出来 位于舞台之外的对 象，在SWF文件播 放时将无法显示 图1.7　舞台上能够显示的图形 为了方便图形在编辑和绘制时定位，有时需要在舞台上显示网格和标尺。选择【视 图】|【标尺】命令，将可以在场景中显示垂直和水平标尺。选择【视图】|【网格】|【显 示网格】命令，在舞台上将显示出网格，如图1.8所示。 场景中显示的标尺 舞台上显示的网格线 图1.8　显示标尺和网格线 在对图形对象进行编辑制作时，用户可以根据需要对舞台进行操作。如用户可以对舞 台进行旋转，具体的操作如图1.9所示。 在下拉列表中选择需 要进行编辑的场景 拖动鼠标 旋转舞台 单击该按钮，使 舞台居中显示 单击该按钮，使用 鼠标旋转舞台 单击该按钮，剪切 掉舞台之外的内容 在下拉列表中 选择缩放比例 图1.9　舞台上的操作 专家点拨：如果使用Animate CC打开多个动画文件，在默认情况下会在场景的上 方显示相应的选项卡，单击这些选项卡可以在不同的文档中进行切换。 1.1.2　设置工作环境 不同的操作者在使用软件时有不同的操作习惯，因此创建符合自己操作习惯的工作环 境将有助于提高工作效率。Animate CC的界面具有强大的可定制性，用户可以根据需要 通过调整面板的位置和是否显示来改变工作区的布局，同时还可以对工作区和舞台进行设 置，以创建适合自己需要的工作环境。 1．设置首选参数 在Animate CC中，选择【编辑】|【首选参数】|【编辑首选参数】命令将打开【首选 参数】对话框，使用该对话框可以对Animate CC进行全局设置。在对话框左侧列表中选 择设置类型，在窗口右侧对该类参数进行设置。如选择【常规】选项，操作者可以设置常 规首选参数。这里勾选【自动折叠图标面板】复选框，则在单击展开的面板外部时，该面 板将自动折叠，如图1.10所示。 设置工作 环境 Animate动画制作实用教程（微课视频版） 图1.10　【首选参数】对话框 2．自定义【工具】面板 Animate CC的【工具】面板中工具的布局可以根据需要进行设置，下面介绍具体的 操作方法。 （1）在【工具】面板中单击【编辑工具栏】按钮打开【拖放工具】面板，面板中列 出了Animate CC所有可用的工具。【工具】面板中存在的工具，按钮显示为灰色。利用 鼠标将未放置于【工具】面板中的工具拖放到【工具】面板中即可实现该工具的添加， 如图1.11所示。从【工具】面板中将工具拖放到【拖放工具】面板中，可以将该工具从 【工具】面板中删除。 将工具按钮拖放到【工具】 面板中，实现工具的添加 单击【编辑工具栏】 按钮进行选择 图1.11　向【工具】面板添加工具 （2）从【拖放工具】面板中将【拖放间隔条以创建可拆分的分组】按钮拖放到【工 具】面板的需要位置，可以在【工具】面板中创建工具分组，如图1.12所示。 【拖放间隔条以创建 可拆分的分组】按钮 拖放到指定的位置 图1.12　实现分组 3．设置工作区 Animate CC提供了8种样式的工作区布局，它们包括传统、动画、基本、基本功能、 调试、小屏幕、开发人员和设计人员。操作者可以根据不同的操作任务来选择，同时操作 者也可以建立自己的工作区，并在以后的工作中使用。下面介绍新建和管理工作区的操作 方法。 （1）在Animate CC程序窗口中单击【工作区】按钮，在打开的列表的【新建工作区】 文本框中输入需要保存的工作区名称，单击【保存工作区】按钮即可将当前工作区按照输 入名称保存，如图1.13所示。 单击该按钮 保存工作区 输入工作 区名称 单击【工作区】按钮 图1.13　保存工作区 （2）保存的工作区将出现在【窗口】|【工作区】列表中，用户可以直接选择使用， Animate动画制作实用教程（微课视频版） 如图1.14所示。单击【工作区】按钮，在打开的列表中单击保存的工作区右侧的【删除】 按钮将删除该工作区。单击【重置】按钮将重置该工作区，如图1.15所示。 图1.14　选择使用已保存的工作区 单击该按钮 删除工作区 单击该按钮重 置该工作区 图1.15　对保存的工作区进行操作 1.2　文档的基本操作 使用Animate CC制作动画，首先需要掌握其基本的操作技巧。本节将介绍初学者使 用Animate CC必须掌握的文档新建、打开、关闭和设置文档属性等操作的方法和技巧。 1.2.1　新建文档 使用Animate CC制作动画的第一步是创建一个新文档，用户可以创建新的空白文档， 也可以根据模板来创建新文档，下面介绍具体的操作方法。 1．创建空白文档 启动Animate CC，选择【文件】|【新建】命令打开【新建文档】对话框，在对话框 文档的基本 操作 上方列表中选择创建文档类型，如这里选择【角色动画】选项。在【预设】列表中选择预 设动画样式，在【详细信息】栏中设置新文档的【宽】【高】【帧速率】和【平台类型】。 完成设置后，单击【创建】按钮即可创建空白文档，如图1.16所示。 图1.16　【新建文档】对话框 2．从模板创建文档 Animate CC提供了各种类型的应用模板供用户选择使用，选择【文件】|【从模板新 建】命令打开【从模板新建】对话框。在对话框的【类别】列表中选择需要使用的目标类 别，在【模板】列表中选择该类型的目标文件，此时在【预览】窗口中将能看到该模板的 预览图。单击【确定】按钮即可基于选择的模板创建一个新文档，如图1.17所示。 图1.17　【从模板新建】对话框 Animate动画制作实用教程（微课视频版） 1.2.2　设置文档属性 在创建新文档时，可以根据需要对文档的宽度、高度和舞台背景色进行设置。创建文 档后，这些文档的基本属性是可以根据需要重新设置的，下面介绍具体的操作方法。 （1）选择【修改】|【文档】命令打开【文档设置】对话框，在对话框的【舞台大小】 栏的【宽】和【高】文本框中输入数值设置舞台的宽度和高度。在【单位】列表中选择相 应的选项可以设置舞台大小的设置单位，如图1.18所示。 （2）在【文档设置】对话框中单击【舞台颜色】按钮，在打开的调色板中选择颜色即 可实现对舞台背景色的设置，如图1.19所示。 图1.18　【文档设置】对话框　　　　 单击色块 拾取颜色 图1.19　设置背景色 （3）将鼠标放置到【帧频】数字上，拖动鼠标改变影片放映的帧频值，如图1.20所 示。这里，帧频值的大小决定了影片每秒放映的帧数，该值将直接影响到影片放映的快慢， 其单位为“帧/秒”，也就是每秒放映的帧数。另外，单击对话框中的帧频值，将出现文 本，可以直接输入数字对帧频进行设置。在设置完成后，单击【确定】按钮关闭对话框。 （4）在【属性】面板中单击【文档】标签，展开【文档设置】设置栏，同样可以对文 档的属性进行设置，如图1.21所示。 拖动鼠标改 变帧频值 图1.20　设置帧频 图1.21　在【属性】面板中设置文档属性 1.2.3　保存文档 在完成Animate CC文档的创建和制作后，文档需要保存。下面介绍Animate CC中文 档的保存操作。 1．文档的保存 用户创建新文档后，如果是第一次保存，在选择【文件】|【保存】命令时，Animate CC将打开【另存为】对话框。使用该对话框用户可以设置动画文件保存的位置和文件名， 如图1.22所示。完成设置后，单击【保存】按钮文档即被保存。 设置文档保存的位置 设置文档保存的名称 设置文档保存的类型 图1.22　【另存为】对话框 对于已经保存过的文档，文档如果进行了修改，需要对其进行保存。如果选择【文 件】|【保存】命令，文档将直接进行保存。如果需要将文档保存在其他位置或更改文档 名和类型，可以选择【文件】|【另存为】命令，此时将打开【另存为】对话框，完成设 置后单击【保存】按钮即可。 专家点拨：在动画的制作过程中，随时保存文件是一个好习惯，这样可以有效地避 免因为计算机死机或断电等原因造成数据的丢失。在保存文件时，按Ctrl+S组合键将执 行【保存】操作，按Ctrl+Shift+S组合键将 执行【另存为】操作。 2．将文档保存为模板 Animate CC允许将文档保存为模板，选 择【文件】|【另存为模板】命令打开【另存 为模板】对话框。在对话框的【名称】文本 框中输入模板的名称，在【类别】下拉列表 中选择模板类型，在【描述】文本框中输入 对模板的描述，如图1.23所示。完成设置 后，单击【保存】按钮即可将动画以模板的 图1.23　【另存为模板】对话框 Animate动画制作实用教程（微课视频版） 形式保存下来。 专家点拨：用户在关闭文档时，如果该文档是新文档或编辑过而未保存的文档， Animate会给出提示对话框，提示用户是否要保存对该文档的修改。如果需要保存，单击 对话框的【是】按钮；如果需要关闭文档而不保存，则可单击【否】按钮；如果是取消文 档的关闭操作，则可以单击对话框中的【取消】按钮。 3．自动恢复 设计师在制作作品时，往往忘记了文档的保存。此时如果遇到应用程序或操作系统崩 溃，没有保存的文件将再也无法找回，自己辛勤劳动的工作成果将会丢失。Animate CC 为了减少这种情况发生时所带来的损失，提供了自动恢复功能。自动恢复功能能够定时自 动保存当前正在编辑的文档作为备份，这样当遇到程序崩溃时用户还可以利用这个备份文 档找回自己的工作成果。 选择【编辑】|【首选参数】|【编辑首选参数】命令打开【首选参数】对话框，在左 侧的列表中选择【常规】选项，勾选【自动恢复】复选框开启自动恢复功能，在其后的文 本框中输入数值设置自动备份文档的时间间隔，如图1.24所示。完成设置后单击【确定】 按钮关闭对话框，Animate CC将按照设定的时间间隔自动保存当前文档。 图1.24　设置自动恢复 1.2.4　打开和关闭文档 在Animate CC中，打开已有文档和关闭当前正在编辑的文档均有多种方法。下面对 文档的打开和关闭分别进行介绍。 1．打开文档 启动Animate CC后，选择【文件】|【打开】命令将打开【打开】对话框，在该对话 框中选择需要打开的文件后，单击【打开】按钮即可在Animate中打开该文件，如图1.25 所示。 选择需要打开的文档的位置 选择需要打开的文档 图1.25　【打开】对话框 专家点拨：Animate打开文档的方式很多，在程序中按Ctrl+O组合键也可以实现 文档的打开操作。Animate CC在正常安装后，在Windows资源管理器中双击需要打开的 “*.fla”文件可以直接打开该文档。另外，选择【文件】|【最近打开的文档】命令，在下 级菜单中将列出最近打开的文档，单击某个文档可以快速将其打开。 2．关闭文档 在Animate CC中，文档在程序界面中以选项卡的形式打开，单击文档标签上的【关 闭】按钮，可以关闭该文档，如图1.26所示。 单击【关闭】按钮关闭文档 图1.26　关闭文档 专家点拨：按Ctrl+W组合键或选择【文件】|【关闭】命令将能够关闭当前正在 编辑的文档。如果同时打开了多个文档，选择【文件】|【关闭全部】命令可以同时关闭在 Animate CC中打开的所有文档。 Animate动画制作实用教程（微课视频版） 1.3　影片的测试和导出 在动画制作过程中，需要预览动画，对动画效果进行实时修改，这就需要对创作的动 画进行测试。在效果测试满意后，用户可以根据需要将文件导出为指定的文件类型。 1.3.1　预览和测试动画 要预览和测试动画，可以选择【控制】|【测试影片】|【测试】命令，或直接按 Ctrl+Enter组合键，此时即可在Flash播放器中预览动画效果，如图1.27所示。 图1.27　预览动画效果 专家点拨：这里选择【控制】|【测试场景】命令，将能够在Flash播放器窗口中预 览当前场景动画。另外，如果选择【控制】|【播放】命令，或直接按Enter键，将能够在 舞台上预览动画效果。 选择【视图】|【预览模式】，再选择其下级菜单中的命令可以对预览模式进行设置。 例如这里选择【视图】|【预览模式】|【轮廓】命令，舞台上将只显示对象轮廓，如图1.28 所示。 图1.28　显示对象轮廓 影片的测试 和导出 1.3.2　文件的导出 在完成动画的测试后，创建的动画可以导出为需要的文件格式。Animate CC可以导 出的文件格式很多，包括SWF影片、视频影片和图形文件等。 SWF文件是Animate CC默认的文件导出格式，这种格式的文件能够播放所有创建的 动画效果，具有交互功能，而且文件数据量小，能够设置对文件的保护。 选择【文件】|【导出】|【导出影片】命令打开【导出影片】对话框，在对话框 中选择文件的保存路径并设置导出文件的文件名，将【保存类型】设置为【SWF影片 （*.swf）】，如图1.29所示。完成设置后，单击【保存】按钮即可将作品导出为SWF格式 文件。 选择导出路径 输入文件名设置导出文件类型 图1.29　【导出影片】对话框 1.4　文件的发布 Animate CC中能够创建多种文档类型以获得面向各种平台和用途的内容，包括适用 于Web浏览器的HTML5多媒体、用于Flash Player的动画、桌面应用程序和高清视频等。 文件的发布实际上就是为观众创建一个或多个文件以适应不同环境播放的过程。 1.4.1　文件的发布设置 Animate CC创建的文件能够导出为多种格式，为了提高制作效率，避免在每次发布 时都进行设置，可以在【发布设置】对话框中对需要发布的格式进行设置，然后只需要选 择【文件】|【发布】命令即可按照设置直接将文件导出发布了。 选择【文件】|【发布设置】命令打开【发布设置】对话框，在【发布】栏中勾选 【Flash（.swf）】复选框并选择该选项。在【输出名称】文本框中输入文件保存的路径和文 件名，同时在对话框中对有关选项进行设置，如图1.30所示。 文件的发布 Animate动画制作实用教程（微课视频版） 选择该选项 高级设置选项 单击该按钮将打开【选择发 布目标】对话框，可在该对 话框中设置发布位置和名称 图1.30　【发布设置】对话框 专家点拨：在完成发布设置后，单击【发布设置】对话框中的【发布】按钮即可直 接按照设置发布当前文档。 1.4.2　针对HTML5的发布 HTML5是用于浏览器标记网页的HTML规范的新版本，在Animate CC中选择 HTML5 Canvas文档类型，即可将HTML5定义为文档发布的运行环境，文档发布时直接 输出HTML5和JavaScript文件的集合。 1．创建HTML5 Canvas Canvas字面意思是画布，其可以理解为HTML5中的一个标记，运行JavaScript对 2D图形进行渲染和动画处理。Animate CC依赖于CreateJS JacaScript库来生成HTML5项 目canvas元素中的图形和动画。 Animate CC允许直接创建HTML5 Canvas文档，选择【文件】|【新建】命令打开【新 建文档】对话框，在对话框中单击【高级】按钮。在打开的【平台】列表中选择HTML5 Canvas选项。在【详细信息】栏中对文档进行设置，如图1.31所示。完成设置后，单击 【创建】按钮即可创建HTML5 Canvas文档。 图1.31　创建HTML5 Canvas文档 专家点拨：对于基于ActionScript 3.0的动画文档，有两种方法将其转换为HTML5 Canvas动画。一种方法是创建HTML5 Canvas文档后，直接将原文档中的图层复制粘 贴到该文档中。另一种方法是打开ActionScript 3.0动画文档，选择【文件】|【转换为】| HTML5 Canvas命令即可将文件转换为HTML5 Canvas文档。 2．发布设置 对于HTML5 Canvas文档，选择【文件】|【发布设置】命令打开【发布设置】对话框。 单击【选择发布目标】按钮打开【选择发布目标】对话框，在对话框中设置发布文件保存 的文件夹和文件名，单击【确定】按钮完成设置，如图1.32所示。 图1.32　【选择发布目标】对话框 Animate动画制作实用教程（微课视频版） 在【发布设置】对话框中打开【基本】选项卡，对发布的基本参数进行设置，如 图1.33所示。 图1.33　【发布设置】对话框中【基本】选项卡的设置 专家点拨：在【基本】选项卡中，可以进行如下的操作。 . 如果只想让时间轴播放一次，可以取消勾选【循环时间轴】复选框。 . 勾选【导出图像资源】【导出声音资源】和【导出CreateJS资源】复选框，可以 将文档中的相关资源单独导出放置到默认的文件夹中，默认的文件夹是HTML5 Canvas文件所在文件夹中的Image、sounds和libs文件夹，这些文件夹在导出文 件时会自动创建，文件夹的名称是可以在文本框中进行修改的。取消每个复选框 右侧的按钮的按下状态，资源文件将直接放置到文档所在的文件夹中。 . 如果勾选【舞台居中】复选框，在右侧的列表中选择相应的选项可以设置 Animate项目在浏览器窗口中的对齐方式。 . 勾选【使得可响应】复选框可以使Animate项目对浏览器窗口大小的改变做出响 应，在右侧列表中选择相应的选项可以指定Animate项目是响应窗口高度的变 化、窗口宽度的变化还是同时响应两者的变化。勾选【缩放以填充可见区域】复选 框，在右侧列表中选择相应的选项可以设置填充浏览器窗口中可见区域的方式。 . 勾选【包括预加载器】复选框后，在浏览器中播放动画时将首先显示一个标准 循环播放的小动画，该动画将在Animate动画加载完成播放之前播放，以表示 Animate动画文件正在下载中。 打开HTML/JS选项卡，对相关的参数进行设置，如图1.34所示。 图1.34　HTML/JS选项卡中的设置 专家点拨：在HTML/JS选项卡中，可以进行如下的操作。 . 在发布时如果只想更改生成的能够使动画动起来的JavaScript代码，原来的 HTML文件需要保留，则要勾选【发布时覆盖HTML文件】复选框。单击【在 HTML中包含JavaScript】按钮，则发布的文件中将包含项目中所有必要的 JavaScript和HTML代码，每次发布文档时Animate都将覆盖导出文件。 . 勾选【托管的库】复选框，用户在发布文档时将指向一个内容发布网络（即 CDN），其地址为CreateJS的官网，文档将下载这个库。因此，要想保证发布的 文件能够实现动画效果，计算机必须要接入Internet。取消这个复选框的勾选， Animate将CreateJS库作为必须伴随项目文件的单独文件包含在发布文件中。 打开【图像设置】选项卡，对相关的参数进行设置，如图1.35所示。 图1.35　【图像设置】选项卡的设置 Animate动画制作实用教程（微课视频版） 专家点拨：在【图像设计】选项卡中，可以进行如下的操作。 . 勾选【导出图像资源】复选框，将能够把文档中的图像资源导出到指定的文件夹 中。在【导出为】列表中选择相应的选项可以指定图像导出的方式。 . 在【格式】栏中单击相应的按钮可以设置图像导出后的格式，图像可以导出为 PNG和JPEG这两种常见的格式。根据格式选择的不同，用户可以在其下的设置 栏中对导出的图像文件进行设置。 3．发布文档 完成文档发布设置后，单击【发布设置】对话框中的【发布】按钮即可发布文档， Animate CC文档发布进度提示如图1.36所示。 图1.36　文档发布进度 发布完成后，在指定的文件夹中获得发布文件，如图1.37所示。单击文件夹中的 HTML文件，系统将使用默认浏览器打开该文件，如图1.38所示。 图1.37　导出后的文件夹结构 图1.38　浏览器中打开文件 专家点拨：在发布文件时，Animate CC会创建一个HTML文件和一个包含代码 的JavaScript文件，代码用来对资源进行处理。同时，根据发布设置资源文件将放在设定 的文件夹中。如果要在网上分享HTML5项目，只需要将这里的HTML文件、JavaScript 文件和资源文件上传到服务器即可。这里要注意的是，HTML文件可以重命名，但 JavaScript文件和资源文件夹以及资源文件夹中的资源文件不能重命名，否则HTML文件 夹将找不到这些资源文件。 1.5　本章小结 本章介绍了Animate CC动画的应用领域和操作界面，同时对Animate CC的基本操作 和文档发布及发布设置进行了介绍。通过本章的学习，读者能够掌握Animate CC操作界 面的设置、文档打开和保存操作以及影片发布设置，为后面进一步的学习打下基础。 1.6　本章习题 一、选择题 1．Animate CC动画源文件的扩展名是什么？ （　　） A．fla B．xfl C．swf D．asc 2．以下关于【传统】工作区界面布局的描述，错误的是哪一项？（　　） A．应用程序栏位于窗口的右上方 B．【工具箱】停放在窗口的右侧 C．【属性】面板打开并停放在窗口右侧 D．【时间轴】面板位于界面的上方 3．Animate CC无法将动画导出为下面哪种格式的文件？（　　） A．jpg B．png C．avi D．ai 4．要直接在舞台上预览动画效果，应该按下面哪个快捷键？（　　） A．Ctrl+Enter B．Ctrl+Shift+Enter C．Enter D．Ctrl+Alt+Enter 二、填空题 1．在Animate CC程序窗口中，对动画内容进行编辑的整个区域称为　　　，用户可 以在整个区域内对对象进行编辑绘制。　　　用于显示动画文件的内容，供用户对对象进 行浏览、绘制和编辑，默认情况下它为白色。 2．【时间轴】面板是一个显示　　　　　的面板，用于控制和组织文档内容在一定时 间内播放的　　　，同时可以控制影片的　　　　　。 3．将动画导出为SWF影片，可以选择【　　　】|【导出】|【导出影片】命令打开【导 出影片】对话框，同时在【保存类型】下拉列表中选择　　　　　选项。 4．在【发布设置】对话框中，在【发布】栏中选择【Flash（.swf）】选项，如果勾选 Animate动画制作实用教程（微课视频版） 【省略trace语句】复选框，则将取消作品中脚本中的　　　　函数。如果将【脚本时间限 制】设置为20秒，则Flash Player将取消执行超过20秒的　　　　　。 1.7　上机练习与指导 1.7.1　Animate CC界面的操作 使用【传统】工作区，并以此为基础创建一个简洁的操作界面，界面中只包括浮动的 【工具】面板，如图1.39所示，同时将工作区布局保存以备以后使用。 图1.39　只包含浮动【工具】面板的操作界面 主要练习步骤如下。 （1）选择【窗口】|【属性】命令关闭【属性】面板，选择【窗口】|【时间轴】命令 关闭【时间轴】面板。 （2）将面板组拖放到窗口中，单击右上角的【关闭】按钮关闭面板组。 （3）选择【窗口】|【工具栏】|【编辑栏】命令关闭舞台编辑栏。 （4）将【工具】面板拖放到窗口中间。 1.7.2　使用模板并发布为可执行文件 打开Animate CC自带的“随机布朗运动”模板，并将其发布为可执行文件。 （1）启动Animate CC后，在开始页中选择【从模板创建】栏中的【动画】选项。 （2）在打开的【从模板创建】对话框的【类别】栏中选择【动画】，在对话框中间的 【模板】栏中选择【随机布朗运动】选项，单击【确定】按钮打开该模板文件。 （3）选择【文件】|【发布设置】命令打开【发布设置】对话框，在对话框的【其他 格式】栏中勾选【Win放映文件】复选框。设置文件输出的位置和文件名，单击对话框的 【发布】按钮发布文件。