《flashcs3动画制作基础与案例教程教学课件作者温俊芹教学讲义第9章组件》由会员分享，可在线阅读，更多相关《flashcs3动画制作基础与案例教程教学课件作者温俊芹教学讲义第9章组件（27页珍藏版）》请在金锄头文库上搜索。
1、第九章 组件第九章 组件从FlashMX版本开始引进了组件。它的该概念和使用方法类似于VB等高级编程软件中的组件，是集合了类似Windows功能的集体，比如复选框、组合框、列表框等等。它们实现某一方面特定功能，主要是为了制作交互式的动画提供方便。Flash CS3在原有的基础上丰富的组件内容，其组件是带有参数的影片剪辑，用户可以修改他们的外观和行为。组件可以是一个简单的用户界面控件，（如RadioButton或CheckBox），也可以是包含的内容（如List或DataGrid）。用户通过使用组件可以方便迅速地构建功能强大且具有一致外观和行为的应用程序，而不用创建自定义按钮、组合键和列表。只需
2、要将这些组件从“组件”面板拖到应用程序文档中即可。用户还可以方便地自定义这些组件的外观和直观感受，从而适合用户的应用程序设计。第一部分 学习要求一 应知目标1. 了解组件的基本概念2. 了解Flash UI组件的使用方法3. 了解媒体与视频组件的用法4. 了解自定义组件的制作二 应会目标1. 掌握各种组件的使用方法2. 掌握各种组件的综合使用方法三 预备知识1. 有一定的计算机程序设计基础，了解最基本的编程语言。2. 了解组件的基本用法。3. 对FlashCS3软件操作比较熟练。四 课时安排项目学时教学方式（参考）1预习课余2课堂讲解2学时. 讲解组件的基本概念. 重点介绍用户界面组件. 讲解
3、媒体与视频组件的使用. 讲解自定义组件的制作第二部分 课堂讲解9.1 组件的基本概念组件是复杂的影片剪辑元件，拥有一套完整的参数和ActionScript方法，组件运行期间用户可以设置这些参数和方法。Flash CS3内置了许多组件用户常用Flash UI组件，其中有Label（标签）组件、Text Area(文本框)组件、CheckBox（复选框）组件、ComboBox（组合框）组件、List（列表框）组件、RadioButton（单选按钮）组件、Button（按钮）组件等。用户可以在动画中添加一种组件，建立简单的交互界面，也可以将这些组件组合在一起，建立复杂的Web表单。用户可以编辑这些组
4、件，改变组件的外观设置，如：编辑组件的文本颜色格式、编辑组件的外壳、创建新的用户组件、创建新的外壳来替换现有组件的外壳。FlashCS3包括ActionScript2.0组件以及ActionScript3.0组件，运用时不能将这两组组件混合使用。对于给定的应用程序，只能使用其中的一组。根据打开的是ActionScript2.0文件还是ActionScript3.0文件，FlashCS3.0将显示对应的组件，如图9-1所示。 ActionScript2.0组件 ActionScript3.0组件图9-1 ActionScript2.0和ActionScript3.0的组件区别9.2 使用Flas
5、h用户界面（Flash UI）组件Flash UI组件是最常用的组件，这里介绍几种具有代表性的组件。主要有Label、TextArea、CheckBox、ComboBox、List、RadioButton、Button、UIScrollBar和ScrollPane等。9.2.1 Label（标签）标签组件用于对其它内容进行标注，起到一个注释的作用，如图9-2所示。 图9-2 标签组件 图9-3 标签组件的参数从组件面板中拖动标签组件到舞台，生成组件的一个实例。选择组件，打开“属性”面板，如图9-3所示，可以在“参数”选项卡中的“text”中设置所标注的内容，如图9-2中的“矩形”。9.2.2
6、TextArea（文本框）文本框组件用于显示和输入文本，如图9-4所示是一个文本框组件，在这里显示了一些内容，还可以将其设置成可以编辑的文字内容。 图9-4 文本框组件 图9-5 文本框组件的参数从组件面板拖动文本框组件到舞台，形成文本框组件的一个实例。选中该组件，打开“参数”面板，如图9-5所示。editable中可设置文本是否可以进行编辑，选择“true”则可以，选择“false”则不可以。在“text”中可以设置初始文本。wordWrap中如选择“true”则文本纵向显示，如选择“false”则文本横向显示。9.2.3 CheckBox（复选框）复选框是表单中最常见的成员，它的主要作用是
7、判断是否选取该方块所指代的功能，通常是多个复选框组件组成一组，供用户多项选择。对于选中的复选框，会有个对号标记，如图9-6所示，本科和大专复选框组件处于选中状态。 图9-6 复选框组件 图9-7 复选框组件的参数从“组件”面板拖动复选框组件到舞台，形成复选框组件的一个实例。选中该复选框，可以使用“参数”面板为每个实例设置如图9-7所示的参数。参数选项卡下各参数作用如下：u Label：设置复选框上文本的值，通常位于复选框的右侧，默认值为CheckBox。u labelPlacement：确定复选框旁边的标签文本和方框的位置关系。此参数可以是以下四个值之一：left、right、top 或 bo
8、ttom，默认值为 right，也就是标签将显示在复选框的右侧。u Selected：将复选框的初始值设置为选中(true) 或取消选中(false)，默认值为false。9.2.4 ComboBox（下拉列表）下拉列表组件如图9-8所示，由一个单行文本框和一个列表组成。单击文本框旁边的按钮可以展开列表，拖动列表中的滚动条可以查看所有的列表项。用户可以向文本框内输入文字内容，也可以从列表中选择。 图9-8 下拉列表组件 图9-9 下拉列表的参数从“组件”面板中拖动下拉列表组件到舞台上，生成组件的一个实例。选中这个实例，打开“参数”面板，如图9-9所示，各参数的作用如下：u data：在data
9、中设置需要的数据，这是与标签中列表项目一一对应的数组。u editable：设置用户是否可以修改菜单的内容，默认设置是false，文本框是灰色的，用户不能向组件的文本框内输入文字，只能从下拉列表中选择。u labels：标签，设置下拉列表中的项目，如9-8图中的“研究生”、“本科”等字样。双击该栏打开如图9-10所示的“值”对话框，单击按钮，添加列表的第一个项目，可以不断的点击添加项目。单击按钮可以删除选定的项目。单击按钮，可以调整项目上下之间的位置关系。 图9-10 “值”的列表 图9-11 列表框组件u rowcount：行数，设置组件运行时，列表展开后显示的行数。默认值是5，表示列表展开
10、时只能显示5行数据，要想显示其他数据，拖动列表中的滚动条。9.2.5 list (列表框)列表框组件如图9-11所示。列表框组件提供一个列表，从中选择需要的项目，可以选择一项，也可以选择多项。从“组件”面板中拖动列表框组件到舞台上，生成组件的一个实例。选中组件，打开“属性”面板，如图9-12所示。图9-12 列表框组件参数各参数作用如下：u data：数据，与标签中的项目一一对应的数组。u labels：标签，用来添加组件的项目，使用方法与comboBox相同。u multipleSelection：多项选择，设置是否可以选择多项。如果选择true，则可以使用户配合Ctrl键进行多选。u ro
11、wHeight：设置列表的行高，如果列表框内的项目行数超过组件的高度时，列表框内会出现垂直滚动条。注意：行数不能少于2行。9.2.6 radioButton（单选按钮）单选按钮如图9-12所示，单选按钮一般不单独使用，通常是多个单选按钮形成一组，供一些只能单项选择的场合使用。如9-12所示，选择了“男”单选按钮，就不能选择“女”单选按钮，它们之间是互相排斥的。 图9-12 单选按钮组件 图9-13 单选按钮组件参数从“组件”面板中拖动单选按钮组件到舞台，生成组件的一个实例。选中组件，打开“参数”面板，如图9-13所示，各参数的作用如下：u data：数据，与单选按钮对应的数据。u groupN
12、ame：组名，单选按钮都是成组用的，如果几个单选按钮的组名相同，表示这几个单选按钮是一组的，则这一组的单选按钮在运行时只能有一个组件处于选中状态。u Label：标签，设置组件旁边显示的文字，指明组件的用途。u labelPlacement：标签位置，设置组件旁边的文字与圆圈之间的位置关系。默认值是right，表示文字在圆圈的右边。9.2.7 Button（按钮）按钮组件如图9-14所示，按钮组件响应所有标准的鼠标和键盘事件。 图9-14 按钮组件 图9-15 按钮组件参数从“组件”面板拖动按钮组件到舞台，生成按钮组件的一个实例。打开“参数”面板，可以看到按钮组件的参数，如图9-15所示。各参
13、数作用如下：u icon：为编辑中的按钮组件添加标记。u label：标签，设置按钮上显示的文字，如图9-14所示的“确定”、“取消”。u labelPlacement：标签文字的位置。u selected：初识状态，设置组件运行时的起始状态。u toggle：该项按钮有true和false两个值。默认为“false”，这时的按钮单击过后马上恢复，如选中“true”，按钮在按下之后一直保持按下状态，再按下才恢复。9.2.8 UIScrollBar（UI滚动条）UIScrollBar组件如图9-16所示，允许将滚动条添加至文本字段，可以在创作时将滚动条添加至文本字段，或使用ActionScrip
14、t在运行时添加。从“组件”面板中拖动滚动条到舞台上，选中滚动条，打开“参数”面板，可以看到相关的参数，如图9-17所示，各参数作用如下： 图9-16 UIScrollBar组件 图9-17 UIScrollBar组件参数u _targetInstanceName：指UIScrollBar组件所附加到的文本字段实例的名称。 u Horizontal：指示滚动条是水平方向 (true) 还是垂直方向 (false)。默认值为 false。UIScrollBar组件的使用：（1）创建一个Flash文档，大小设置为550400像素。（2）选中“工具栏”中的文本按钮，在“属性”面板上选择“输入文本”，设置为多行，在文本周围显示边框，然后在舞台上绘制一个输入文本框，如图9-18所示。图9-18 绘制文本框示意图（3）从“组件”面板中拖入“UIScrollBar”组件，紧贴文本框的右边放置。（4）按下CtrlEnter组合键，然后在文本框中输入文字，当文字超过文本框的高度（默认为4行）时，会出现垂直滚动条，如图9-19所示。图9-19 预览效果图9.2.9 scrollPane（滚动窗格）scrollPane组件如图9-20所示，在一个可滚动区域中显示影片剪辑、JPEG文件和SWF文件。通过使用滚动窗格，可以限制这些媒体类型所占用的屏幕区域的大小。滚动窗格可以显示
