搜索
第15章综合实例创建横幅广告创建元件和实例添加按钮动画和导航创建时间轴动画应用渐变15.1创建横幅广告FlashBasic8或FlashProfessional8看似是非常复杂而难学的程序。之所以会这样，是因为它可以用来完成许多不同的工作，如制作卡通动画、媒体播放器和复杂的软件。本节将向你演示该程序的一些基础方面以及如何使用它们来开始构建实际的项目。不需要了解有关Flash或动画的任何内容即可完成。可以使用Flash8为Web或CD-ROM等设备创建各种不同的元素。首先，借助用来输出SWF文件的Flash创作工具创建一个文件。SWF文件被嵌入到Web页中后，可以将它发布到Internet上。FlashPlayer插件随后显示这些SWF文件，以便Web站点访问者可以查看站点内容或者与之进行交互。SWF文件可以包含视频、MP3声音、动画、图像、数据等。与其他格式相比，使用SWF文件有一个好处，那就是FlashPlayer插件已非常普及。步骤1打开Flash应用程序。默认情况下，Flash显示“开始页”，如下图所示。15.1.1创建新文档通过该页可以选择最近编辑的文档、创建新的Flash文档或ActionScript文件或者使用预置的模板创建新文档。如果使用的是FlashProfessional8，则可以创建其他种类的文件。步骤2在“开始页”的“创建新项目”栏中单击“Flash文档”以创建空白文档。注意：如果Flash未显示“开始页”（如果将计算机共享，则该功能可能已在以前被禁用），则可以选择“文件”|“新建”命令，在打开的“新建文档”对话框的“常规”选项卡中选择“Flash文档”，然后单击“确定”按钮。步骤3选择“文件”|“另存为”命令，在打开的“另存为”对话框中将该文件命名为banner.fla，查找用来保存项目的目录或者创建一个新目录，然后单击“保存”按钮。Flash会将可编辑文档另存为FLA文件。从FLA文件中，能导出（或编译）可嵌入HTML页中的SWF文件。FlashPlayer（大多数计算机上都装有该插件）将播放从Flash导出的SWF文件。注意：最好在开始使用新文档时保存它（而且以后也要经常保存），以防丢失劳动成果。如果未选择任何对象或帧，则可以通过“属性”检查器修改文档本身的属性。步骤1在“属性”检查器的“大小”文本右侧的“文档属性”按钮显示FLA文件当前的尺寸（550×400像素），如下图所示。默认情况下，新Flash文档中的舞台的宽度为550像素，高度为400像素。15.1.2更改文档属性注意：确保未选中帧。如果看不到上图所示的“属性”检查器，单击“舞台”。步骤2若要更改文档属性，单击“文档属性”按钮，打开“文档属性”对话框。步骤3在“尺寸”区域的“宽”文本框中键入160，“高”文本框中键入600，如右图所示，单击“确定”按钮。注意：也可以通过选择“文件”|“新建”命令，在打开的“新建文档”对话框中单击“模板”选项卡，在“类别”文本框中选择“广告”，然后在“模板”列表框中选择所需的模板，如下图所示。步骤4返回到创作环境，请注意文档的尺寸有什么变化，如下图所示。在使用Flash时，经常要向文档中导入资源。或许有一个由设计师为你的工作提供的公司徽标或图形。可以向Flash中导入各种资源，包括声音、视频、位图图像和其他图形格式（如PNG、JPEG、AI和PSD）。导入的图形将存储到文档库中。文档库中既存储导入到文档中的资源，又存储Flash中创建的元件。步骤1选择“文件”|“导入”|“导入到库”命令。步骤2打开“导入到库”对话框，在“查找范围”下拉列表框中浏览到硬盘上包含要在Flash文档中导入的图像的文件夹。15.1.3导入图形步骤5选择“文件”|“保存”命令保存该文档。步骤3选择要导入的图像文件gnome.png，如右图所示，单击“打开”按钮。该图像即会导入到文档库中。注意：如果希望查看插图的多个实例，则可以将库中的资源多次拖到舞台上。如果在舞台上使用多个实例，文件的大小不会增加。SWF文件仅存储库中原始元件或资源的信息，并将每个实例视为一个副本。步骤4选择“窗口”|“库”命令打开“库”面板。将在文档库中看到刚导入的图像gnome.png，如左图所示。步骤5在文档库中选择导入的图像并将它拖到舞台上，如右图所示。不必考虑将该图像放在舞台上的什么位置，因为以后将为该图像设置坐标。如果将某项内容拖到舞台上，则在播放SWF文件时，会看到此内容位于该文件中。步骤6单击“选择”工具，在舞台上选择该实例，并在舞台上拖动位图图像调整其位置。也可以在“属性”检查器的“X”和“Y”文本框中设置坐标。15.1.4图层和时间轴时间轴位于Flash工作区中舞台的上方。时间轴中包含图层和帧，它有助于组织文档中的资源，并且还可以控制文档内容随时间的变化。因为经常需要将对象放在舞台上的特定位置，为了让这些对象保持在适当的位置，Flash允许锁定图层，以便无法在图层上选择项目和防止不小心移动它们。步骤1在“时间轴”中选择“图层1”，然后单击“锁定/解除锁定所有图层”图标下面的点，如下图所示。1．锁定图层提示：在惟一的图层处于锁定状态时，需要添加新图层，才能向舞台中添加任何其他对象。不能向锁定的图层中添加新对象。步骤2在“工具”面板中选择“选择”工具，然后双击名称“图层1”。步骤3在图层名称中键入“背景”以重命名该图层，如下图所示。在所有使用导入图形和动画的Flash项目中，几乎均需要创建几个图层。需要将特定的元素分离到各自的图层上，尤其是在开始制作对象动画时。还可以将图形叠放，甚至通过使用多个图层来营造出深度或重叠的感觉。步骤1在时间轴上选择“背景”图层，然后单击“插入图层”按钮创建新的空图层。2．创建新图层步骤4选择“文件”|“保存”命令保存文档。可以直接在文档库中导入图像，然后将该图像拖到舞台上的选定图层上。还可以将资源直接导入到舞台（而非库）中。3．导入到图层步骤2新图层将在“背景”图层上方创建，如下图所示。步骤3双击新图层的名称，以便该图层的名称变得可编辑。键入“动画”以重命名新图层。舞台上的图形按照时间轴上的图层进行堆叠。例如，放在“动画”图层上的任何内容将出现在“背景”图层上的图像上方。步骤4选择“文件”|“保存”命令保存文档。注意：如果需要重新组织图层，则可以使用“选择”工具选择一个图层，然后将其拖到时间轴上其他图层的上方或下方。步骤1选择“动画”图层的第1帧。步骤2选择“文件”|“导入”|“导入到舞台”命令。步骤3打开“导入”对话框，在“查找范围”下拉列表框中查找图像文件所在的文件夹。步骤4选择图像文件star.png，如右图所示，然后单击“打开”按钮。该图像即会导入到“动画”图层中，随后它将出现在舞台上。提示：刚导入到舞台的图像也将以资源形式出现在“库”面板中。即使将某个资源直接导入到舞台，Flash也总是将导入的资源存储在库中。步骤5在“工具”面板中单击“选择”工具。将舞台上的star.png文件移到该图像中侏儒头部的正上方，如右图所示。步骤6选择“文件”|“保存”命令保存文档。15.1.5添加文本出于装饰性的目的，需要向横幅广告添加一些额外的文本。可以向Flash文档添加几种类型的文本：静态文本、动态文本或输入文本。当需要向舞台添加装饰性文本，或者添加不需要更改或不需要从外部来源加载的任何文本时，静态文本很有用。如果需要从文件、数据库加载文本，或者需要当SWF文件在FlashPlayer中播放时更改文本，则应使用动态文本。如果希望用户在文本字段中键入内容，则应使用输入文本。可以提取输入的文本并将其发送到数据库，让它操作SWF文件中的某物。可以使用“文本”工具添加上述任何一种类型的文本。本例出于装饰性的目的，将向舞台添加一些静态文本。具体操作步骤如下：步骤1选择“插入”|“时间轴”|“图层”命令，插入一个新图层。双击图层的名称并键入“文本”以重命名该图层。步骤2从“工具”面板中选择“文本”工具。步骤3单击舞台顶部附近的某处，在舞台上的字段中键入Overworked?。步骤4选择该文本字段，选中此字段时，文本周围会出现一个边框。步骤5在“属性”检查器的“文本类型”下拉列表框中选择“静态文本”。步骤6在“字体”下拉列表框中选择ArialBlack，在“字体大小”文本框中输入20，设置“文本（填充）颜色”为红色，如下图所示。步骤7从“字体呈现方法”下拉列表框中选择“位图文本(未消除锯齿)”。“消除锯齿”选项有助于使小文本在应用程序中显示得更清晰，但会使大文本显示时带锯齿。由于要为横幅广告创建大文本，因此应使用在创建大文本时具有平滑外观的位图文本。步骤8在“工具”面板中选择“文本”工具，然后在刚才添加的文本下面键入Underpaid?。步骤9选择文本字段，在“属性”检查器中设置文本的属性，如下图所示。步骤10在“工具”面板中选择“文本”工具，然后在前两行文本的下面添加短语Gnome?。步骤11选择此文本字段，在“属性”检查器中设置文本的属性，如下图所示。提示：可在“对齐”面板中设置文本在舞台居中对齐。选择舞台上的文本块，单击“对齐”面板中的“相对于舞台”按钮，然后单击“水平中齐”按钮。步骤12选择“文件”|“保存”命令保存目前的工作。15.1.6创建元件元件是在Flash中创建的对象。元件可以是图形、按钮或影片剪辑，并且可以在整个当前的FLA或其他FLA文件中重用。创建的任何元件都自动添加到文档的库中，因此可以在文档中使用许多次。步骤1在“工具”面板中单击“选择”工具，在舞台中选择导入的star.png图像。步骤2选择“修改”|“转换为元件”命令，打开“转换为元件”对话框，在“类型”区域中选择“影片剪辑”单选按钮，在“名称”文本框中键入joinus，如右图所示。提示：创建元件之后，将在“库”面板中看到该元件的名称joinus。还将在元件名称的旁边看到一个代表影片剪辑的图标，如右图所示。请记住，元件的名称不同于它的实例名称，因为一个元件可以在舞台上有许多实例。例如，可以在将joinus元件的某个实例从“库”面板拖动到舞台上之后，使用“属性”检查器来设置该实例的名称。如果将joinus元件的另一个实例拖动到舞台上，应为其指定一个不同的实例名称。在ActionScript的代码中，使用实例名称来引用和操作实例。为实例指定名称时，必须遵循一些命名准则。步骤3单击“确定”按钮。这意味着将图形图像转换为影片剪辑元件。影片剪辑元件有自己的时间轴，可以在每个影片剪辑实例的时间轴以及文档的主时间轴上将影片剪辑实例做成动画。这是影片剪辑实例所特有的。步骤4选择“文件”|“保存”命令保存目前的工作。15.1.7向时间轴添加动画通过向时间轴（例如，主时间轴或影片剪辑内的时间轴）添加内容可在Flash文档中创建动画。当播放头沿着时间轴移动时，这些帧会依次播放，当以快速连续方式播放时（如同动画书或一卷胶片上的连续帧），即可创建动画。当创建逐帧动画时，每个帧都是关键帧。在补间动画中，可以在动画中的重要位置定义关键帧，而让Flash创建关键帧之间的帧内容。由于Flash文档保存每一个关键帧中的形状，因此只应当在动画中有变化的点处创建关键帧。步骤1选择“修改”|“文档”命令，打开“文档属性”对话框。步骤2在“帧频”文本框中键入18，如右图所示，单击“确定”按钮。帧频越高，意味着动画播放越平滑。通常设置为12帧/秒（fps）。更改fps设置意味着主时间轴和影片剪辑时间轴均以指定的帧频播放。注意：帧频提高还意味着对用户计算机（或CPU）的要求也稍微提高，因为每秒播放的帧数增加了。步骤3在舞台上双击joinus元件实例。以元件编辑模式打开该元件，如右图所示。在该模式下，可以看到影片剪辑元件的时间轴，它独立于主FLA文件的时间轴（双击元件之前看到的时间轴）运行。这意味着动画的播放和停止可以独立于主时间轴上的动画。请记住，影片剪辑仍以文档的帧频（18fps）播放。提示：在元件编辑模式下，正编辑的元件显示正常，而舞台上的其他项则变暗。在这种模式下所做的更改将应用于