第 8章 组件和模板
本章主要内容
?8.1组件简介
?8.2使用组件
?8.3常用组件
?8.4使用模板
?8.5应用实例
?8.6 本章 习题与实验指导
第 8章 组件和模板
8.1 组件简介
组件是带有参数的影片剪辑 。 组件既可
以是一个简单的用户界面控件 ( 如单选按钮
或复选框 ) ;也可以包含一定的内容 ( 如滚
动窗格 ) ;组件还可以是不可见的 ( 如
FocusManager) 。
组件是面向对象技术的一个重要特征 。 每
个组件都有预定义参数 。 用户也可以在使用
时重新设置这些参数, 并且每个组件还有一
组独特的动作脚本方法, 属性和事件 ( 也称
API,应用程序编程接口 ), 在运行组件时用
户可以设置参数和其他选项 。
包含四类组件:用户界面组件 ( UI), 媒体组件,
数据组件和管理器 。
l 用户界面组件 ( UI),可以快速地与应用程序
交互操作 。 例如, Button组件, CheckBox组件
等 。
l 媒体组件:可以将媒体流入到应用程序中 。 例
如, MediaDisplay 组件, MediaPlayback 组件等 。
l 数据组件:可以加载和处理数据源的信息 。 例
如, DataBinding 组件, DataHolder 组件,
DataSet组件, WebServiceConnector 组件等 。
l 管理器:管理器组件是一组不可见的组件, 使
用这些组件可以在应用程序中管理诸如焦点或
深度之类的功能 。 例如, DepthManager类,
FocusManager类, PopUpManager类等 。
8.2 使用组件
使用组件有多种方法:可以使用, 组件, 面
板来查看组件, 也可以在创作过程中将组件添
加到文档中 。 这样可在, 属性, 面板或, 组件
检查器, 面板中查看或修改组件属性 。 此外,
在多数情况下, 用户还需要编写动作脚本, 以
便对组件数据进行处理 。
所有组件都存储在“组件”面板中。选择
“窗口” →,开发面板” →,组件”命令,或
按下组合键 〈 Ctrl+F7〉 都可以打开“组件”面
板。
第 8章 组件和模板
“组件”面板
1,添加组件和删除组件
向文档中添加组件, 只需要打开, 组件,
面板, 将选中组件从, 组件, 面板中拖放到
舞台上, 或者在, 组件, 面板中双击要添加
的组件即可 。
若从 Flash 文档中删除组件的实例, 可通
过删除库面板中编译剪辑 (SWC)图标来删除
组件, 或者直接选中舞台上的组件实例, 按
〈 Delete〉 键 。
2,,组件检查器, 面板和, 属性, 面板
将组件添加到 Flash文档后, 可以使用
,属性, 面板来设置和查看组件实例 。
也可以使用, 组件检查器, 面板来设置
组件实例的参数 。 需要说明的是有些参
数必须使用动作脚本来设置 。
在, 组件检查器, 面板中查看组件实
例:选择一个组件的实例, 单击, 窗
口, →, 组件检查器, 命令, 打开, 组
件检查器, 面板, 单击, 参数, 选项卡
查看参数 。
3,处理组件事件
所有组件都有事件,若处理事件,需
要编写在触发事件时执行的脚本代码。
用户可以通过以下两种方式来处理组件
事件:
使用 on()组件事件处理函数
处理组件事件最简单的方式是使用
on()组件事件处理函数。用户可以将 on()
处理函数分配给组件实例,就像将处理
函数分配给按钮或影片剪辑一样。
使用组件事件侦听器
处理组件事件最强大的方式是使用侦
听器 。 事件由组件进行广播, 作为侦听
器注册到事件广播器 ( 组件实例 ) 的任
何对象都会收到该事件的通知 。 用户可
以向一个组件实例注册多个侦听器, 也
可以向多个组件实例注册一个侦听器 。
使用事件侦听器模型, 需要创建一个
侦听器对象, 该对象所带的属性应为事
件的名称 。
8.3 常用组件
8.3.1 Button( 按钮 ) 组件
Button 组件是一个可调整大小的矩形
用户界面按钮 。 可以给按钮添加一个自
定义图标 。 也可以将按钮的行为从按下
改为切换 。 在单击切换按钮后, 它将保
持按下状态, 直到再次单击时才会返回
到弹起状态 。
第 8章 组件和模板
1,Button参数
l icon:给按钮添加自定义图标 。 该值是,
库, 面板中影片剪辑或图形元件的链接
标识符, 没有默认值 。
l label:设置按钮上文本的值, 默认值是
,Button”。
l labelPlacement:确定按钮上的标签文本
相对于图标的方向 。 该参数可以是 left、
right,top 或 bottom之一, 默认值是 right。
l selected,该参数指定是按下 (true)还是
释放 (false)按钮, 默认值为 false。
l toggle:将按钮转变为切换开关 。 值为
true时, 按钮在按下后保持按下状态, 直
到再次按下时才返回到弹起状态;值为
false时, 按钮的行为就像普通按钮, 默
认值为 false。
请进入 Flash通过实例介绍 Button组件的
具体应用。
2,Button组件的应用
下面通过实例介绍 Button组件的具体应用。
请进入 Flash窗口,根据教材介绍的操作
步骤完成实例制作。
测试按钮效果图
8.3.2 CheckBox( 复选框 ) 组件
CheckBox是一个可以选中或取消选中
的方框 。 复选框是任何表单或 Web 应用
程序中的一个基础部分 。 每当需要收集
一组非相互排斥的 true或 false值时, 都可
以使用复选框 。 当复选框被选中后, 框
中会出现一个复选标记 。 对于一组复选
框选项, 用户可以不选或者选择选项中
的一个或多个 。
1,CheckBox 参数
l label:设置复选框上文本的值, 默认值是
CheckBox。
l labelPlacement:确定复选框上标签文本的
方向 。 该参数可以是下列四个值之一:
left,right,top 或 bottom,默认值是 right。
l selected:将复选框的初始值设为选中 (true)
或取消选中 (false)。
CheckBox组件参数
2,CheckBox 组件的应用
下面的示例是一个用于收集客户个人信息的
表单, 其中包含一组个人兴趣爱好列表供客
户选择 。
请进入 Flash窗口完成操作 。
复选框组件实例效果图
8.3.3 ComboBox( 组合框 ) 组件
ComboBox有静态和可编辑之分。使
用静态组合框可以从下拉列表中做出一
项选择;使用可编辑的组合框可以在列
表顶部的文本字段中直接输入文本,也
可以从下拉列表中选择一项。组合框是
由 Button,TextInput和 List三个子组件组
成。
1,ComboBox 参数
ldata:为 ComboBox组件中的每个项目设置一
个相关联数据值, 该数据参数是一个数组 。
leditable:确定 ComboBox组件是可编辑的 (true)
还是只能选择的 (false)。 默认值为 false。
llabels:用一个文本值数组填充 ComboBox组
件 。
lrowCount:设置在不使用滚动条的情况下一
次最多可以显示的项目数 。 默认值为 5。
ComboBox组件参数
2,ComboBox组件的应用
制作一个组合框,并在其下拉列表中呈
现出一个从中选择城市的列表。
请进入 Flash窗口完成操作。
ComboBox组件应用
8.3.4 Label( 标签 ) 组件
Label组件是 Flash MX 2004中新加入的一
个组件 。 通常使用 Label 组件为表单的其它
组件创建文本标签, 也可以使用
Label 组件来替代普通文本字段 。
Label组件参数
1,Label 参数
参数含义如下:
?autoSize:指明标签的大小和对齐方式应如
何适应文本, 默认值为 none。
?html:指明标签是否采用 HTML格式, 默认
值为 false。
?text:指明标签的文本, 默认值是 Label。
2,Label组件的应用
用 Label 组件为复选框及组合框添加标签。
请进入 Flash窗口完成操作。
组件应用效果图
8.3.5 List( 列表框 ) 组件
List组件是一个可滚动的单选或多选列表
框,它与 ComboBox组件有相似的功能和用法。
1,List 组件参数
其它参数含义如下:
l multipleSelection:是一个布尔值, 用于设置
列表框的选项能否多选 。 默认值为 false,即
只能选择其中一项 。 若选择 true,可同时选择
多项, 选择多项时需要按下 〈 Ctrl〉 键的同时
点击要选择的项目 。
l rowHeight:可以设置列表框每行的高度, 默
认值是 20。
2,List组件的应用
请进入 Flash窗口完成操作。
List组件应用
List组件参数
8.3.6 NumericStepper( 数字微调器 ) 组件
NumericStepper 组件允许用户在一个
数值范围内选择某一值 。 NumericStepper
只处理数值数据, 此外, 要显示两个以
上的数值位置 ( 例如, 数字 5246 或
1.34), 在编辑时必须调整数字微调器的
大小 。
1,NumericStepper参数
参数含义如下:
?Maximum:设置步进的最大值, 默认值为
10。
?minimum:设置步进的最小值, 默认值为 0。
?stepSize,设置步进的变化单位, 默认值为 1。
?value:设置当前步进的值, 默认值为 0。
NumericStepper组件参数
2,NumericStepper组件的应用
本例中的数字微调器允许用户从 -50~
50 之间选择一个数字,增量为 1。
请进入 Flash窗口完成操作。
NumericStepper组件应用
8.3.7 RadioButton( 单选按钮 ) 组件
使用 RadioButton组件允许用户从一组选
项中选择惟一的选项 。 RadioButton组件必
须用于至少有两个 RadioButton实例的组 。
在任何给定的时刻, 都只有一个组成员被选
中, 用户可以设置 groupName参数, 以指明
单选按钮属于哪个组 。
1,RadioButton 参数
ldata:是与单选按钮相关的值 。
l groupName, 单 选 按 钮 的 组 名 称, 默 认 值 为
radioGroup。
l label:设置单选按钮的标签 。
l labelPlacement:设置标签文本在单选按钮的什么位
置, 默认值是 right。
lselected:将单选按钮的初始值设置为是否被选中 。
设置 RadioButton组件参数
2,RadioButton组件的应用
设置单选按钮用于显示性别。
请进入 Flash窗口完成操作。
组件实例效果
8.3.8 ScrollPane( 滚动窗格 ) 组件
ScrollPane组件的功能是提供滚动条,
用户可以很方便地观看尺寸过大的影片
剪辑, JPEG 文件和 SWF文件 。 另外, 在
创作和运行时, 都可以使用动作脚本来
设置滚动窗格的内容 。
1,ScrollPane 参数
lcontentPath:设置要加
载到滚动窗格中的内容 。
该值可以是本地 SWF
或 JPEG文件的相对路
径, Internet上文件的
相对或绝对路径, 也可
以是设置, 为动作脚本
导出, 的影片剪辑元件
的链接标识符 。
l hLineScrollSize:设置
单击水平滚动条的向左
或向右箭头时滑动尺寸
的大小 。
ScrollPane 组件参数
l hPageScrollSize:设置每次按下轨道时水平
滚动条移动多少个单位, 默认值为 20。
lhScrollPolicy:设置是否显示水平滚动条 。
该值可以为 on( 无论影片剪辑与滚动窗格的
相对大小如何都显示水平滚动条 ), off
( 无论影片剪辑与滚动窗格的相对大小如何
都不显示水平滚动条 ) 或 auto( 根据影片剪
辑与滚动窗格的相对大小来决定显示水平滚
动条 ) 。
l scrollDrag:设置是否允许用户在滚动窗格
中用鼠标拖拽影片剪辑对象 。 默认值为
false,即只能通过滚动条查看滚动窗格中的影
片剪辑 。 若设为 true,允许用户直接使用鼠
标拖拽滚动窗格中的影片剪辑 。
l vLineScrollSize:设置单击垂直滚动条的向
上或向下箭头时滑动尺寸的大小 。
l vPageScrollSize,设置每次按下轨道时垂
直滚动条移动多少个单位 。
l vScrollPolicy:是否显示垂直滚动条 。 该值
的设置方法与 hScrollPolicy参数相似 。
2,ScrollPane组件的应用
使用滚动窗格显示一幅风景图片。
请进入 Flash窗口完成操作。
ScrollPane组件应用
8.3.9 TextArea( 文本域 ) 组件
TextArea组件可以提供多行文本的输入 。
1,TextArea 组件参数
l editable:指明 TextArea 组件是否可编辑,
默认值为 true。
lhtml:指明文本是否采用 HTML格式, 默认
值为 false。
ltext:指明 TextArea的内容 。
lwordWrap:指明文本是否自动换行, 默认
值为 true。
TextArea 组件参数
2,TextArea 组件的应用
为两个 TextArea组件实例的参数分别设置
不同的值,将会有不同的效果。
请进入 Flash窗口完成操作。
TextArea组件不同参数应用效果图
8.3.10 TextInput( 输入文本框 ) 组件
TextInput组件和 TextArea组件功能比
较相似, 都可以提供文本输入, 不同是
TextInput组件只能提供单行文本的输入 。
1,TextInput组件参数
?editable:指明 TextInput组件是否可编辑,
默认值为 true。
?password:指明字段是否为密码字段, 默
认值为 false。
?text:指定 TextInput 的内容 。
2,TextInput组件的应用
将两个 TextInput组件实例中的 password参数
分别设为 true 和 false两种情况,观察运行结果。
TextInput 组件参数
TextInput组件应用
8.3.11 DateChooser(日期选择 )组件
DateChooser组件允许用户从日历中选择
一个或多个日期 。
1,DateChooser组件参数
l dayNames, 显 示 周 的 文 本, 默 认 为
S,M,T,W,T,F,S 分别代表周日至周六 。
l disabledDays:设置每周的哪一天无效 ( 反
白, 不能选择 ) 。 0为周日, 1为周一, 2为
周二, 依此类推 。
l firstDayOfWeek:设置哪一天为每周的第一
天 。 0为周日, 1为周一, 2为周二 … 。
l monthNames:可以根据语言的种类指定显
示月份的名称, 默认是英文的月份单词
l showToday:是否使用特殊标志显示当天的
日期, 默认是 true。
DateChooser组件参数
2,DateChooser组件的应用
下面通过一个简单的示例说明 DateChooser
组件的使用方法 。
请进入 Flash窗口完成操作。
测试效果图
8.3.12 Window(窗口 )组件
Window组件在一个具有标题栏, 边框和
关闭按钮 ( 可选 ) 的窗口内显示电影剪辑的
内容 。 Window 组件还支持拖动操作, 用户
可以单击标题栏并将窗口及其内容拖动到另
一个位置, 但拖动边框不会更改窗口的大小 。
1,Window 组件参数
lcloseButton:指明是否显示关闭按钮 。
l contentPath:指定窗口的内容 。 内容可以是
电影剪辑的链接标识符, 或是屏幕, 表单或
包含窗口内容的幻灯片的元件的名称;也可
以是要加载到窗口的 SWF 或 JPG 文件的绝对
或相对 URL。
ltitle:指明窗口的标题 。
Window组件参数
2,Window 组件的应用
在 Window中显示一幅礼花绽放的图片。
请进入 Flash窗口完成操作。
Window组件应用
8.4 使用模板
Flash MX 2004附带了多个帮助用户简化
工作的模板, 使用这些模板制作动画时, 通
常只需要修改文本的内容, 而不需要编写脚
本代码, 这将使得模板的使用较为简单, 但
同时也限制了模板一般只应用于功能性的互
动应用 。
第 8章 组件和模板
1,使用照片幻灯片模板
照片幻灯片模板使用户可以轻松地创建
和自定义照片幻灯片。以制作个人相册为例
来说明照片幻灯片模板的使用方法。
请进入 Flash窗口根据教材提供的操作步
骤完成操作。
导入风景照片并编辑内容
2,使用演示文稿模板
Flash MX 2004附带的演示文稿模板可
以帮助用户创建、自定义和发布演示文稿。
制作一个关于学生兴趣调查的演示文稿,来
说明演示文稿模板的使用方法。
请进入 Flash窗口根据教材提供的操
作步骤完成操作。
演示文稿
8.5.1调查问卷
本实例是一张可用于网上用户资料调查
信息的填写表, 它利用了 Flash MX 2004用
户界面组件来完成, 并配合动作脚本语句进
行数据的收集与发布 。
请进入 Flash窗口根据教材提供的操作步
骤完成操作。
8.5 应用实例
第 8章 组件和模板
调查问卷实例的界面 调查问卷 最终效果图
8.5.2自然风光
本例主要运用组件来显示多张具有说明
文字的自然风光图片 。
请进入 Flash窗口根据教材提供的操作步
骤完成操作。
封面效果图 组件的布局
本章习题与实验指导
本章习题,第 219页
实验指导,第 219页
第 8章 组件和模板
Thank you very much!
本章到此结束。
谢谢您的光临!