中文Flash CS3案例教程(第二版) 教学课件 ppt 作者 沈大林 主编 第8章 组件.ppt

第 8 章,组,件,8.1,【案例 30】滚动浏览宝宝图像,相关知识 1．组件简介 组件是一些复杂的并带有可定义参数的影片剪辑元件在使用组件创建影片时，可以直接定义参数，也可以 通过 ActionScript 的方法定义组件的参数每一个组件都有自己的预定义参数（不同的组件的参数会不一样）， 还有属于组件的属性、方法和事件，它们被称为应用程序接口 API组件可以使程序设计与软件界面设计分开， 提高了工作效率 可以分别将这些组件加入到 Flash 的交互动画中，也可以将多个组件一起使用，来创作完整的应用程序或者 Web 表单的用户界面还能够使用几种方法自定义组件的外观这些常用的组件不仅提高了工作效率，而且能给 Flash 作品带来更加统一的标准化界面同时用户也可以制作一些自己的组件供自己使用，或者发布出去以方便 其他用户 Flash CS3 拥有一个“组件”面板，内置了几种类型的组件如果新建的 Flash 文档是“Flash 文件 （ActionScript 3.0）”，则只有 User Interface 和 Video 两类组件；如果新建的 Flash 文档是“Flash 文件 （ActionScript 2.0）”等，则还有 Data、Media 两类组件。

在 User Interface 类组件中有 Label（标签）、CheckBox,（复选框）、ComboBox（下拉列表框）、List（列表框）、Button（按钮）、RadioButton（单选按钮，也叫单选项）,和 UIScrollPane（滚动窗格）等；User Interface 类组件中有 FLVPlayback 等组件此外还可以使用外部组件2．ScrollPane（滚动窗格）组件参数,（1）contentPath 参数：用来指示要加载到滚动窗格中的内容该值可以是本地 SWF 或 JPEG 文件的相对,路径，或 Internet 上文件的相对或绝对路径它也可以是设置为“库”面板中的影片剪辑元件的链接标识符2）hLineScrollSize 参数：设置单击水平滚动条箭头按钮时，图像水平移动的像素数3）vLineScrollSize 参数：设置单击垂直滚动条箭头按钮时，图像垂直移动的像素数4）hPageScrollSize 参数：设置单击滚动条的水平滑槽时，图像水平移动的像素数5）vPageScrollSize 参数：设置单击滚动条的垂直滑槽时，图像垂直移动的像素数6）hScrollPolicy 参数：单击该参数取值栏，其右边会显示一个箭头按钮，单击该按钮，可以在 auto、on,和 off 三个选项中选择一个选项，如图 8-1-11 所示。

如果选择 auto 选项，则可以根据影片剪辑元件是否超出 ScrollPane 组件实例滚动窗口来决定是否要水平滚,动条；如果选择 on 选项，则不管影片剪辑元件是否超出 ScrollPane 组件，滚动窗口都显示水平滚动条；如果选,择 off 选项，则不管影片剪辑元件是否超出 ScrollPane 组件，滚动窗口都不显示水平滚动条7）vScrollPolicy 参数：也有 auto、on 和 off 三个选项，其作用与 hScrollPolicy 参数基本一样，只是,它用来控制垂直滚动条何时显示 （8）ScrollDrag 参数：单击该参数取值栏，其右边会显示一个箭头按钮，单击该按钮，可以在 false 和 true 两个选项中任选一个，如图 8-1-12 所示选择 false 选项，则表示框架中的图像不可被拖动；选择 true 选项， 则表示框架中的图像可以被拖动 （9）enabled 参数：也有 false 和 true 两个选项选择 false 选项，则滚动条无效，选择 true 选项，则滚 动条有效此处选择 true 选项图 8-1-11 hScrollPolicy 参数选择,图 8-1-12,ScrollDrag 参数选择,（10）visible 参数：也有 false 和 true 两个选项。

选择 false 选项，则滚动条隐藏，选择 true 选项，则 滚动条可以显示此处选择 true 选项 3．UIScrollBar（滚动条）组件参数 （1）_targetInstanceName 参数：用来设置组件实例要控制的文本框的实例名称 （2）horizontal 参数：用来设置 UIScrollBar 组件实例是垂直方向摆放还是水平方向摆放其值为 true 时， 是垂直方向摆放；其值为 false 时，是水平方向摆放4．RadioButton（单选按钮）组件参数,（1）data 参数：可赋给文字或其他字符，该数据可以返给 Flash 系统，这里利用这个参数保存操作提示信,息2）groupName 参数：用来输入单选按钮的名称，一组单选按钮的组名称应该一样，在相同组的单选按钮中,只可以有一个单选按钮被选中这一项实际上决定了将这个单选按钮分到哪个组中，假如需要两组单选按钮，两,组的单选按钮互相作用、互不干扰，那么就需要设置两个组内的单选按钮具有不同的 group Name 参数值3）label 参数：用来确定单选按钮旁边的标题文字单击 Label 参数的数值部分，同时该项进入可以编辑,状态，然后输入文字，这个文字会出现在 RadioButton 组件在舞台工作区实例的标题上。

4）labelPlacement 参数：用来确定单选按钮旁边文字的位置选择 right 选项，表示文字在单选按钮的,右边；选择 left 选项，表示文字在单选按钮的左边；选择 top 选项，表示文字在单选按钮的上边；选择 bottom,选项，表示文字在单选按钮的下边5）selected 参数：用来确定单选按钮的初始状态选择 false 选项，表示单选按钮的初始状态为没有选,中；选择 true 选项，表示单选按钮的初始状态为选中5．CheckBox（复选框）组件,CheckBox（复选框）组件的“参数”面板如图 8-1-13 所示舞台工作区中的 CheckBox 组件实例如图 8-1-14,,所示CheckBox（复选框）组件的参数含义如下：,图 8-1-13 CheckBox 组件的“参数”面板,图 8-1-14 CheckBox 组件实例,（1）label 参数：用来修改 CheckBox 组件实例标签的名称，例如，改为“复选框” （2）labelPlacement 参数：打开其下拉列表框，利用它可以选择组件实例标签名称所处的位置它有 right、 left、top 和 bottom 四个选项，分别用来设置组件实例标签名称在复选框的左边、右边、上边或下边。

（3）selected 参数：打开其下拉列表框，它有两个选项，用来设置复选框的初始状态选择 true 选项，则 初始状态为选中；选择 false 选项，则初始状态为没选中 6．Label（标签）组件 Label（标签）组件的“参数”面板如图 8-1-15 所示舞台工作区中的 Label（标签）组件实例如图 8-1-16 所示Label（标签）组件参数的含义如下：,,图 8-1-15 Label（标签）组件的“参数”面板,图 8-1-16 Label 组件实例,（1）autoSize 参数：用来设置标签文字相对于 Label（标签）组件实例外框（也叫文本框）的位置它有四 个值，none（不调整标签文字的位置），left（标签文字与文本框的左边和底边对齐），center（标签文字居中）， right（标签文字与文本框的右边和底边对齐） （2）html 参数：用来指示标签文字是（true）否（false）采用 HTML 格式如果此参数值为 true，则不能使 用样式来设置标签的格式，但可以使用 font 标记将文本格式设置为 HTML默认值为 false （3）text 参数：用来设置标签的文本内容，默认值是 Label。

（4）可以设置 Label 标签组件实例的样式属性，来更改标签实例的外观举例如下（设舞台工作区内有一个 名称为 Label1 的组件实例）：,label1.setSize(80,20);,//设置标签文本框宽 80 个像素，高 20 个像素,label1.setStyle(“fontWeight“,“bold“); //设置标签文字字体为粗体,label1.setStyle(“fontSize“,26);,//设置标签文字大小为 26 磅,label1.setStyle(“color“, 0xff0000);,//设置标签文字颜色为红色,label1.setStyle(“fontFamily“, “隶书“); //设置标签文字字体为隶书,label1.setStyle(“color“,“red“); label1.setStyle(“embedFonts“,false); label1.text=“标签实例外观的改变“;,//设置标签文字颜色为红色 //指定字体不是嵌入字体 //设置标签文字内容为“标签实例外观的改变”,注意：Label 组件实例中的所有文本必须采用相同的样式例如，对同一标签内的单词设置 color 样式时， 不能将一个单词设置为 blue，而将另一个单词设置为 red。

embedFonts 样式是一个逻辑值，它指在 fontFamily 样式中指定的字体是否为嵌入字体如果 fontFamily 引用了嵌入字体，则此样式必须设置为 true否则，将不使用该嵌入字体如果此样式设置为 true，并且 fontFamily 不引用嵌入字体，则不会显示任何文本 Color 样式用来设置标签文字的颜色，它可以用 0xRRGGBB（RR、GG、BB 分别是两位十六进制数，分别表示 红、绿和蓝色成分多少）或者颜色的英文表示颜色例如：red 表示红色、green 表示绿色、blue 表示蓝色、black 表示黑色、white 表示白色、yellow 表示黄色、cyan 表示青色其中，0x 是数字 0 和英文小写字母 x 的组合 7．Button（按钮）组件参数 Button（按钮）组件实例的参数除了有“属性”面板内的 5 个外，在“组件检查器”面板内还有另外三个附,加的参数（visible、minHeight 和 minWidth，后两个参数一般不用设置），如图 8-1-4 所示Button 组件实例,主要参数的含义如下：,（1）icon 参数：为按钮添加自定义图标，该值是“库”面板中元件的标识符名称。

2）label 参数：用来修改按钮组件实例标签的名称，例如，改为“退出”3）labelPlacement 参数：用来确定按钮标题文字在按钮图标的相对位置，它有 right、left、top 和 bottom,四个选项4）selected 参数：用来确定按钮的默认状态当该值选择 false 选项时，表示按钮为按下状态；选择 true,选项时，表示按钮为释放状态5）toggle 参数：用来确定按钮为普通按钮还是切换按钮当该值选择为 false 时，表示按钮为普通按钮；,选择 true 时，表示按钮为切换按钮对于切换按钮，单击按下按钮后，按钮就处于按下状态；再单击该按钮后，,按钮才返回弹起状态6）visible 参数：用来设置标签对象是（true）否（false）可见默认值为 true8.2,【案例 31】列表浏览宝宝图像,相关知识 1．ComboBox（组合框）组件 （1）ComboBox 组件实例的“组件检查器”面板如图 8-2-2 所示其中一些参数的作用如下： data 参数：用来将数据值与 ComboBox 组件中的每一个选项相关联它是一个数组 l editable 参数：设置 ComboBox 组件实例是可编辑的（true）还是只。