在Authorware中制作生动的按钮

在Authorware中制作生动的按钮(1)

在Authorware的交互图标中有一种交互方式是：热区响应，它是指在演示窗口中的一块长方形的区域，鼠标在其范围内所产生的各种操作都会触发指定的事件。利用它可以为按钮产生相应的提示信息，使用户了解这个按钮的功能；另外还使程序更加人性化，界面更加生动。

程序运行效果：当鼠标移到按钮上时，在指定的地方会出现一条提示(或图片)，当鼠标移开时提示消失。提示可以加各种过渡效果，也可以把热区分支下的显示图标换成组图标以实现更多的效果及功能。

方法一

原理：利用热区响应的“指针处于指定区域内（Cursor in Area）”的匹配方式，可以实现鼠标指针只要在设置的热区范围内便可以激活设定的事件，而且所设置的热区在程序运行时并不会显示这一特性，我们可以在按钮上设置一个和按钮一样大小的热区响应，当鼠标移到按钮上时，自定义的按钮便可以显示不同图案，与此同时Authorware 便激活热区所指定的事件(比如显示一幅图)。由于计算机的动作很快，所以在我们看来就像同时发生。我们可以把此热区的擦除方式设置为“在下一次输入之前(Before Next Entry)”，这样在鼠标移出热区（按钮）的范围时，图片自动被擦除。热区激活的图片我们可以把它放在演示窗口的下方或者放在按钮旁边作为按钮的注解。

操作过程：

1、先按《让按钮生动起来》文中所介绍的方法制作一个按钮。

2、拖一个显示图标(Display)到交互图标(Interaction)右侧，在交互类型中选择热区域(Hot Spot)(图1)。

图1

3、双击交互图标,调整好按钮的位置。调整热区域的大小使其正好覆盖于按钮之上(图2)。

图2-1

4、双击热区分支下的显示图标，输入提示文字或插入提示图片。可以加入过渡效果使程序界面更加生动，也可以使用组图标实现更多的功能(图3)。

图2-2

技巧：其实不要以为使用文字就不如图片漂亮，使用文字有一个最大的好处就是可以设置一个变量，通过改变变量的值显示各种字符。（想想看，中英文提示互译，多酷！）

怎样在authorware 4.0中制作动态按钮怎样在authorware 4.0中制作动态按钮

我们在与光盘进行交互操作时，经常要用鼠标对按钮进行操作。这些按钮是怎样制作生成的呢？通常，许多工具软件中都带有标准按钮，如vc、vb，同样在authorware中也带有标准的按钮库。但是，这些按钮一般都很相似，呈现在屏幕上的都是灰色的长方型或圆型按钮，显得生硬而呆板。如何制作出形象生动的按钮呢？我告诉大家一种简单有效的方法，您学完之后，便可以在authorware 4.0中制作出自己喜爱的动态按钮。

下面，我们以制作一个“退出”动态按钮为例来讲解。

首先，要利用图形处理软件(如photoshop)制作按钮的原始图像。我们知道，一个形象而又漂亮的动态按钮通常有三种状态，即：平常状态、鼠标划过时的状态及鼠标点击时的状态。因此，我们预先做好“退出”按钮的三种状态的图像，即“退出1”、“退出2”及“退出3”，如图1所示。

图1 “退出”按钮三种状态的原始图像

在制作好“退出”按钮的三种状态图像后，将图像保存起来。假定将这三幅图像存到c:\my documents\文件夹中。现在，可以将这三幅图像“退出”按钮链接到authorware 4.0中，生成动态按钮。我们通过编写一段小程序来完成动态按钮的制作，具体操作如下。

1. 启动authorware 4.0，建立一个新文件，屏幕上出现一空白的程序“设计窗口”，如图2所示。

图2 设计窗口界面

2. 用鼠标从设计图标面板上拖入一个“交互图标”放到主流程线上，并将此“交互图标”命名为“退出交互”。

3. 用鼠标从设计图标面板上拖入一个“组图标”放到“退出交互”图标的右下方，这时屏幕上自动出现“响应类型”(response type)对话框，如图3所示。在确定选中“button”类型后，点击“ok”按钮，退出“响应类型”对话框。然后，将此“组图标”命名为“退出操作”。现在，屏幕上的“设计窗口”的内容应如图4所示。

图3 响应类型对话框

图4 设计窗口中的程序流程

现在，我们该制作动态按钮了。双击“退出操作”组图标上方的“响应类型”图标，屏幕上立即出现“响应类型属性”（properties:response）对话框，如图5所示。我们对“响应类型属性”对话框进行如下设置。

图5 响应类型属性对话框

（1)将对话框正上方命名栏中的按钮名称更改为“quit”。

（2)确定对话框的type栏为“button”类型。

（3)确定对话框下方的“button”按钮为激活态。设置location栏中的…x,y‟座标为50,350。点击cursors栏右方的下拉按钮，并在打开的光标库中选择手型光标，点击“ok”键退出光标库。这时，“响应类型属性”对话框的各参数如图6所示。

图6 响应类型属性对话框的各参数设置

（4)双击对话框左上角的“quit”按钮，或单击对话框左中方的“buttons...”按钮，屏幕上立即出现“按钮库”（buttons）对话框，库中有各种“quit”标准按钮供选择，并可随时添加用户自己编辑的按钮，如图7所示。现在，我们可以将自己预先制作好的“退出”按钮图像链接进来，在按钮库中生成新的按钮—“退出”按钮。

图7 按钮库对话框

1）点击“按钮库”对话框左下方的“add...”按钮，屏幕出现“按钮编辑器”（button edit）对话框，如图8

所示。

图8 按钮编辑器对话框

2）确定选中“按钮编辑器”对话框左上方“normal”状态的“up”（即平常状态）项，点击对话框右下方“graphic”栏右边的“import...”按钮，屏幕出现“输入文件”(import which file?)对话框，如图9所示。

图9 输入文件对话框

3）在“输入文件”对话框中，选择我们已制作好的“退出1”按钮图像的路径和文件名，即：c:\my documents\退出1.bmp文件。选择好后，点击“import”按钮，退出“输入文件”对话框，返回到“按钮编辑器”对话框中。这时，在“按钮编辑器”对话框的右上方出现了新输入的“退出1”按钮图像。

4）确定选中“按钮编辑器”对话框左上方“normal”状态的“down”(即鼠标点击时状态)项，点击对话框右下方“graphic”栏右边的“import...”按钮，屏幕出现“输入文件”(import which fi le?)对话框。

5）在“输入文件”对话框中，选择我们已制作好的“退出3”按钮图像的路径和文件名，即：c:\my documents\退出3.bmp文件。选择好后，点击“import”按钮，退出“输入文件”对话框，返回到“按钮编辑器”对话框中。这时，在“按钮编辑器”对话框的右上方，出现了新输入的“退出3”按钮图像。

6）确定选中“按钮编辑器”对话框左上方“normal”状态的“over”(即鼠标划过时状态)项，点击对话框右下