Flash动画设计与制作 张洪星 等 第07章新.pptVIP

第7章 组件 7.1 组件使用 7.1 组件使用 7.1 组件使用 7.1 组件使用 7.2 用户界面(UI)组件 7.1.1 组件添加和设置 1.添加组件 与引用【库】面板中的元件一样，组件的引用方法也简单，用鼠标将【组件】面板中的相应组件拖到场景上即可。 2.修改和删除组件 这里的修改主要是组件实例外形的变化。 使用【任意变形】工具或setSize( )方法 . 7.1.2 组件事件 所有组件都有事件，在用户与组件进行交互操作或组件中发生重要事情时，即会广播这些事件。要处理事件，请编写在触发事件时执行的“动作脚本”代码。 使用on( )组件事件处理函数。 使用事件侦听器。 接下来制作一个简单的实例。 操作步骤如下： 步骤1：将CheckBox组件从“组件”面板拖到舞台中。 步骤2：选中该组件，在【动作】面板中，输入以下代码： on(click){ trace(CheckBox was clicked); }//可以在大括号“{ }”之间输入所需的任何代码。 步骤3：选择【控制】→【测试影片】命令，然后在“输出”面板中单击要查看跟踪的复选框。测试效果如图7.1所示。 7.1.2 组件事件 图7.1 on()事件 要注册事件侦听器，具体制作步骤如下： 步骤1：将 Button 组件从【组件】面板拖到舞台上。 步骤2：在【属性】面板中，输入实例名称button。 步骤3：将 TextInput 组件从【组件】面板拖到舞台上。 步骤4：在【属性】面板中，输入实例名称mytext。 步骤5：在时间轴中选择第1帧，在【动作】面板中，输入以下代码： form= new Object(); form.click = function(evt){ mytext.text = evt.target; } button.addEventListener(click, form); 事件对象的目标属性是对广播事件的实例的引用。此代码在文本输入字段显 示目标属性的值。效果如图7.2所示 图7.2注册侦听器 7.2.1 按钮（button）组件 Button 组件是一个可调整大小的矩形用户界面按钮。可以给按钮添加一个自定义图标。也可以将按钮的行为从按下改为切换。在单击切换按钮后，它将保持按下状态，直到再次单击时才会返回到弹起状态 7.2 用户界面(UI)组件 利用Icon参数给按钮添加一个图标，具体步骤如下： 步骤1： 新建“按钮组件.fla”影片文档，参数值默认。 步骤2：将Button组件从【组件】面板拖到舞台上。在【属性】面板中，输入实例名称helpBtn。在【属性】面板中，执行以下操作： 步骤3：插入图形元件“点”，在舞台上绘制一个空心圆，坐标设置为（0，2.2）线条和大小如图7.3所示以在按钮上获取适当的布局。 2??????? 为标签参数输入提交。 2??????? 为图标参数输入subIcon。链接标识符必须是subpIcon 2??????? 将切换属性设置为true。 图73 点属性设置 7.2 用户界面(UI)组件 图7.9 链接标示符 图7.10 带有图标的按钮 步骤4：打开【库】面板，用鼠标右键单击图标元件图标，在弹出的快捷菜单中选择【链接】命令，在【链接属性】对话框，输入一个链接标示符subIcon如图7.4所示. 步骤5：执行【控制】→【测试影片】命令。效果如图7.5所示，为按钮添加自定义图标。当然，在实际应用中，可以设计一些更精彩和有实际意义的图标来。 ? 7.2 用户界面(UI)组件 7.2.2 复选框（checkbox）组件 复选框是一个可以选中或取消选中的方框。当它被选中后，框中会出现一个复选标记。读者可以为复选框添加一个文本标签，并可以将它放在左侧、右侧、顶部或底部。 u?????? label 设置复选框上文本的值；默认值是 defaultValue。 u?????? selected 将复选框的初始值设为选中 (true) 或取消选中 (false)。 u?????? labelPlacement 确定复选框上标签文本的方向。该参数可以是下列四个值之一：left、right、top 或 bottom，默认值是 right。 参数有： 7.2 用户界面(UI)组件 7.2.3 组合框（ComboBox）组件 组合框可以是静态的，也可以是可编辑的。使用静态组合框，用户可以从下拉列表中做出一项选择。 如图所示 图7.11 下拉列表 7.2 用户界面(UI)组件 7.2.3 组合框（ComboBox）组件 ComboBox 参数，以下是读者可以在【属性】面板中或在【组件检查器】面板中为每个