第6章 模板与组件.ppt

《第6章 模板与组件.ppt》由会员分享，可在线阅读，更多相关《第6章 模板与组件.ppt（27页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、第6章 模板与组件模板的基础知识照片幻灯片放映模板定制模板组件内容的相关知识本章重点：利用Flash中的模板功能可以快速的创建出各类动画。Flash提供了大量的组件供用户使用，如滚动条、按钮、窗口等。组件实际上是一种特殊的影片剪辑，其中的参数由用户在Flash中创作时进行设置，其中的ActionScript方法、属性和事件可供用户在运行时自定义组件。通过本章学习应掌握一下内容：6.1 认识模板 模板是预先设置好的特殊文档，Flash提供了一些实用的系统模板，只要配合自己的需要进行一些修改即可将它应用到自己的动画中去，从而大大提高制作动画的效率。运行Flash后，从开始页右边的“从模板创建”栏中

2、，可以看到模板类型列表，如图6-1所示。或者执行菜单中的“文件|新建”命令，在弹出“新建文档”对话框中单击“模板”选项卡，此时“类别”中列出了系统自带的模板类别，选中一种类别后，在“模板”中会列出所选类下的所有模板文件，选中后会在对话框的右侧显示出模板的缩略图及描述文本，如图6-2所示。图6-1模板类型列表 图6-2“模板”选项卡保存和应用模板的具体操作步骤为：1）打开配套光盘“素材及结果|2.8.4 制作广告条动画|广告条.fla”。2）执行菜单中的“文件|另存为模板”命令，在弹出的“另存为模板”对话框中设置自定义模板的“名称”、“类别”和“描述”信息，如图6-3所示，单击“保存”按钮即可创

3、建模板。3）此时关闭文件后，执行菜单中的“文件|新建”命令，在弹出的“从模板创建”对话框中单击“模板”选项卡，然后从左侧类别中选择“广告”，此时在右侧模板中可以看到刚才创建的“广告条”，如图6-4所示。选择该项后，单击“确定”按钮，即可以定制模板为基础创建一个新文档。6.2 保存和应用模板图6-3设置“另存为模板”的参数 图6-4可以看到刚才创建的“广告条”模板 Flash提供了大量的组件供用户使用，如滚动条、按钮、窗口等。组件实际上是一种特殊的影片剪辑，其中的参数由创作者在Flash中创作时进行设置，其中的ActionScript方法、属性、和事件可供使用者在运行时自定义组件。设计这些组件的

4、目的是为了让开发人员重复使用和共享代码，封案丛庸埽佣股杓迫嗽蔽扌氡嘈碅ctionScript就能够使用和自定义这些功能。组件可以将应用程序的设计过程和编码过程分开。执行菜单中的“窗口|组件”命令，可以调出“组件”面板。ActionScript 2.0和ActionScript 3.0的组件面板是不同的，如图6-5所示。为了便于读者更好的理解组件，下面以ActionScript 3.0的组件面板为例具体介绍User Interface组件类中各个组件的含义。6.3 组件内容简介 ActionScript 2.0的组件面板 ActionScript 3.0的组件面板图6-5组件面板 Button组

5、件为一个按钮，如图6-6所示。使用按钮可以实现表单提交以及执行某些相关的行为动作。在舞台中添加Button组件后，可以通过参数面板设置Button组件的相关参数，如图6-7所示。1.Button组件组件 图6-6Button组件 图6-7Button组件的参数面板lemphasized：用于设置当按钮处于弹起状态时，Button组件周围是否会有边框。llabel：用于设置按钮上文本的值。llabelPlacement：用于设置按钮上的文本在按钮图标内的方向。该参数可以是下列4个值之一，即left、right、top或buttom，默认为right。lselected：该参数指定按钮是出于按下状

6、态(true)还是释放状态(false)，默认值为false。ltoggle：将按钮转变为切换开关。如果值为true，则按钮在单击后保持按下状态，并在再次单击时返回到弹起状态。如果值为false，则按钮行为与一般按钮相同，默认值为false。CheckBox组件为多选按钮组件，如图6-8所示。使用该组件可以在一组多选按钮中选择多个选项。在舞台中添加CheckBox组件后，可以通过参数面板设置CheckBox组件的相关参数，如图6-9所示。2.CheckBox组件组件 图6-8CheckBox组件 图6-9CheckBox组件的参数面板llabel：用于设置多选按钮右侧文本的值。llabelPl

7、acement：用于设置按钮上的文本在按钮图标内的方向。该参数可以是下列4个值之一，即left、right、top或bottom，默认为right。lselected：用于设置多选按钮的初始值为被选中或取消选中。被选中的多选按钮会显示一个对勾，其参数值为true。如果将其参数值设置为false表示会取消选择多选按钮。ColorPicker组件为包含一个或多个颜色的调色板，用户可以从中选择颜色，如图6-10所示。在舞台中添加ColorPicker组件后，可以通过参数面板设置ColorPicker组件的相关参数，如图6-11所示。3.ColorPicker组件组件图6-10ColorPicker组

8、件 图6-11ColorPicker组件的参数面板lselectedColor：用于设置ColorPicker组件的地调色板中当前加亮显示的颜色。lshowTextField：用于设置是否显示ColorPicker组件中选择颜色的颜色值，其参数为布尔值。ComboBox组件为下拉列表的形式，如图6-12所示。用户可以在弹出的下拉列表中选择其中一项。在舞台中添加ComboBox组件后，可以通过参数面板设置ComboBox组件的相关参数，如图6-13所示。4.ComboBox组件组件 图6-12ComboBox组件 图6-13ComboBox组件的参数面板ldataProvider：用于设置下拉列

9、表当中显示的内容，以及传送的数据。leditable：用于设置下拉菜单中显示的内容是否为编辑的状态。lprompt：用于设置对ComboBox组件开始显示时的初始内容。lrowCount：用于设置下拉列表中可显示得最大行数。5.DataGrid组件组件 DataGrid组件是基于列表的组件，提供呈行和列分布的网格，如图6-14所示。可以在该组件顶部指定一个可选标题行，用于显示所有属性名称。每一行由一列或多列组成，其中每一列表示属于指定数据对象的一个属性。DataGrid组件用于查看数据，并不适合用作类似于HTML表格的布局工具谖杼刑砑覦ataGrid组件后，可以通过参数面板社会自DataGri

10、d组件的相关参数，如图6-15所示。图6-14DataGrid组件 图6-15DataGrid组件的参数面板lallowMultipleSelection：用于设置能否一次选择多个列表项目，其参数为布尔值，true值表示可以一次选择多个项目；false值表示一次只能选择一个项目。leditable：用于设置用户能否编辑数据中的项目。lrowHeight：用于设置DataGrid标题的高度，其单位为像素。lhorizontalLineScrollSize：当显示水平滚动条下，单击水平方向上滚动条时水平移动的数量。其单位为像素，默认值为4。lhorizontalPageScrollSize：用于设

11、置按滚动条时水平滚动条上滚动滑块要移动的像素数。当该值为0时，该属性检索组件的可用宽度。lhorizontalScrollPolicy：用于设置滚动条是否始终打开。lresizableColumns：用于设置用户能否更改列的尺寸。lrowHeight：用于设置DataGrid组件中每一行的高度，其单位为像素。lshowHeaders：用于设置DataGrid组件是否显示列标题，其单位为像素。lsortableColumns：用于设置用户能否通过单击列标题单元格对数据提供者中的项目进行排序。lverticalLineSrollSize：当显示垂直滚动条下，单击垂直滚动箭头时要在垂直方向上滚动多少

12、像素，其单位为像素，默认值为4。lverticalPageScrollSize：用于设置按滚动条时垂直滚动条上滚动滑块要移动的像素数，当该值为0时，该属性检索组件的可用高度。lverticalScrollPolicy：用于设置垂直滚动条是否始终打开。6.Label组件组件 Label组件将显示一行或多行纯文本或HTML格式的文本，如图6-16所示，这些文本的对齐和大小格式可以进行设置。Label组件没有边框而且无法获得焦点。在舞台中添加Label组件后，可以通过参数面板设置Label组件的相关参数，如图6-17所示。图6-16Label组件 图6-17Label组件的参数面板lautoSize

13、：用于设置如何调整标签大小和对齐标签以适合其text属性的值。lcondenseWhite：用于设置是否应从包含HTML文本的Label组件中删除额外空白，如空格和换行符。lhtmlText：用于设置Label组件显示的文本，包括表示该文本样式的HTML标签。lselectable：用于设置Label组件显示的文本是否可选。ltext：用于设置Label组件现实的纯文本内容。lwordWrap：用于设置文本是否换行，默认值为true，表示可以自动换行。7.List组件组件 List组件为下拉列表的形式，如图6-18所示。用户可以从下拉列表中选择一项或多项。在舞台中添加List组件后，可以通过参

14、数面板设置List组件的相关参数，如图6-19所示。图6-18List组件 图6-19List组件的参数面板lallowMultipleSelection：用于设置能否一次选择多个列表项目，其参数为布尔值，true值表示可以一次选择多个项目；false值表示一次只能选择一个项目。ldataProvider：用于设置下拉列表中显示的内容，以及传送的数据。lhorizontalLineScrollSize：用于设置当单击水平方向上滚动条时水平移动的数量。其单位为像素，默认值为4。lhorizontalPageScrollSize：用于设置按滚动条时水平滚动条上滚动滑块要移动的像素数。当该值为0时，

15、该属性检索组件的可用宽度。lhorizontalScrollPolicy：用于设置水平滚动条是否始终打开。lverticalLineScrollSize：用于设置当单击滚动箭头时要在垂直方向上滚动多少像素。其单位为像素，默认值为4。lverticalPageScrollSize：用于设置按滚动条时垂直滚动条上滚动滑块要移动的像素数。当该值为0时，该属性检索组件的可用高度。lverticalScrollPolicy：用于设置垂直滚动条是否始终打开。8.NumbericStepper组件组件 NumbericStepper组件用于显示一组已排序的数字，如图6-20所示。用户可以从中进行选择。此组件

16、包括一个单行字段和一对箭头按钮，前者用于文本输入，后者用于单步调试该组数值，也可以使用向上和向下键查看该组数值。在舞台中添加NumbericStepper组件后，可以通过参数面板设置NumbericStepper组件的相关参数，如图6-21所示。图6-20NumbericStepper组件 图6-21NumbericStepper组件的参数面板lenabled：用于设置组件是否可以接受用户交互。lmaximum：用于设置数值序列中的最大值。lminimum：用于设置数值序列中的最小值。lstepSize：用于设置一个非零数值，该值描述值与值之间的变化单位。lvalue：用于设置NumericS

17、tepper组件的当前值。9.ProgressBar组件组件 ProgressBar组件用于显示内容的加载进度，如图6-22所示。ProgressBar通常用于显示图像和部分应用程序的加载状态。加载进程可以是确定的，也可以是不确定的。当要加载的内容量是已知时，则使用确定的进度栏，任务进度以线性表示。不确定的进度栏以条纹图案填充表示。在舞台中砑覲rogressBar组件后，可以通过参数面板设置ProgressBar组件的相关参数，如图6-23所示。图6-22ProgressBar组件 图6-23ProgressBar组件的参数面板ldirection：用于设置进度栏的填充方向。lmode：设置用

18、于更新进度栏的方法。lsource：用于设置对待加载内容的引用，ProgressBar将测量对此内容的加载操作的进度。10.RadioButton组件组件 RadioButton组件为单选按钮组件，可以让用户从一族单选按钮选项中选择一个选项，如图6-24所示。在舞台中添加RadioButton组件后，可以通过参数面板设置RadioButton组件的相关参数，如图6-25所示。图6-24RadioButton组件 图6-25RadioButton组件的参数面板lgroupName：单击按钮的组名称，一组单选按钮有一个统一的名称。llabel：用于设置单选按钮上的文本内容。llabelPlacem

19、ent：用于确定按钮上标签文本的方向。该参数可以是下列4个值之一，即left、right、top或buttom，其默认值为right。lselected：用于设置单选按钮的初始值为被选中或取消选中。被选中的单选按钮中会显示一个圆点，其参数值为true，一个组内只有一个单选按钮可以有被选中的值true。如果将其参数值设置为false，表示会取消选择单选按钮。11.ScrollPane组件组件 ScrollPane组件用于设置一个可滚动的区域来显示JPEG、GIF与PNG文件以及swf文件，如图6-26所示。在舞台中添加ScrollPane组件后，可以通过参数面板设置ScrollPane组件的相关

20、参数，如图6-27所示。图6-26ScrollPane组件 图6-27ScrollPane组件的参数面板lhorizontalLineScrollSize：当显示水平滚动条下，单击水平方向上的滚动条时水平移动的数量。其单位为像素，默认值为4。lhorizontalPageScrillSize：用于设置按滚动条时水平滚动条上滚动滑块要移动的像素数。当该值为0时，该属性检索组件的可用宽度。lhorizontalScrollPolicy：用于设置水平滚动条是否始终打开。lscrollDrag：用于设置当用户在滚动窗格中拖动内容时是否发生滚动。lsource：用于设置滚动区域内的图像文件或swf文件。

21、lverticalLineScriollSize：，当显示垂直滚动条下，单击滚动箭头时要在垂直方向上滚动多少像素。其单位为像素，默认值为4。lverticalPageScrollSize：用于设置按滚动条时垂直滚动条上滚动滑块要移动的像素数。当该值为0时，该属性检索组件的孔用高度。lverticalScroPolicy：用于设置垂直滚动条是否始终打开。12.Slider组件组件 使用Slider组件，用户可以在滑块轨道的端点之间移动滑块来选择相应的数值，如图6-28所示。Slider组件的当前值由滑块的相对位置确定，端点对应于Slider组件的minimum和maximum值。在舞台中添加Sl

22、ider组件后，可以通过参数面板设置Slider组件的相关参数，如图6-29所示。图6-28Slider组件 图6-29Slider组件的参数面板ldirection：用于设置滑块轨道是水平或是垂直。lmaximum：用于设置Slider组件实例所允许的最大值。lminimum：用于设置Slider组件实例所允许的最小值。lsnapInterval：用于设置用户移动滑块时值增加或减小的量。ltickInterval：用于设置相对于组件最大值的刻度值间距。lvalue：用于设置Slider组件的当前值。13.TextArea组件组件 TextArea组件为多行文本框，如图6-30所示。如果需要使

23、用单行文本框，可以使用TexInput组件。在舞台中添加TexArea组件后，可以通过参数面板设置TextArea组件的相关参数，如图6-31所示。图6-30TextArea组件 图6-31TextArea组件的参数面板lcondenseWhite：用于设置是否从包含HTML文本的TextArea组件中删除额外空白。leditable：用于设置TextArea组件是否为可编辑状态，参数值为true与false，表示可编辑与不可编辑，默认值为true。lhorizontalScrollBar：用于设置水平方向的滚动条，其包含auto、on和off 3个参数值。auto用于设置自动出现水平方向滚动

24、条；on用于设置始终出现水平方向滚动条；off用于设置没有水平方向滚动条。lhtmlText：用于设置文本是否采用HTML格式，其包括true和false两个参数值。如果将参数值设为true，则可以使用html标签来设置文本格式。lmaxChars：用于设置用户可以在文本字段中输入的最大字符数。llrestrict：用于设置文本字段从用户处接受的字符串。ltext：用于设置TextArea组件中的文本内容。lverticalScrollPolicy：用于设置垂直方向的滚动条，其包含auto、on和off 3个参数值。auto用于设置自动出现垂直方向滚动条；on用于设置始终出现垂直滚动条；off

25、用于设置没有垂直方向滚动条。lwordWrap：用于设置文本是否自动换行，默认值为true，表示可以自动换行。14.TextInput组件组件 TextInput组件为当行文本框，如图6-32所示。在舞台中添加TextInput组件后，可以通过参数面板设置TextInput组件的相关参数，如图6-33所示。图6-32TextInput组件 图6-33TextInput组件的参数面板ldisplayAsPassword：用于设置在text中的文本内容的显示方式。参数为true时，文本将以*号显示；参数为false时，文本将以正常方式显示。leditable：用于设置TextInput组件是否为可

26、编辑状态，参数值为true与false，表示可编辑与不可编辑，默认值为true。lmaxChars：设置用户可以在文本字段中输入的最大字符数。lrestrict：用于设置文本字段从用户处接受的字符串。ltext：用于设置TextInput组件中的文本内容。15.TileList组件组件 TileList组件，如图6-34所示。提供呈行和列分布的网格，通常用来以“平铺”格式设置并显示图像。在舞台中添加TileList组件后，可以通过参数面板设置TileList组件的相关参数，如图6-35所示。图6-34TileList组件 图6-35TileList组件的参数面板lallowMultipleSe

27、lection：用于设置是否一次选择多个列表项目，其参数为布尔值，true值表示可以一次选择多个项目；false值表示一次只能选择一个项目。lcolumnCount：用于设置在列表中可见的列的列数。lcolumnWidth：用于设置应用于列表中的列的宽度，以像素为单位。ldataProvider：用于设置要查看的项目列表的数据模型。ldirection：用于设置TileList组件是水平滚动还是垂直滚动。lhorizontalLineScrollSize：在显示水平滚动条下，单击水平方向上滚动条时水平移动的数量。其单位为像素，默认值为4。lhorizontalPageScrollSize：设置

28、按滚动条时，水平滚动条上滚动滑块要移动的像素数。当该值为0时，该属性检索组件的可用宽度。lrowCount：用于设置在列表中可见行的行数。lrowHeight：用于设置应用于列表中每一行的高度，以像素为单位。lscrollPolicy：用于设置TileList组件的滚动策略。lverticalLineScrollSize：在显示垂直滚动条下，单击垂直方向上滚动条时垂直移动的数量。其单位为像素，默认值为4。lverticalPageScrollSize：用于设置按滚动条时，垂直滚动条上滚动滑块要移动的像素数。当该值为0时，该属性检索组件的可用高度。16.UILoader组件组件 UILoader

29、组件，如图6-36所示。可以设置要加载的内容，然后在运行时监视加载操作。UILoader组件同时还处理已加载内容的大小调整。在舞台中添加UILoader组件后，可以通过参数面板设置UILoader组件的相关参数，如图6-37所示。图6-36UILoader组件 图6-37UILoader组件的参数面板lscaleContent：用于调整UILoader组件的大小。当参数为 true 时，内容会进行缩放以适合加载器的边界（并在调用 setSize()时重新进行缩放）；当 参数为 false 时，组件的大小固定为内容的大小，并且 setSize()和调整大小属性都会失去作用。lsource：用于设置要加载的图像或swf文件。17.UIScrollBar组件组件 UIScrollBar组件，如图6-38所示。包括所有滚动条功能，此组件可以被附加到TexField组件实例。在舞台中添加UIScrollBar组件后，可以通过参数面板设置UIScrollBar组件的相关参数，如图6-39所示。图6-38UIScrollBar组件 图6-39UIScrollBar组件的参数面板ldirection：用于设置滚动条是水平或是垂直。lscrollTargetName：用于设置被附加滚动条的对象的实例名称。