搜索
6.2.4群组图标和计算图标1、群组图标群组图标是一个非常实用的图标，它能将多个被选中的图标组成一个群组，便于管理和读程序，也有利于修改程序。使用群组图标可以将流程线上的图标划分成可以管理的几个模块，使一层流程线上的图标不会太多，程序的结构更加清晰。群组图标的使用方法如下：（1）打开Authorware，创建一个新文件。将一个（群组图标）拖拽到主窗口的流程线上，如图6-61所示。然后双击该群组图标，出现一个新的窗口，右上角标着“层2”，表明该段程序是第2层程序，如图6-62所示。接下来在“层2”窗口中拖拽一些其它图标，如图6-63所示。图6-61图6-62图6-63（2）在主窗口中拖拽一些图标，如图6-64所示。然后将这些图标全部选中，如图6-65所示。接下来点击菜单中的【修改】【群组】选项，则主窗口中会出现一个群组图标，取代了原来选中的图标，如图6-66所示。图6-64图6-65图6-66此时如果双击图6-66中的群组图标，可以看到会出现一个新的“层2”窗口，里面包含的是图6-65中被选中的那些图标。如果想把被群组的图标们还原，可以将图6-66中的群组图标选中后，单击菜单中的【修改】【取消群组】选项，则图6-66中的群组图标就被还原成图6-65中的那些图标了。2、计算图标计算图标的基本功能是编写程序代码。将计算图标拖拽到流程线上后，双击计算图标可以打开计算图标窗口。在计算图标中可以使用Authorware的变量、函数和编程语言编写程序代码。★案例6.12计算图标的使用方法本案例学习制作一个“地球围绕太阳转”的动画效果，其中将用到移动图标中指向固定路径终点的运动类型，重点介绍计算图标的运用以及Quit和Goto两个函数的使用方法。步骤：（1）打开Authorware，创建一个新文件。（2）拖拽一个显示图标到主窗口的流程线上，并命名为“太阳”，如图6-67所示。双击打开这个显示图标，在演示窗口里绘制一个实心填充的红色椭圆，如图6-68所示。图6-67图6-68（3）再拖拽一个显示图标到流程线的“太阳”下面，命名为“地球”，如图6-69所示。按住键盘上的Shift键，双击“地球”显示图标，可以看到打开的演示窗口里已有“太阳”显示图标的内容作为背景，然后绘制一个较小的实心填充的蓝色椭圆，如图6-70所示。小技巧：在Authorware中，Shift键有很多妙用。除了在显示图标里绘制椭圆和矩形时按住Shift键可以变成正圆和正方形外，还有能够将最近一次演示窗口的内容作为背景显示的功能。这个功能通常都用于显示图标或交互图标的编辑中，具体使用方法是在双击准备打开显示图标或交互图标时按住键盘上的Shift键。图6-69图6-70（4）拖拽一个移动图标到流程线的最下面，命名为“地球运动”，如图6-71所示。然后双击打开这个移动图标，在属性窗口里将“类型”改为“指向固定路径终点”，把时间改为3秒，如图6-72和图6-73所示。接下来在演示窗口里选中“地球”后，设置一条闭合的路径（四条折线），注意起点和终点要重合，如图6-74所示。最后，双击各个折点，使得折线变成曲线，并做相应的调整，使得“地球”的运动轨迹是一条闭合的曲线，如图6-75所示。图6-71图6-72图6-73图6-74图6-75这时可以点击属性窗口中的“预览”按钮，看看动画运行的效果。（5）拖拽一个计算图标到流程线的最下面，命名为“动画控制”，如图6-76所示。双击打开这个计算图标，可以看到出现一个类似编程的窗口，然后在该窗口里输入“Quit(0)”，如图6-77所示。接下来点击该窗口右上角的关闭按钮，此时出现一个确认保存的对话框，点击“是”按钮即可，如图6-78所示。图6-76图6-78图6-77运行该程序，可以看到地球绕太阳运转一周后程序退出。如果想让地球绕太阳不停的运转，则只需将计算图标里的内容改为“GoTo(IconID@”地球”)”即可，如图6-79所示。图6-79小技巧：Quit函数的作用是退出程序，Quit(0)表示退出当前程序，多数情况下我们用Quit(0)就足够了。Goto函数的作用是跳转到指定的图标上执行程序。当我们输入了“Goto(”后，系统会自动提示括号里的参数“IconID@”IconTitle””，可以按此提示输入，只需修改引号里的IconTitle为指定的图标名称即可。在关闭计算图标时，会弹出一个确认保存的对话框，选择“是”如果报错，说明输入不正确，请仔细检查输入内容，特别注意不可在中文输入法下输入英文、数字和标点符号，否则很容易引起错误。6.2.5交互控制的实现交互性是多媒体的重要特征之一，Authorware具有强大的交互功能，通过交互图标，可以实现人机对话，可以制作出各种交互效果，开发出界面友好、控制灵活的多媒体应用程序。交互图标一共提供了11种交互方式，即：按钮、热区域、热对象、目标区、下拉菜单、条件、文本输入、按键、重试限制、时间限制和事件。本节将通过多个典型的案例来介绍这些交互方式的使用方法。★案例6.13按钮方式的使用方法本案例学习制作一个“图片欣赏”的交互控制程序，采用按钮方式来实现。本例是后面很多案例的基础，请大家制作完毕后注意保存。步骤：（1）打开Authorware，创建一个新文件。（2）拖拽一个（交互图标）到主窗口的流程线上，并命名为“图片欣赏”，如图6-80所示。接下来再拖拽一个显示图标到交互图标的右边，如图6-81所示，此时会弹出一个交互类型选择的对话框，有11种交互方式可供选择，这里我们选择默认的“按钮”方式，如图6-82所示。图6-80图6-81图6-82（3）给该显示图标命名为“春天”。接下来再依次拖拽三个显示图标到交互图标的右边，分别命名为“夏天”、“秋天”和“冬天”。最后再拖拽一个计算图标到最右边，命名为“退出”。如图6-83所示。图6-83图6-84小技巧：Authorware会以对话框的形式对第一个拖拽到交互图标右边的图标进行交互类型的选择，之后的图标则全部继承了其左边图标的交互属性（包括类型、鼠标形状、激活条件、分支形式等），这种设定非常方便，可以大大提高效率。（4）分别打开四个显示图标，导入相应的春、夏、秋、冬四幅图片，调整图片使其充满整个演示窗口。双击打开计算图标，在编程窗口里输入“Quit(0)”，然后关闭，如图6-84所示。（5）双击交互图标，在打开的演示窗口里可以看到五个以图标名字命名的按钮排成一列，如图6-85所示。可见前面给交互图标右边的图标命名非常重要，因为它们的名字就是按钮的名字。交互图标可以看做是一个加强版的显示图标，因为它具备了显示图标的所有功能（包括工具栏），而且还拥有很多显示图标所不具备的交互功能。图6-85（6）可以用鼠标左键点击选择各个按钮，将其拖拽到演示窗口的任意地方。这里，我们把这五个按钮拖拽到窗口的底部按行排列，如图6-86所示。小技巧：用鼠标拖拽按钮很难保证位置精准，可以用键盘的上下左右键辅助微调。同时选中交互图标中多个按钮的操作，只能通过先用鼠标左键点击一个按钮后，再按住Shift键依次点选其它的按钮才能实现。图6-86图6-87要保证按钮平行即在一条水平线上，可以用如下方法实现：将五个按钮同时选中，然后选择菜单中【修改】【排列】选项，这时会弹出一个排列类型窗口，如图6-87所示，提供了垂直、平行和混排的八种排列方式，本例中选择2行2列的方式即可实现。按钮的形状样式也是可以改变的。例如本例中，双击交互图标和“春天”显示图标的交接处，如图6-88所示。在弹出的属性窗口中，点击最左边的名为“按钮”的按钮，如图6-89所示，可以看到出现了一个按钮对话框，里面有多个系统自带的按钮形状样式可供选择。我们选择一个带阴影效果的按钮样式后，点击“确定”按钮，如图6-90所示。于是在演示窗口中，名为“春天”的按钮就改变成我们选择的样式了。如果对系统自带的按钮形状样式不满意，也可以点击图6-90中的“添加”按钮，导入自己准备的按钮图像素材。图6-88图6-89（7）运行程序，可以看到演示窗口里出现的就是图6-86中所示的内容。这是因为Authorware程序是从上至下、从左至右运行的，本例运行首先会出现交互图标的内容，然后等待用户点选按钮，并运行相应的内容。例如选择“秋天”按钮后，演示窗口出现了对应的“秋天”显示图标里的图片内容，如图6-91和图6-92所示。图6-90图6-91图6-92此时可以发现，图6-92中的秋天图片充满了整个演示窗口，下面一行按钮都不见了。这是因为图片和按钮的层次相同，图片后运行而导致将按钮覆盖到了下面看不见。我们可以通过修改交互图标的层次来解决这个问题。具体方法如下：右键点击流程线上的交互图标，在弹出的下拉菜单中选择“属性”选项，如图6-93所示。然后在属性窗口里点击“显示”按钮，并在相应的“层”扩展栏里输入“2”（无数字即默认为1，这里填比1大的整数都可以），表明将交互图标的层次提升到第2层，超过了那五个按钮的层次（都是默认的第1层），如图6-94所示。图6-93图6-94再次运行程序，点击任一按钮，演示窗口会显示对应的内容，但按钮不会被覆盖，如图6-95所示。如果点击“退出”按钮，则会退出程序。至此，本案例全部做完了，请保存该文件，后面接下来的五个案例都将会在该案例的基础上完成。图6-95★案例6.14热区域方式的使用方法本案例将在上例的基础上，改用热区域方式来实现“图片欣赏”的效果。热区域是应用非常广泛的一种交互方式，它给了设计人员很大的空间来自由发挥，本例将对热区域方式的使用方法、属性和参数设置做较为详细的介绍。步骤：（1）运行Authorware，打开案例6.13中所做的图片欣赏例子。（2）双击交互图标和“春天”显示图标的交接处，如图6-96所示。在弹出的属性窗口中，修改“类型”为“热区域”，并把鼠标形状更换成“手型”，如图6-97所示。图6-96图6-97这时，会发现交接处变成了一个矩形的虚框，说明已转变成热区域方式了。同理，将另外四个图标所对应的类型和鼠标形状都更改成与“春天”相同的设置，如图6-98所示。图6-98（3）双击交互图标，可以看到演示窗口中的按钮都没有了，取而代之的是五个矩形虚框，如图6-99所示。小技巧：这些虚框就是热区域，但在实际运行时是看不见的。我们可以自己绘制一些图形文字或导入图像，再将热区域套上去，实现类似于按钮的交互效果。例如，用圆角矩形绘制一个按钮，然后在按钮中用文字工具输入“春天”两个字，再将名为“春天”的热区域套在绘制的按钮上，这样在运行时可以在演示窗口里看到绘制的按钮和文字，然后鼠标放在上面显示“手型”，点击左键则显示“春天”的图像内容。对于Authorware来说，实际起作用的是热区域，至于热区域里放入什么内容并不重要，这就给了设计人员很大的自由发挥空间，可以根据需求在热区域里放入图像、动画甚至视频等素材，使得多媒体程序更加丰富多彩。图6-99在演示窗口中绘制一些图形文字或导入图像素材，并将相应的热区域套上去，如图6-100所示。图6-100（4）运行程序，可以看到演示窗口里出现的是图6-100所示的内容，与案例6.13不同之处是按钮全部换成了我们自己绘制或导入的素材。下面我们对本例再做一些修改。双击交互图标和“春天”显示图标的交接处，如图6-101所示。在弹出的属性窗口中，修改“匹配”方式为“指针处于指定区域内”，如图6-102所示。这样，当运行程序时鼠标一旦放入该热区域，就会立刻运行对应分支里图标的内容（本例中显示春天图片），如图6-103所示。如果想进一步实现鼠标离开该热区域时，对应分支的内容被擦除（本例中春天图片消失），则可点击属性窗口中的“响应”按钮，在下面的“擦除”类型里选择“在下一次输入之前”，如图6-104所示。图6-101图6-102图6-103图6-104★案例6.15下拉菜单方式的使用方法本案例将在案例6.13的基础上，改用下拉菜单方式来实现“图片欣赏”的效果。下拉菜单也是应用十分广泛的一种交互方式，在Authorware中实现起来比较简单。步骤：（1）运行Author