制作交互式效果.ppt
《制作交互式效果.ppt》由会员分享,可在线阅读,更多相关《制作交互式效果.ppt(197页珍藏版)》请在三一办公上搜索。
1、第7章 制作交互式效果,7.1 通过按钮实现交互,通过按钮交互是最直观的交互方法,可以在演示窗口中创建按钮,用按钮实现观看者与计算机的交互,按钮的大小和位置以及名称都可以改变,并且还可以加上伴音。系统提供了标准的按钮,如果你不满意的话,也可以用自己通过其他软件制作或从其他地方收集来的按钮。本例制作中学化学课中的“烃的同分异构”课件,运行课件程序时,在界面上出现课件标题及四个按钮,单击其中一个按钮,出现相应内容的介绍,课件运行的主界面如图7-1所示。,图7-1 效果图,【知识要点】&向课件中加入按钮并实现交互。&设置按钮的大小。&将按钮放在所需要的位置。&改变按钮标识。,【制作过程】在流程线上放
2、一个“标题”显示图标及一个交互图标,将交互类型设置为按钮响应,交互的每个按钮和相应的显示内容对应吻合。流程图如图7-2所示,具体步骤如下:(1)新建一个Authorware文件,并将其以“按钮响应”为文件名保存起来。(2)选择“修改”“文件”“属性”命令,打开“属性:文件”对话框,如图7-3所示。(3)在“属性”对话框的“大小”列表框中选择“640480”,在“选项”选中“演示居中屏幕”,其他选项不选,并单击“确定”按钮。,图7-2 课件的流程图,图7-3“属性:文件”对话框,(4)在流程线上放一个显示图标,并命名为“标题”。(5)双击“标题”显示图标,在打开的演示窗口中,按如图7-4所示输入
3、文字和图片,并设置好文字的格式与图片的位置。(6)用鼠标拖一个交互图标到流程线上,并将该图标命名为“学习内容”。(7)拖一个显示图标到交互图标右侧,打开如图7-5所示的“响应类型”对话框。(8)选中“按钮”单选项,单击“确定”按钮,返回到程序设计窗口,将该显示图标命名为“异构含义”。,图7-4 标题图标中的内容,图7-5“响应类型”对话框,(9)双击流程线上“异构含义”显示图标上方的响应标志,打开如图7-6所示的“属性:响应”对话框,如图7-6所示。图7-6“属性:响应”对话框,(10)在“按钮”选项卡中,在“大小”项的“X”和“Y”框中输入适当的数值来定义按钮的大小。(11)单击“按钮”按钮
4、,打开如图7-7所示的“按钮”对话框。,图7-7“按钮”对话框,(12)在“系统按钮”下拉列表框中选择适当的字体和字号,单击“确定”按钮,回到“属性:响应”对话框,这样便完成了按钮字体的设置。(13)双击“异构含义”显示图标,打开窗口,输入文字,并添加一个矩形框,设置其填充颜色,如图7-8所示。,图7-8 向“异构含义”显示图标中添加文字,(14)在“导构含义”显示图标的右边放两个显示图标,并分别命名为“异构判断”和“异构书写”,参照(9)(13)设置相应按钮的大小及字体,并输入文字等到相应的显示图标中,如图7-9所示。,图7-9 向另外两个显示图标中输入文字,(15)选定“异构含义”显示图标
5、,单击菜单“修改”“图标”“属性”命令,打开“属性:显示图标”对话框,在“显示”选项卡中选中“擦除以前内容”复选框,如图7-10所示。重复上述步骤,分别在“异构判断”和“异构书写”显示图标的属性对话框中设置其显示方式为“擦除以前内容”。,图7-10 选中“擦除以前内容”复选项,(16)双击流程线上的“学习内容”交互图标,在演示窗口中,分别选定各按钮,调整按钮的大小。在按住Shift键的同时分别单击各个按钮,将所有的按钮选定,选择“修改”菜单中的“对齐”命令,打开“对齐”对话框,将按钮对齐并使它们之间的距离相同,并将按钮移动到演示窗口的适当位置。(17)选定其中一个按钮,选择“修改”“图标”“属
6、性”命令,打开“属性:交互作用图标”对话框。,(18)在对话框的“显示”选项卡中的“层”框内输入“1”,单击“确定”按钮,这样可以把按钮的显示位置定义为第一层,当一个按钮定义完成后,其他按钮便自动和此按钮处于同一层,不需另外定义。本操作的目的是为了使课件运行时按钮始终处于最上层,从而避免图片的遮挡而影响程序的运行。(19)拖动一个计算图标到“异构书写”图标的右侧,并命名为“退出”。双击该计算图标,输入命令“Quit()”。(20)运行程序,观看课件的运行结果。,7.2 通过热区响应实现交互,在课件中导入一个不可见的矩形区域,采用交互的方法,如在该区域内单击、双击或把鼠标指针移到该区域内,程序就
7、会沿该响应分支的流程线执行,区域的大小和位置可以根据需要在演示窗口中任意调整。本例制作的是高中文言文“邹忌讽齐王纳谏”一课中字、词的解释部分。课件运行时,在演示窗口中显示了本课全文,并对重点字、词用蓝色特别标出。当鼠标指针指向难点字、词时,将变成的形状,单击鼠标,在窗口右侧将显示对该字、词的解释,如图7-11所示。,图7-11 课件运行效果,【知识要点】&在课件中引用热区响应。&热区响应的属性设置。【制作过程】在“邹忌讽齐王纳谏”课件中使用了热区域响应,对重点字词进行解释,其流程图如图7-12所示。,图7-12“难点释疑”群组的流程图,具体制作步骤如下:(1)向流程线上拖放一个显示图标,并设置
8、其名称为“全文”,双击显示图标,打开演示窗口,导入添加选定的背景图片,并设置图片铺满整个演示窗口。(2)向演示窗口中添加“返回”图片,并将它放置在窗口右下角。(3)单击“文本”工具,然后在“演示窗口”中输入文章全文。设置文本的字体为“宋体”,设置字号为14号,文本颜色为红色。,(4)单击“文本”工具,将“I”型光标移动到“窥”字左侧,按住左键拖动鼠标,选取“窥”字,设置该字符颜色为蓝色。按照同样的方法,设置全文中的重点字词颜色为蓝色。(5)单击工具窗口中的“矩形”工具按钮,绘制一个矩形。设置其前景色为浅橙色;背景色为浅黄色并双击斜线工具,打开线条设置面板,单击需要的线宽;双击矩形工具,打开填充
9、样式面板,选择方块填充样式,如图7-13所示。,图7-13 选择矩形的填充方式,(6)向演示窗口中添加文本“邹忌讽齐王纳谏”,并设置字体为“华文彩云”,字号为20。(7)单击选取工具,单击选定文本“邹忌讽齐王纳谏”,按下Shift键的同时,单击选定矩形框,单击菜单“修改”“群组”命令,将上述两个对象组合为一个整体。(8)在演示窗口中绘制一个矩形,设置其框线颜色为灰绿色,背景色为浅灰色,双击矩形工具,打开填充样式面板,选择背景色填充,如图7-14所示。,图7-14 选择矩形填充样式,(9)将交互图标 拖放到“疑难释疑”流程线上,并命名为“难点”。(10)拖放一个显示图标 到“难点”交互图标的右侧
10、,此时将弹出“交互类型”对话框。(11)在“交互类型”对话框中,设置相应类型为“热区域”,如图7-15所示。单击“确定”按钮,关闭“交互类型”对话框,并设置该图标的名称为“窥”。,图7-15 选择“热区域”交互类型,(12)双击打开“全文”显示图标,按下Shift键的同时双击“窥”图标上方的响应标志,弹出“属性:交互”对话框(13)在演示窗口中将看到一个标有“窥”字符的矩形虚线区域,拖动该虚线区域,使其大小和位置围住全文中的“窥”字,如图7-16所示。,图7-16 调整热区域的位置和大小,(14)单击“属性:交互”对话框中“鼠标指针”框旁边的按钮,弹出“鼠标指针”对话框,从中选择一种指针样式,
11、如图7-17所示。单击“确定”按钮,关闭该对话框,返回“属性:交互”对话框,该对话框的其他设置使用默认值。单击“确定”按钮,关闭该对话框。,图7-17 选择鼠标指针,(15)按下Shift键的同时双击“窥”显示图标,向该显示图标中添加文字“窥:仔细地看”,并设置其颜色为蓝色,字体为“楷体”,字号为14。,图7-18 使文本位于方框内,(16)单击文本工具,将“I”形光标移动到“窥”字左侧,按住左键拖动鼠标,选定“窥”字。单击菜单“文本”“大小”,从子菜单中选择“18”,设置该字符为18号字。调整文本的位置,使它位于“全文”显示图标右侧的空白方框中,如图7-18所示。(17)拖放一个显示图标到“
12、窥”显示图标的右侧,设置其名称为“孰与”。(18)按照上述步骤,分别为各字、词设置热区域响应和对应的解释文本。,(19)在“难点”交互图标的最右端放置计算图标,并设置其名称为“返回”。(20)双击“返回”计算图标,在公式窗口中输入命令“GoTo(IconID主界面)”。(21)保存并调试程序。,7.3 通过热对象响应实现交互,与热区域响应不同,热对象响应是一个实实在在的对象,而不是一个区域。对象可以是任何形状,而不一定是矩形。下面制作一个课件,来展示几幅动物图片与简介。课件运行时,运行界面上有几张动物的图片,单击其中的一张图,将出现关于该动物的简介文字,再单击任意键,返回如图7-19所示的开始
13、运行界面。,图7-19 效果图,【知识要点】&在课件中引用热对象响应。&对热对象响应属性进行设置。【制作过程】通过热对象响应实现交互应首先在流程线上分别导入要展示的图片的缩略图,然后在交互图标上放一组群组图标,群组图标中含有简介文字,流程图如图7-20所示。,图7-20 流程图,具体制作步骤如下:(1)新建一个文件,属性设置“大小”为800600(SVGA),“选项”栏中选中“演示居中显示”和“显示菜单栏”,其他项不选。,图7-21 输入文字,(2)在流程线上放一个显示图标,命名为“标题”。双击“标题”显示图标,在打开的演示窗口中输入文字,并设置字体为“隶书”,字号为48,如图7-21所示。(
14、3)在流程线上添加三个显示图标,分别导入猴子、企鹅和猪的图片。(4)同时打开上述显示图标,用鼠标将图片拖动到适当的位置,并调整它们的大小。(5)在流程线上放一个交互图标,并命名为“热对象响应”。,(6)在交互图标的右侧放一个群组图标,命名为“HZ”,在打开的“响应类型”对话框中选择“热对象”响应。(7)双击“HZ”群组图标上的响应类型,打开如图7-22所示的“属性:交互”对话框,单击演示窗口中的猴子图片,设置响应对象为“猴子”显示图标。分别在该对话框的“热对象”、“交互”选项卡中进行设置,如图7-22和图7-23所示。,图7-22“属性:交互”对话框中的“热对象”选项卡,图7-23“属性:交互
15、”对话框中的“交互”选项卡,(8)设置完成后,单击“确定”按钮,关闭“属性:交互”对话框。(9)双击“HZ”群组图标,打开二级流程图,如图7-24所示。,图7-24 流程图,(10)向“猴子简介”显示图标中添加说明文字和图片,如图7-25所示。图7-25“猴子简介”显示图标中的内容,(11)在“猴子简介”下面放置一个等待图标,等待图标的属性设置为敲击任意键或单击鼠标等待,如图7-26所示的“属性:等待图标”对话框。,图7-26“属性:等待图标”对话框,(12)在等待图标的下方放一个计算图标。双击计算图标,在打开的设置窗口中输入“GoTo(IconID热对象响应)”命令,如图7-27所示。设置此
16、项的目的是为了在程序运行到本图标后,返回到“热对象响应”交互图标处重新运行。,图7-27“返回”对话框,(13)参照“HZ”群组图标的设置方法,再在交互图标的右侧放两个群组图标,并分别命名为“QE”、“ZH”。(14)参照“HZ”群组图标的设置方法,分别将企鹅和猪的简介文字和图片添加到相应的显示图标中,如图7-28所示。,图7-28 向其他显示图标中添加简介文字和图片,(15)参照“HZ”群组图标的设置方法,在各群组图标中放置等待图标和计算图标,并对图标的属性进行设置。(16)保存文件,运行并调试课件。,7.4 通过目标移动响应实现交互,目标移动响应就是移动对象使其到目标区域,这时程序就沿着指
17、定的流程线执行。这里需要确定的是要移动的对象及目标区域的位置。下面制作“安装实验装置图”课件,该课件运行时,在界面上有一些与实验室制取氯气有关的实验仪器,用鼠标拖动各仪器到适当的位置后组成一个完整的实验装置图,如图7-29所示。,图7-29 效果图,【知识要点】&在课件中应用目标移动响应实现交互。&设置目标移动响应的有关属性。【制作过程】通过目标移动响应实现交互需首先在流程线上放一个显示图标,在该显示图标中导入一个事先准备好的完整的实验装置图作为制作课件时的参照物,待课件设计完后,再将其从流程线上删除,流程图如图7-30所示。,图7-30 流程图,具体制作步骤如下:(1)从本书所附光盘素材库中
18、,向流程线上的显示图标“边框.jpg”导入“边框.jpg”文件作为课件的边框。选择流程线上的该显示图标,按Ctrl和=键,在打开的窗口中输入“Movable:=0”,使程序运行后本显示图标中的内容不可移动。做完本操作后,显示图标的左上角多了一个“=”符号。(2)在流程线上放一个显示图标,将该图标命名为“实验装置参考图”。双击该图标,在打开的演示窗口中导入本书所附光盘素材库中的“实验室制取氯气装置图.bmp”,作为程序设计时的参照物。(3)在流程线上再放一个显示图标,命名为“标题”。,先双击“实验装置参考图”显示图标,然后在按住Shift键的同时双击“标题”显示图标,使“实验装置参考图”显示图标
19、和“标题”显示图中的内容同时出现在演示窗口中,作为输入本显示图标内容的参考图。在演示窗口的上部输入标题文字“实验室制取氯气装置图”,设置字体为“宋体”,字号为24,文字颜色为红色。在实验装置图的下面画一条直线,代表实验桌所在平面,参见运行界面,如图7-29所示。,(4)在流程线上放一个显示图标,命名为“提示文字”,按住Shift键(为了把上一次演示窗口的内容一块显示出来),双击该显示图标,在演示窗口中的实验装置图的铁架台位置输入“铁架台”三个字,设置字体为“宋体”,字号为24,文字颜色为红色。“铁架台”这三个字作为学生安装实验装置图的提示,学生在铁架台安装好后要将此文字擦除。其他仪器位置不需要
20、文字提示,学生可以以铁架台为对照物进行安装,如图7-31所示。,图7-31 输入提示文字,(5)参照流程图,从本书所附光盘素材库中分别导入“铁架台.bmp”到“导管2.bmp”文件,在流程线上增加了“铁架台.bmp”到“导管2.bmp”显示图标。(6)将“开始”图标放到“提示文字”显示图标的下方,运行程序,让各显示图标中的实验装置图出现在演示窗口中。,用鼠标双击其中一个装置,使其四周出现6个白色控制点。双击绘图工具栏上的“箭头”按钮,在打开的“透明模式”对话框中选择第3个透明显示模式。单击绘图工具栏右上角的关闭按钮将其关闭,再双击其他装置图,按同样的方式进行透明模式的设置,直到所示的实验装置都
21、完成此操作。用鼠标分别单击实验装置图,使其出现6个灰色的控点,再用鼠标拖动装置图,参照课件运行界面图将其排列整齐。单击工具箱中的“开始”,将“开始”图标放回原处。,(7)在流程线上放一个“交互”图标,命名为“移动响应”。(8)在“移动响应”交互图标的右侧放一个群组图标,在打开的“交互类型”对话框中选择“目标区域”,命名该群组图标为“铁架台正确位置”。(9)运行程序,将流程线上的所有显示图标中的内容显示在演示窗口中。(10)双击“铁架台正确位置”群组图标上的响应标志,打开如图7-32所示的“属性:交互”对话框。(a)“属性:交互”对话框中的“目标区”选项卡(b)“属性:交互”对话框中的“交互”选
22、项卡,图7-32“属性:交互”对话框,单击演示窗口中的铁架台,将其作为移动对象。按如图7-32(a)和(b)所示对“属性:交互”对话框进行设置,并用鼠标将其拖动到屏幕的边上以便下面的操作。拖动铁架台图四周的控点,调整虚线框使其比铁架台图稍大,如图7-33所示。用鼠标拖动铁架台图,使其和“实验装置参考图”中的铁架台图重合。,图7-33 调整虚线框,(11)双击“铁架台正确位置”群组图标,在二级流程线上放一个“擦除”图标,并将其命名为“擦除提示文字”,如图7-34所示。,图7-34 流程图,(12)将“擦除提示文字”擦除图标的擦除对象确定为“提示文字”显示图标,这样当学生把铁架台拖动到正确位置后,
23、“提示文字”被擦除。(13)在“交互”图标的右侧再放一个群组图标,命名该群组图标为“铁架台错误位置”。(14)在交互图标的右侧再放14个群组图标,并分别命名为“酒精灯正确位置”、“酒精灯错误位置”、“烧瓶正确位置”、“烧瓶错误位置”、“分液漏斗正确位置”、“分液漏斗错误位置”、“集气瓶正确位置”、“集气瓶错误位置”、“烧杯正确位置”、“烧杯错误位置”、“导管1正确位置”、“导管1错误位置”、“导管2正确位置”和“导管2错误位置”等。,(15)双击“铁架台错误位置”群组图标上的响应标志,打开“属性:交互”对话框,在“目标区”选项卡和“交互”选项卡中进行设置,如图7-35(a)和(b)所示。单击演
24、示窗口中的铁架台图(不能单击参考图中的铁架台图),将其确定为移动对象。用鼠标将铁架台图移动到演示窗口的中央,并调整移动区域使其和整个演示窗口一样大。(a)“属性:交互”对话框中的“目标区”选项卡(b)“属性:交互”对话框中的“交互”选项卡,(a)“属性:交互”对话框中的“目标区”选项卡,图7-35“属性:交互”对话框(1),(b)“属性:交互”对话框中的“交互”选项卡图7-35“属性:交互”对话框(2),(16)参照“铁架台正确位置”、“铁架台错误位置”对其他各分支进行设置。分别确定各分支移动响应的对象及区域。各群组图标中不设置擦除图标。双击“烧瓶正确位置”群组图标,在打开的二级窗口中放一个计
25、算图标,按如图7-36所示命名并进行设置。,图7-36 调整图层,双击“分液漏斗正确位置”群组图标,在打开的二级窗口中放一个计算图标,命名为“调整分液漏斗层次”,设置该图标内容为“LagerDisplay(1,IconID分液漏斗)”。双击“导管2正确位置”群组图标,在打开的二级窗口中放一个计算图标,按如图7-37所示进行命名并进行设置。其他没有强调的群组图标可以不进行设置,可以为空。(17)删除流程线上的“实验装置参考图”显示图标,并保存文件调试程序。,图7-37 调整图层,7.5 通过菜单响应实现交互,菜单响应是课件设置中广泛使用的交互手段之一,它有占据屏幕空间小的特点,在一些封面内容较多
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 制作 交互式 效果
链接地址:https://www.31ppt.com/p-4882139.html