09-交互组件应用.ppt_第1页
09-交互组件应用.ppt_第2页
09-交互组件应用.ppt_第3页
09-交互组件应用.ppt_第4页
09-交互组件应用.ppt_第5页
已阅读5页,还剩48页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

1、第9章,交互组件应用,学 习 目 标,本章主要介绍了Flash cs中交互组件的相关知识,包括组件的作用、类常用UI组件、添加组件以及设置组件属性等内容。对于本章所学的常用UI组件,应结合本章的实例重点掌握,并学会利用这些组件制作类似的交互式动画效果。,本 章 重 点,组件的概念和作用 常用组件 组件的添加和属性设置 组件检查器的使用,9.1组件概述,组件是Flashcs中重要的组成部分,在Flashcs的交互应用中,组件通常与ActionScript脚本配合使用,通过对组件参数进行设置,并将组件所获取的信息传递给相应的ActionScript脚本,然后通过脚本执行相应的操作,从而实现最基本的

2、交互功能。,9.1.1 组件的作用,在Flashcs中,组件的主要作用是为制作者提供大部分的交互功能,若要使动画具备某种特定的交互功能,除了为动画中的帧、按钮或影片剪辑添加ActionScript脚本这种方法外,还可利用Flash cs中提供的各种组件来实现。并利用不同类型的组件制作出简单的用户界面控件,也可以制作出包含多项功能的交互页面;同时用户还可根据需要,对组件的参数进行自定义设置,从而修改组件的外观和交互行为。,组件可以让制作者无需自行构建复杂的用户界面元素,将精力浪费在类似元件的创建上,而只需通过选择相应的组件,并为其添加适当的ActionScript脚本,即可轻松地实现所需的交互功

3、能。在Flash cs中,用户可根据需要,为动画添加相应的组件,并通过ActionScript脚本使其实现特定的交互效果。学好ActionScript脚本和组件的基本应用,是制作Flash交互动画的必要前提。,9.1.2 Flash cs中组件的类型,在Flash cs中,组件的类型包括UserIntreface组件(即UI组件)和Video组件两种,如图9-1所示。 具体功能及含义如下:,图9-1 Flash cs组件,User Interface(UI) 组件,User Interface组件用于设置用户界面,并通过界面使用户与应用程序进行交互操作,在Flash中的大多数交互操作,都通过该

4、组件实现。在User Interface组件中,主要包括Button、CheckBox、ComboBox、Loader、ScrolIPane和TextArea等,如图9-2所示。,图9-2 UI组件,2. Video组件,Video组件用户设置多媒体组件,并通过这些组件与各种多媒体制作与播放软件等进行交互操作。在Video组件中,主要包括FLVPlayback(通过它可轻松将视频播放器包括在Flash应用程序中)、FLVPlaybackCaptioning、BackButton、PlayButton、SeekBar、PlavPauseButton以及VolumeBar、FullScreenBu

5、tton等交互组件,如图9-3所示。,图9-3 Video组件,9.1.3 打开组件,在Flash cs中,选择【窗口】|【组件】菜单命令或按【Ctrl+F7】键可以打开或隐藏“组件”面板。用户可以方便地自定义组件的外观和行为来满足自己的设计需求,如图9-4所示。,图9-4 打开组件,9.2 组件基本应用,在Flash cs中,组件的基本应用主要包括添加组件以及设置组件属性等两个方面,在完成这两步操作之后,只需为组件添加相应的Action脚本即可实现基本的交互功能。下面就对Flash cs中常用的组件、添加组件并设置组件属性、以及利用组件检查器检查组件参数的方法进行详细讲解。,9.2.1 Fl

6、ash常用组件,在Flash cs的组件类型中,Video组件通常只在涉及到视频交互控制时才会应用,而除此之外的大部分交互操作都通过UI组件来实现,因而在制作交互动画方面,UI组件是应用最广,也是最常用的组件类型之一。,在Flash cs的UI组件中,常用组件包括 按钮组件(Button) 复选框组件(CheckBox) 下拉列表框组件(ComboBox) 列表框组件(List) 单选项组件(RadioButton) 滚动条组件(Scro11Pane) 文本显示组件(TextArea) 文本输入组件(Textlnupt),1Button,Button组件是Flash组件中最简单的一个组件,利用

7、Button组件可执行所有的鼠标和键盘交互事件。打开“组件”面板,选择Button组件,按住鼠标左键不放将其拖动到场景中即可完成按钮的创建,如图9-5所示。,图9-5 按钮组件参数,Button组件各参数的具体功能及含义如下:emphasized:用于指定当按钮处于弹起状态时,Button组件周围是否显示边框。若值为tme表示当按钮处于弹起状态时,在Button组件四周显示边框;若值为。false则表示不显示边框。其默认值为false。labelPlacement:用于确定按钮上的标签文本相对于图标的方向,包括left、right、top和bottom这4个选项。其默认值为right。labe

8、l:用于设置Button组件的名称。其默认值为Label。,selected:用于根据toggle的值设置Button组件是被按下还是被释放,若toggle的值为true则表示按下,值为false表示释放。其默认值为false,toggle:用于确定是否将Button组件转变为切换开关。若要让Button组件按下后马上弹起,则选择false选项;若要让Button组件在按下后保持按下状态,直到再次按下时才返回到弹起状态,则选择true。其默认值为false。,2CheckBox组件,CheckBox组件主要用于设置一系列可选择的项目,并可同时选取多个项目,以此对指定对象的多个数值进行获取或设置

9、,如图9-6所示。,图9-6 CheckBox组件及checkBox组件参数,CheckBox组件各参数的具体功能及含义如下:label:用于设置CheckBox组件显示的内容。其默认值为Label。selected:用于确定CheckBox组件的初始状态为选中(true)或取消选中(false)。其默认值为false。lablePlacement:用于确定CheckBox组件上标签文本的方向,包括left、right、top和bottom这4个选项。其默认值为fight。,3ComboBox组件,ComboBox组件的作用与对话框中的下拉列表框类似,通过单击ComboBox组件中的下拉按钮,

10、可打开下拉列表并显示相应的选项,通过选择选项获取所需的数值,如图9-7所示。,图9-7 ComboBox组件及ComboBox组件参数,ComboBox组件各参数的具体功能及含义如下:dataProvider:用于设置相应的数据,并将其与ComboBox组件中的项目相关联。prompt:用于设置ComboBox组件的项目名称。editable:用于确定是否允许用户在下拉列表框中输入文本。若允许输入选择true;若不允许输入则选择false,默认值为false。rowCount:用于确定不使用滚动条时,下拉列表中最多可以显示的项目数量,默认为5。,4List组件,List组件主要用于创建一个可滚

11、动的单选或多选列表框,并通过选择列表框中显示的图形或其他组件获取所需的数值,如图9-8所示。,图9-8 List组件参数,List组件各参数的具体功能及含义如下:allowMultipleSelection:用于指定List组件是否可同时选择多个选项。如果值为true,则可以通过按住【Shift】键来选择多个选项。其默认值为false。horizontalLineScrollSize:用于设置当单击列表框中水平滚动箭头时,要在水平方向上滚动的内容量,该值以像素为单位。其默认值为4。,horizontaIScrollPolicy:用于设置List组件中的水平滚动条是否始终打开。包括on、off和

12、auto这3个选项。其默认值为auto。verticalPageScrollSize:用于设置按滚动条轨道时,垂直滚动条上滚动滑块要移动的像素数。当值为0时,该属性检索组件的可用宽度。其默认值为0。dataProvider:用于设置相应的数据,并将其与L,ist组件中的选项相关联。,horizontalPageScrollSize:用于设置按滚动条轨道时,水平滚动条上滚动滑块要移动的像素数。当值为0时,该属性检索组件的可用宽度。其默认值为0。verticalLineScrollSize:用于设置当单击列表框中垂直滚动箭头时,要在垂直方向上滚动的内容量,该值以像素为单位。其默认值为4。verti

13、calScrollPolicy:用于设置List组件中的垂直滚动条是否始终打开。包括on、off和auto这3个选项。其默认值为auto。,5RadioButton组件,RadioButton组件主要用于设置一系列可选择项目,并通过选择其中的某一个项目获取所需的数值,如图9-9所示。,图9-9 RadioButton组件参数,RadioButton组件各参数的具体功能及含义如下:group Name:用于指定RadioButton组件所属的项目组,项目组由与该参数相同的所有RadioButton组件组成,在同一项目组中只能选择一个RadioButton组件,并返回该组件的值。label:用于设

14、置RadioButton的文本内容。其默认值是Label。lablePlacement:确定RadioButton组件上标签文本的方向,包括left、right、top和bottom这4个选项。其默认值为right。,selected:用于确定RadioButton组件的初始状态为选中(true)或取消选中(false)。其默认值为false。value:用于设置RadioButton的对应值。其默认值是null。,6ScrollPane,滚动条组件ScrollPane用于在某个大小固定的文本框中无法将所有内容显示完全时使用。滚动条是动态文本框与输入文本框的组合,在动态文本框和输入文本框中添加

15、水平和竖直滚动条,可以通过拖动滚动条来显示更多的内容,如图9-10所示。,图9-10 ScrollPane组件,ScrollPane组件各参数的具体功能及含义如下:scrollDrag:可确定是否允许用户在滚动条中滚动内容,如果允许选择“Ixue”选项,如果不允许选择“false”选项,默认值为“false”。SOUlCe:获取或设置以下内容:绝对或相对URL(该URL标识要加载的SWF或图像文件的位置)、库中影片剪辑的类名称、对显示对象的引用或者与组件位于同一层上的影片剪辑的实例名称。,7TextArea组件.,TextArea组件主要用于显示或获取动画中所需的文本。在交互动画中需要显示或获

16、取多行文本字段的任何地方,都可使用TextArea组件来实现,如图9-11所示。,图9-11 TextArea组件参数,TextArea组件各参数的具体功能及含义如下:condenseWhite:用于设置是否从包含HTML文本的TextArea组件中删除多余的空白。在Flash cs中,空格和换行符都属于组件中的多余空白。当值为tme时表示删除多余的空白;值为false表示不删除多余空白。其默认值为falseeditable:用于设置允许用户编辑TextArea组件中的文本。值为true表示用户可以编辑TextArea组件所包含的文本;值为false则表示不能进行编辑。其默认值为true。,h

17、orizontalScrollPolicy:用于设置TextArea组件中的水平滚动条是否始终打开。包括on、off和auto这3个选项。其默认值为auto。maxChars:用于设置用户可以在TextArea组件中输入的最大字符数。text:用于获取或设置TextArea组件中的字符串,其中也包含当前TextInput组件中的文本。此属性包含无格式文本,不包含HTML标签。若要检索格式为HTML的文本,应使用htmlText属性。,verticalScrollPolicy:用于设置TextArea组件中的垂直滚动条是否始终打开。包括on、off和auto这3个选项。其默认值为auto。htm

18、lText:用于设置或获取TextArea组件中文本字段所含字符串的HTML表示形式。其默认值为空。restrict:用于设置TextArea组件可从用户处接受的字符串。如果此属性的值为null,则TextArea组件会接受所有字符。如果此属性值设置为空字符串(),则TextInput组件不接受任何字符。其默认值为null。,wordWrap:用于设置文本是否在行末换行。若值为true,表示文本在行末换行:若值为false则表示文本不换行。其默认值为true。,8TextInput组件,TextInput组件主要用于显示或获取动画中所需的文本。与TextArea组件不同的是,TextInput

19、组件只用于显示或获取交互动画中的单行文本字段,如图9-12所示。,图9-12 TextInput组件参数,TextInput组件各参数的具体功能及含义如下:restrict:用于设置TextInput组件可从用户处接受的字符串。需注意的是:未包含在本字符串中的,以编程方式输入的字符也会被TextInput组件所接受。如果此属性的值为null,则TextInput组件会接受所有字符;若将值设置为空字符串(),则不接受任何字符。其默认值为null。 text:用于获取或设置TextInput组件中的字符串。此属性包含无格式文本,不包含HTML标签。若要检索格式为HTML的文本,应使用TextAre

20、a组件的htmlText属性。,9.2.2 添加组件的方法,在Flash cs的组件类型中,User Intreface组件用于设置用户界面,并实现大部分的交互操作组件是应用最广,要在动画中应用User Intreface交互组件,就需要将所需的组件添加到舞台中。 【例9-1】下面以在舞台中ComboBox组件为例,对Flash cs中添加组件的方法进行讲解。,操作步骤:(1) 选择【窗口】|【组件】命令(或按【Ctrl+F7】键),打开“组件”面板。单击User Intreface左侧的按钮打开该类别,如图9-13所示。,图9-13 打开UI组件,(2) 单击User Intreface左侧

21、的按钮打开该类别,并选中ComboBox组件,按住鼠标左键,然后将ComboBox组件向舞台中拖动,如图9-14所示。,图 9-14 拖动组件ComboBox,(3) 将ComboBox组件放置到适当位置后,释放鼠标左键,完成组件的添加,如图9-15所示。,图 9-15 完成组件添加,9.2.3 设置组件属性的方法,在舞台中添加组件后,还需要根据动画的实际情况,对组件的属性进行设置。【例9-2】下面以ComboBox组件为例,对Flash cs中设置组件属性的方法进行讲解。,操作步骤:(1) 在舞台中选中要设置属性的ComboBox组件,如图9-16所示。,图 9-16 选中舞台中的Combo

22、Box组件,(2) 在“属性”面板中单击“参数”选项卡,即可看到ComboBox组件的对应参数,如图9-17所示。,图 9-17 属性面板中参数,(3) 选中dataProvider参数,然后单击参数右侧的剧按钮,打开“值”对话框,如图9-18所示。,图 9-18 打开“值”对话框,(4) 单击按钮添加新值,将label的值设置为“白云”,将data的值设置为“xz”。然后用同样的方法添加其余的值。完成后单击“确定”按钮确认数值,并关闭“值”对话框,如图9-19所示。,图 9-19 添加新值,(5) 在“参数”面板中保持editable参数的默认值false,然后将prompt参数的值设置为“选择旅游地点”,并将rowCount参数的值设置为“3”, 如图9-20所示。,图9-20 设置参数,(6) 在舞台中单击鼠标左键,即可完成

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论