首页 > 网站 > 媒体动画 > 正文

Authorware开发实例:Authorware 6.0网上多媒体课件绘制--7.1 运用热区响应

2024-09-08 19:25:28
字体:
来源:转载
供稿:网友

2. 热区随鼠标移动

在制作提示信息时,每当触发热区之后,都能够在演示窗口内显示提示信息。本例将更进一步使得当鼠标进入热区时,显示提示信息,而一旦鼠标离开热区时,提示信息随之消失。为了区别起见,首先给背景上添加了一些说明文字,然后利用擦除图标将它擦除。

 热区随鼠标移动

(1) 单击工具栏的new按钮,新建一个课件文件。

(2) 将计算图标拖动到流程线上,并命名为“窗口大小”。

(3) 双击“窗口大小”图标,在编辑窗口内输入resizewindow (260,220),将演示窗口的大小定义为260×220像素。

(4) 将显示图标拖动到“窗口大小”的下方,将其命名为“背景”。

(5) 双击“背景”打开演示窗口,将背景图片导入到演示窗口(如图7-8所示)。

(6) 将显示图标拖动到“背景”图标的下方,将其命名为“标题”。

(7) 双击“标题”图标,打开演示窗口。

(8) 在演示窗口内输入“漂亮的背景”,并使用绿色、24及宋体格式化文字。

(9) 将显示图标拖动到“标题”图标的下方,将其命名为“文字”。

(10) 双击“文字”显示图标,打开演示窗口。

(11) 在演示窗口内分别输入“我来了”与“退出”。

(12) 同时选择“我来了”与“退出”,将它格式化为宋体、14及蓝色。

(13) 将“交互”图标拖动到流程线上,将它命名为“热区响应”。

(14) 将群组图标拖动到“热区响应”的右下方,打开response type对话框。

(15) 选中hot spot单选按钮之后,单击ok按钮,关闭打开的对话框。

(16) 将群组图标命名为come。

(17) 双击come图标上方的热区响应标识符,打开热区响应的属性对话框。

(18) 打开match下拉列表框,选择cursor in area选项。

(19) 单击cursor右侧的按钮,打开cursor对话框。

(20) 选择手形作为鼠标的形状之后,单击ok按钮返回热区响应的属性对话框。

(21) 选择演示窗口的热区,将矩形框拖动到“我来了”的上方(如图7-9所示)。

               

              图7-8  导入背景图片                        图7-9  拖动热区边框

(22) 选择热区边框上的控制柄,改变热区边框的大小。

(23) 在response选项卡内,选择erase下拉列表框的before next erase。

(24) 单击ok按钮,关闭打开的热区响应属对话框。

(25) 双击come群组图标,打开新的流程线窗口。

(26) 将擦除图标拖动到流程线窗口,并将其命名为erase。

(27) 双击erase图标,打开擦除图标的属性对话框。

(28) 在icons选项卡内,选中icons to erase单选按钮。

(29) 单击演示窗口的“标题”图标的内容。

(30) 单击ok按钮,关闭打开的擦除图标属性对话框。

(31) 将显示图标拖动到erase图标的下方,并将其命名为come。

(32) 双击打开come的演示窗口,在其中输入“我轻轻地来了”。

(33) 使用绿色、宋体及24格式化输入的文字。

(34) 选择输入的文字,使用ctrl+i组合键,打开文字属性对话框。

(35) 在display选项卡内,单击transition右侧的按钮,将提示信息的过渡效果设置为dissolve,bits。

(36) 在layout选项卡内,打开positioning下拉列表框,选择on screen。

(37) 在initial文本框内,将文字的坐标定义为 (140,75)。

(38) 单击ok按钮,关闭打开的文字属性对话框。

(39) 关闭come群组图标的流程线窗口。

(40) 拖动计算图标到交互图标的右侧,打开response type对话框。

(41) 选中hot spot单选按钮之后,单击ok按钮,关闭打开的对话框。

(42) 将计算图标命名为exit。

(43) 双击exit图标上方的热区响应标识符,拖动热区使它覆盖“退出”。

(44) 改变热区的大小,使它正好与“退出”的大小相符。

(45) 将鼠标的形状设置为手形之后,单击ok按钮,关闭对话框。

(46) 双击exit图标,打开计算图标的编辑窗口。

(47) 在编辑窗口内输入quit( )。

(48) 单击工具栏的播放按钮,观看并测试课件的演示窗口(如图7-10所示)。

(49) 经过修改之后,得到如图7-11所示的课件流程图。

            

             图7-10  演示课件                       图7-11  课件流程图

(50) 保存当前制作的课件文件。

在设置come群组图标的热区响应属性时,由于将erase的选项确定为before next erase,这样每当鼠标离开热区时,显示的“我轻轻地来了”将被擦除。由于将match下拉列表框的选项确定为cursor in area,这样每当鼠标进入热区时,就会显示“我轻轻地来了”,在此之前由于在群组图标内使用了erase按钮,那么它将首先把“漂亮的背景”擦除,才显示“我轻轻地来了”,否则两者将同时出现在演示窗口内。

3. 制作电子相册

在第6章里,曾经通过按钮响应制作了一个电子相册,本例将使用热区响应实现同样的功能。当第一次打开电子相册时,希望首先出现一张相片,而不是一片空白,或者是不相关的图片。在本例中使用了系统函数presskey (“keyname”),它将自动显示由keyname键代表的相片。

 制作电子相册

(1) 在课件创建窗口内,单击new按钮,创建新的课件文件。

(2) 选择modify→file→properties命令,打开文件的属性设置对话框。

(3) 将演示窗口的大小定义为variable。

(4) 将演示窗口的背景定义为浅棕色。

(5) 单击ok按钮,关闭打开文件属性对话框。

(6) 将计算图标拖动到流程线上,并命名为“窗口大小”。

(7) 双击“窗口大小”图标,打开计算图标的编辑窗口。

(8) 将演示窗口的大小定义为320×360像素。

(9) 将计算图标拖动到流程线上,将其命名为“显示第1页”。

(10) 双击“显示第1页”图标,打开计算图标的编辑窗口。

(11) 在编辑窗口内输入presskey (“1”) (如图7-12所示)。

(12) 将显示图标拖动到流程线上,将其命名为“背景”。

(13) 双击“背景”图标,在打开的演示窗口内输入“第1页”、“第2页”、“第3页”、“第4页”及“退出”。

(14) 双击箭头工具,将输入文字的显示模式设置为透明(如图7-13所示)。

              

           图7-12  编辑“显示第1页”图标                图7-13  确定热区响应的位置

(15) 将交互图标拖动到“背景”的下方,并命名为“相册”。

(16) 将群组图标拖动到“按钮”图标的右下角,打开response type对话框。

(17) 选中hot spot单选按钮,单击ok按钮。

(18) 将群组图标命名为1。

(19) 双击群组图标的标识符,打开热区响应的属性设置对话框。

(20) 将演示窗口的虚线框拖动到“第1页”上。

(21) 在key文本框内输入1。

(22) 单击ok按钮,完成热区响应属性的设置。

(23) 双击打开群组图标,将显示图标拖动到流程线上。

(24) 将显示图标命名为a。

(25) 双击a打开演示窗口,在演示窗口内导入第1张相片。

(26) 使用ctrl+i组合键,打开显示图标的属性设置对话框。

(27) 在display选项卡内将图片的过渡效果设置为zoom open。

(28) 在layout选项卡内打开positioning下拉列表框,选择on screen。

(29) 选中initial单选按钮,将图片的位置定位在(160,160)。

(30) 单击ok按钮,完成显示图片属性的设置。

(31) 重复上述(16)~(30)步的操作,添加群组图标2、3及4,并导入相应的图片。(如图7-14所示课件的流程图)。

(32) 将计算图标拖动到群组图标4的右侧,将它命名为“退出”。

(33) 双击“退出”图标,打开编辑窗口。

(34) 在编辑窗口内输入quit (1),并关闭和保存对话框。

(35) 单击播放按钮,观看并测试课件文件。

(36) 保存课件文件。

为了使插入的图片出现在显示图标相同的位置,可导入相同尺寸的图片。此例使用photoshop将图片的大小定义为250×320像素。在确定图片的位置时,将它的位置统一定义在(160,160)处。

在热区响应属性对话框内,其中的response选项卡里有一个重要的perpetual复选框,启用该复选框之后,将使课件始终接受用户的响应。例如,将第一个相片的显示时间定义为10秒时,在此期间单击“第1页”、“第2页”、“第3页”或“第4页”时,都不会得到响应,这是由于未启用perpetual复选框的缘故。一旦启用perpetual复选框之后,在相片的显示时间之内,只要单击热区,都会触发相应的响应。

4. 自动绘制折线

本例的折线是由横坐标及纵坐标的顶点加上用户单击的位置组成的。authorware 6.0使用的坐标系是将水平向右作为x轴的正方向,假设x轴正方向的顶点位于a点,垂直向下作为y轴的正方向,假设y轴正方向的顶点位于b点,因此单击演示窗口的任意一点c之后,将在acb之间连成一条折线。

 自动绘制折线

(1) 在课件创建窗口内,单击new按钮,创建新的课件文件。

(2) 选择modify→file→properties命令,打开文件的属性设置对话框。

(3) 将演示窗口的大小定义为variable。

(4) 单击ok按钮,关闭打开文件属性对话框。

(5) 将计算图标拖动到流程线上,并命名为“窗口大小”。

(6) 双击“窗口大小”图标,打开计算图标的编辑窗口。

(7) 将演示窗口的大小定义为300×320像素。

(8) 将显示图标拖动到流程线上,将其命名为“背景”。

(9) 双击“背景”图标,打开演示窗口。

(10) 在演示窗口内导入如图7-15所示的背景图片。

图7-15  导入背景图片

 (11) 将交互图标拖动到“背景”图标的下方,将它命名为“折线”。

(12) 在“折线”的右侧添加一个计算图标,打开response type对话框。

(13) 选中hot spot单选按钮之后,单击ok按钮。

(14) 将计算图标命名为“单击”。

(15) 双击计算图标的交互属性对话框,打开properties:response对话框。

(16) 打开erase下拉列表框,选择don't erase。

(17) 打开branch下拉列表框,选择continue(如图7-16所示)。

(18) 在演示窗口内拖动虚线框,将整个窗口作为热区响应的范围。

图7-16  设置“单击”图标的交互属性

(19) 单击ok按钮关闭打开的热区响应属性对话框。

(20) 双击“单击”图标,打开计算图标的编辑窗口。

(21) 在其中输入pointx:=clickx、pointy:=clicky(如图7-17所示)。

(22) 在“单击”计算图标的右侧添加一个群组图标,打开response type对话框。

(23) 选中conditional单选按钮之后,单击ok按钮。

(24) 双击群组图标上方的交互标识符,打开properties: response对话框。

(25) 单击conditional标签,打开conditional选项卡。

(26) 在condition文本框内输入true。

(27) 单击response标签,打开response选项卡。

(28) 打开erase下拉列表框,选择don't erase。

(29) 打开branch下拉列表框,选择try again。

(30) 单击open按钮,打开二级流程窗口。

(31) 在二级流程窗口内添加一个计算图标,并将它命名为“画折线”。

(32) 双击打开计算图标的编辑窗口,在其中输入如图7-18所示的程序代码。

                 

           图7-17  编辑计算图标                      图7-18  编辑“画折线”计算图标

(33) 将计算图标拖动到群组图标的右侧,将它命名为“退出”(如图7-19所示)。

(34) 双击“退出”图标,打开编辑窗口。

(35) 在编辑窗口内输入quit (1),并关闭与保存对话框。

(36) 单击播放按钮,观看并测试课件文件。

(37) 保存课件文件。

播放课件时,每当用户在演示窗口内单击一次,都会产生一条折线。由于没有使用擦除图标,这样再次单击时,一条新的折线将添加到演示窗口(如图7-20所示)。在本例中,调用了line(pensize,x1,y1,x2,y2)函数,该函数是绘制一条由点(x1,y1)到点(x2,y2)的直线,线的宽度由pensize控制。

             

                                图7-19  课件的流程图                      图7-20  添加新的折线

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表