中文Authorware7.0案例教程 第6章框架、导图标和版面布局设置.ppt

第第6 6章章 框架、导航图标和版面布框架、导航图标和版面布局设置局设置 【案例案例2727】“水墨画和油画水墨画和油画1”1”程程序序6.1【案例案例2828】“跟我学跟我学AUTHORWARE1”AUTHORWARE1”程程序序6.2【案例案例2929】“三基色混色三基色混色”程序程序 6.36.1 6.1 【案例案例2727】“水墨画和油画水墨画和油画1”1”程序程序 图图6-1-1 “水墨画和油画水墨画和油画”程序运行后的画面程序运行后的画面 图图6-1-2 转到显示转到显示“油画油画1”图像图像 图图6-1-3 “已查阅过的页已查阅过的页”对话框对话框 图图6-1-4 “查找查找”对话框对话框6.1.2 操作过程操作过程6.1.3 相关知识相关知识1页管理和框架图标页管理和框架图标（1）页管理）页管理（2）框架图标的特点）框架图标的特点 2导航图标导航图标 3设置图标关键字的方法和设置图标关键字的方法和“关关键字键字”对话框对话框（1）图标单个关键字的设置方法）图标单个关键字的设置方法（2）“关键字关键字”对话框中其他选项对话框中其他选项的作用的作用6.1.4 案例拓展案例拓展1【拓拓展展实实例例36】“水水墨墨画画和和油油画画2”程序程序2【拓拓展展实实例例37】“自自动动翻翻页页展展示示图像图像”程序程序6.2 6.2 【案例案例2828】“跟我学跟我学AUTHORWARE1”AUTHORWARE1”程序程序6.2.1 学习目标学习目标 “跟我学跟我学AUTHORWARE1”程序运行后，程序运行后，屏幕显示两个文字框。将鼠标移到左边文屏幕显示两个文字框。将鼠标移到左边文字框内的某一行标题文字（热字）处，鼠字框内的某一行标题文字（热字）处，鼠标指针会变为小手状。单击该标题文字，标指针会变为小手状。单击该标题文字，会马上在右边的文字框内显示相应的文字会马上在右边的文字框内显示相应的文字说明，如图说明，如图6-2-1所示。所示。图图6-2-1 “跟我学跟我学AUTHORWARE1”程序运行后的画面程序运行后的画面 单击右边文字框内文字中的蓝色文字单击右边文字框内文字中的蓝色文字（热字），右边的文字框内会变为列表框，（热字），右边的文字框内会变为列表框，显示相应的程序运行效果。显示相应的程序运行效果。6.2.2 操作过程操作过程6.2.3 相关知识相关知识1热字热字 在读书时，除了需要在读书时，除了需要“页管理页管理”的翻的翻页功能来阅览需要了解的页以外，还会查页功能来阅览需要了解的页以外，还会查阅一些字词最初的解释，这是很麻烦的事阅一些字词最初的解释，这是很麻烦的事情。情。为了能快速查阅关键字词的最初解释，为了能快速查阅关键字词的最初解释，一些书在书后面增加一个关键字词索引表，一些书在书后面增加一个关键字词索引表，以帮助读者快速找到有关的页。以帮助读者快速找到有关的页。在在Authorware 7.0中，把这些关键字中，把这些关键字词定义成热字（也叫演绎字）。当鼠标指词定义成热字（也叫演绎字）。当鼠标指针移至热字时，鼠标指针会变成小手状。针移至热字时，鼠标指针会变成小手状。单击热字，就会将相应的页调出来，避免单击热字，就会将相应的页调出来，避免了一页一页地翻阅查找。了一页一页地翻阅查找。这种非线性地展示有关文本信息的方这种非线性地展示有关文本信息的方式就叫式就叫“超文本超文本”，超文本的实质就是利，超文本的实质就是利用导航图标将目的页与用导航图标将目的页与“热字热字”建立链接，建立链接，用户单击用户单击“热字热字”后，程序跳转到与该后，程序跳转到与该“热字热字”链接的目的页，即将这些热字与相链接的目的页，即将这些热字与相应的页构成了定向链接。应的页构成了定向链接。超媒体与超文本的区别仅在于其节点超媒体与超文本的区别仅在于其节点（即页）不但可以是文本，而且可以是图（即页）不但可以是文本，而且可以是图形、图像、声音、动画和视频信息等多媒形、图像、声音、动画和视频信息等多媒体信息，它的非线性和链接特点与超文本体信息，它的非线性和链接特点与超文本是一样的。是一样的。文字有一般文字和热字，热字样式的文字有一般文字和热字，热字样式的定义是在一般文字样式定义的基础之上再定义是在一般文字样式定义的基础之上再定定 义的。义的。（1）单击）单击“文本文本”“定义样式定义样式”菜单命令，调出菜单命令，调出“定义风格定义风格”对话框，对话框，如图如图6-2-7所示。单击所示。单击“添加添加”按钮，按钮，再在该按钮上边的文本框内输入文字再在该按钮上边的文本框内输入文字样式名称，例如样式名称，例如“蓝字蓝字1”。2一般文字样式的定义方法一般文字样式的定义方法图图6-2-7 “定义风格定义风格”对话框对话框（2）在中间一栏的复选框与下拉列）在中间一栏的复选框与下拉列表中，设定字体、字大小、风格（粗表中，设定字体、字大小、风格（粗体、斜体、下划线、上标、下标）、体、斜体、下划线、上标、下标）、颜色和数字格式。单击颜色和数字格式。单击99,998.66复选复选框后，框后，“格式格式”按钮变为可选，单击按钮变为可选，单击它，调出它，调出“数字格式数字格式”对话框，如图对话框，如图6-2-8所示。利用该对话框设定数字格所示。利用该对话框设定数字格式。式。图图6-2-8 “数字格式数字格式”对话框对话框（3）在）在“定义风格定义风格”对话框中，右对话框中，右上角为设定风格的示例，单击上角为设定风格的示例，单击“完成完成”按钮，即可将文字样式设定完成，按钮，即可将文字样式设定完成，并给该样式定义为并给该样式定义为“蓝字蓝字1”。（4）在显示图标的设计窗口状态下，）在显示图标的设计窗口状态下，单击单击“文本文本”“应用样式应用样式”菜单命菜单命令，调出令，调出“应用样式应用样式”面板，如图面板，如图6-2-9所示。所示。图图6-2-9 “应用样式应用样式”面板面板 选中文字后，单击该面板中的字样名选中文字后，单击该面板中的字样名称，即可为选中的文字选定字样。也可以称，即可为选中的文字选定字样。也可以单击快捷工具栏中单击快捷工具栏中“文字样式文字样式”下拉列表下拉列表框内的文字样式名称，如图框内的文字样式名称，如图6-2-10所示。选所示。选定字样，即可一次性完成对文字属性的设定字样，即可一次性完成对文字属性的设置与修改。置与修改。图图6-2-10 “文字样式文字样式”下拉列表框下拉列表框（1）“定义风格定义风格”对话框中对话框中“交互交互性性”栏各选项栏各选项 在在“定义风格定义风格”对话框右边的对话框右边的“交互交互性性”栏内，有鼠标动作状态选定和光标形栏内，有鼠标动作状态选定和光标形状选定等选项，各选项的含义如下。状选定等选项，各选项的含义如下。3热字的定义和使用热字的定义和使用“无无”单选钮：不定义热字，单击它后，单选钮：不定义热字，单击它后，此栏各选项变为不可选。此栏各选项变为不可选。“单击单击”单选钮：设置热字可被选中的单选钮：设置热字可被选中的鼠标动作是单击。鼠标动作是单击。“双击双击”单选钮：设置热字可被选中的单选钮：设置热字可被选中的鼠标动作是双击。鼠标动作是双击。“内部指针内部指针”单选钮：设置热字可被选单选钮：设置热字可被选中的鼠标动作是从字外移到字内。中的鼠标动作是从字外移到字内。“自动加亮自动加亮”复选框：选取热字时，热复选框：选取热字时，热字变为用其补充色显示。字变为用其补充色显示。“指针指针”复选框：可选取鼠标指针的形复选框：可选取鼠标指针的形状，一般为小手形状。状，一般为小手形状。“导航到导航到”复选框：选中它后，可使热复选框：选中它后，可使热字与页建立链接。字与页建立链接。（2）热字的定义）热字的定义 在完成一般文字样式的定义后，可以在完成一般文字样式的定义后，可以利用利用“定义风格定义风格”对话框右边的对话框右边的“交互性交互性”栏，进行有关热字内容的定义。栏，进行有关热字内容的定义。例如，定义一个名字为例如，定义一个名字为“蓝字蓝字2”的热的热字样式，要求是字体为黑体，字号为字样式，要求是字体为黑体，字号为14磅，磅，加粗，颜色为蓝色；鼠标指针经过热字时，加粗，颜色为蓝色；鼠标指针经过热字时，鼠标指针为手指形状；鼠标单击时产生链鼠标指针为手指形状；鼠标单击时产生链接，热字变为用其补色显示。这一要求的接，热字变为用其补色显示。这一要求的具体定义方法如下。具体定义方法如下。为设置上述要求的热字，可单击为设置上述要求的热字，可单击“定义定义风格风格”对话框内左边列表框中的对话框内左边列表框中的“蓝字蓝字1”一般字样式名称（该字样式具有字体为黑一般字样式名称（该字样式具有字体为黑体，字号为体，字号为14磅，颜色为蓝色特点），选磅，颜色为蓝色特点），选中它。中它。在在“定义风格定义风格”对话框内对话框内“交互性交互性”栏栏中，选中中，选中“单击单击”单选钮单选钮，选中，选中“自动加自动加亮亮”和和“指针指针”复选框。单击复选框。单击“完成完成”按按钮，存盘退出。钮，存盘退出。（3）热字的使用方法）热字的使用方法 就是建立热字与页的链接所采用的方就是建立热字与页的链接所采用的方法。法。1【拓展实例拓展实例38】“跟我学跟我学AUTHORWARE2”程序程序 2【拓展实例拓展实例39】“目录导航浏目录导航浏览图像览图像”程序程序6.2.4 案例拓展案例拓展6.3.1 学习目标学习目标 “三基色混色三基色混色”程序运行后，屏幕显示程序运行后，屏幕显示如图如图6-3-1所示的画面。这时，用鼠标分别所示的画面。这时，用鼠标分别拖曳三个小滑块，可以发现三个滑槽左边拖曳三个小滑块，可以发现三个滑槽左边的矩形方块内的颜色（小狗的背景色）会的矩形方块内的颜色（小狗的背景色）会随之变化，而且三个滑槽上边的随之变化，而且三个滑槽上边的R、G、B数字也会随之变化。数字也会随之变化。6.3 6.3 【案例案例2929】“三基色混色三基色混色”程序程序 利用该程序可以很方便地知道利用该程序可以很方便地知道R、G、B数值与颜色的对应关系。程序运行后的两数值与颜色的对应关系。程序运行后的两个画面如图个画面如图6-3-1所示。所示。图图6-3-1 “三基色混色三基色混色”程序运行后的两个画面程序运行后的两个画面1“框框 架架 和和 标标 题题”显显 示示 图图 标标 和和“RGB”群组图标设计群组图标设计2设计用鼠标调整矩形的颜色设计用鼠标调整矩形的颜色6.3.2 操作过程操作过程1显示图标的版面布局设置显示图标的版面布局设置 选中显示图标，调出选中显示图标，调出“属性：显示图属性：显示图标标”面板，如图面板，如图6-3-5所示。该面板内左边所示。该面板内左边选项的作用已经在以前各章作过介绍，该选项的作用已经在以前各章作过介绍，该面板右边的选项用来完成显示图标内对像面板右边的选项用来完成显示图标内对像的版面布局设置，即确定对像的移动范围。的版面布局设置，即确定对像的移动范围。其中各选项的作用如下。其中各选项的作用如下。6.3.3 相关知识相关知识图图6-3-5 “属性：显示图标属性：显示图标”面板面板“位置位置”下拉列表框选中下拉列表框选中“在屏幕上在屏幕上”选项选项（1）“位置位置”下拉列表框下拉列表框 其中有四个选项，用来确定对象的显其中有四个选项，用来确定对象的显示位置。四个选项的作用如下。示位置。四个选项的作用如下。“不能改变不能改变”：使对象在显示图标内原：使对象在显示图标内原来的显示位置，且不能够改变。来的显示位置，且不能够改变。“在屏幕上在屏幕上”：允许对象在整个屏幕范：允许对象在整个屏幕范围内移动，选中它后，其下边的文本框变围内移动，选中它后，其下边的文本框变为可以使用，如图为可以使用，如图6-3-5所示，所示，“初始初始”栏栏的两个文本框用来精确确定图像的当前位的两个文本框用来精确确定图像的当前位置。置。“在路径上在路径上”：使对象只能在指定的路：使对象只能在指定的路径上移动对象，产生路径的方法与动画图径上移动对象，产生路径的方法与动画图标的标的“指向固定路径上的任意点指向固定路径上的任意点”动画方动画方式的路径设置方法一样；此时的式的路径设置方法一样；此时的“属性：属性：显示图标显示图标”面板如图面板如图6-3-6所示，所示，“基点基点”和和“终点终点”文本框用来输入路径坐标的起文本框用来输入路径坐标的起点和终点数值，点和终点数值，“初始初始”文本框用来输入文本框用来输入对象在坐标路径中的初始位置。对象在坐标路径中的初始位置。图图6-3-6 “属性：显示图标属性：显示图标”面板面板“位置位置”下拉列表框选中下拉列表框选中“在路径上在路径上”选项选项“在区域内在区域内”：使对象只能在指定的区：使对象只能在指定的区域内移动，产生坐标区域的方法与动画图域内移动，产生坐标区域的方法与动画图标的标的“指向固定区域内的某点指向固定区域内的某点”动画方式动画方式的坐标区域设置方法一样，此时的的坐标区域设置方法一样，此时的“属性：属性：显示图标显示图标”（版面布局）对话框如图（版面布局）对话框如图6-3-7所示。所示。图图6-3-7 “属性：显示图标属性：显示图标”面板面板“位置位置”下拉列表框选中下拉列表框选中“在区域内在区域内”选项选项 “基点基点”和和“终点终点”栏中的四个文本框栏中的四个文本框用来输入平面路径坐标的起点和终点数值，用来输入平面路径坐标的起点和终点数值，“初始初始”栏中的两个文本框用来输入对象栏中的两个文本框用来输入对象在平面坐标路径中的初始位置。在平面坐标路径中的初始位置。（2）“活动活动”下拉列表框下拉列表框 其内可以有五个选项，用来确定用户其内可以有五个选项，用来确定用户能否移动相应的对象。当能否移动相应的对象。当“位置位置”下拉列下拉列表框中选择表框中选择“不能移动不能移动”或或“在屏幕上在屏幕上”选项时，选项时，“活动活动”下拉列表框中只有其中下拉列表框中只有其中三个选项。当三个选项。当“位置位置”下拉列表框中选择下拉列表框中选择“在路径上在路径上”或或“在区域内在区域内”选项时，选项时，“活动活动”列表框中只有其中四个选项。这五列表框中只有其中四个选项。这五个选项的作用介绍如下。个选项的作用介绍如下。“不能移动不能移动”：用户不能移动相应的对：用户不能移动相应的对象。象。“在屏幕上在屏幕上”：用户可以在整个展示窗：用户可以在整个展示窗口范围内移动相应的对象。口范围内移动相应的对象。“任意位置任意位置”：用户可以在整个屏幕范：用户可以在整个屏幕范围内移动相应的对象。围内移动相应的对象。“在路径上在路径上”：用户只能在指定的路径：用户只能在指定的路径范围内移动相应的对象，此选项只有在范围内移动相应的对象，此选项只有在“位置位置”下拉列表框选中了下拉列表框选中了“在路径上在路径上”选选项后才出现。项后才出现。“在区域内在区域内”：用户只能在指定的坐标：用户只能在指定的坐标区域范围内移动相应的对象，此选项只有区域范围内移动相应的对象，此选项只有在在“位置位置”下拉列表框选中了下拉列表框选中了“在区域内在区域内”选项后才出现。选项后才出现。（1）单击选中电影图标，调出它的）单击选中电影图标，调出它的“属性：电影图标属性：电影图标”（版面布局）面（版面布局）面板。电影图标的版面布局设置，如图板。电影图标的版面布局设置，如图6-3-8所示。所示。2电影图标和功能图标的版面布局设电影图标和功能图标的版面布局设置置图图6-3-8 “属性：电影图标属性：电影图标”（版面布局）面板（版面布局）面板（2）单击选中功能图标（）单击选中功能图标（GIF、SWF等格式的动画），调出它的等格式的动画），调出它的“属属性：电影图标性：电影图标”面板，单击面板，单击“版面布版面布局局”标签，切换到标签，切换到“属性：电影图标属性：电影图标”（版面布局）面板。功能图标的版（版面布局）面板。功能图标的版面布局设置，如图面布局设置，如图6-3-9所示。所示。图图6-3-9 “属性：功能图标属性：功能图标”（版面布局）面板（版面布局）面板 可以看出，它们与显示图标的可以看出，它们与显示图标的“属性：属性：显示图标显示图标”面板在版面布局选项方面基本面板在版面布局选项方面基本一样。一样。1【拓拓展展实实例例40】“图图像像移移动动范范围围的控制的控制”程序程序2【拓拓展展实实例例41】“趣趣味味数数字字电电影影”程序程序 6.3.4 案例拓展案例拓展