《FLEX4.0 RIA开发详解》自学笔记 第3篇 组件篇
第3篇 组件篇
2013.11.30
CH14 使用组件构建FLEX界面
14.1 FLEX 组件概述
FLEX 组件是指用MXML标准和AS3.0 代码定义的一种可重用的控件，包括属性、方法、事件、样式。
组件根据是否由adobe公司提供，可分为基础组件和自定义组件。
组件根据是否可见，又可分为可见组件和非可见组件。非可见组件在应用程序中是不可显示的，如<mx:script>组件用于插入AS3.0代码，<mx:binding>组件用于绑定数据。
14.2 Flex可见组件
FB4中将可见组件分成以下几类：
・定制：用户自定义组件
・控件：基础的控制组件，如按钮、文本、列表
・数据控件：数据呈现组件，如网格、下拉列表、树；
・布局：如窗口、表单
・导航器：如TAB条、按钮条
・AIR组件：可嵌套HTML组件，打开本地文件系统的FileSystem
・图表：
14.4 全新的标签设计
14.4.1 Decalrations 标签
可以把非可视化组件放在Declarations标签内，如效果组件、数据组件（包括XML、XMLList、Array）、Model模型组件、数据验证组件等。同时也可以在自定义的组件中，通过Declarations标签来定义属性。
14.4.2 Library 和 Definition
Definition 标签可以定义一组FXG格式的图形。Definition标签通常被定义在library标签内。
14.4.3 private 标签
定义在private标签的元素，在编译的时候会被忽略。并且private标签必须放在文档的最后。
14.5 FLEX 常用组件
14.5.1 按钮组件button
<s:button id="" label="" click="" />
14.5.2 下拉框 组件 comboBox
<mx:comboBox id="" dataProvider="" /》
14.5.3 图像组件 image
<mx:image id="" source="" width="" height=""/>
14.5.4 标签组件 label
<s:label id="" text="" />
14.5.5 多行文本组件 textArea
<s:textArea id="" text=""/>
14.5.6 输入框组件 textInput
<s:textInput id="" text="/>
14.5.7 文本编辑组件 RichTextEditor
<mx:RichTextEditor id=" " text=""/>
CH15 界面设计实战
15.1 登录框实例
15.1.3 校验码
//生成随机码。生成四次随机数。若随机数是偶数则转换为一个数字，若随机数是奇数，则转换为一个字母
private function GenerateCheckCode():string
{
//初始化
var ran:number;
var number:number;
var code:string;
var checkCode:string ="";
//四位生成随机数
for(var i:int=0;i<4; i++)
{
ran=Math.random();
number=math.round(ran*10000)
if(number%2==0)
//0的ASCII码为48
code=string.fromCharCode(48+(number%10));
else
//A的ASCII码为65
code=string.fromCharCode(65+(number%26));
checkCode += code;
}
return checkCode;
}
15.1.5 合法用户进入主程序
FLEX中的状态（state）类似于FLASH中的场景概念。在新状态里用户可以全部或部分地移除之前的组件，也可以加入新的组件。
currentState="";
15.2 菜单导航
15.3 柱状图实例
15.4 文件目录浏览器 （AIR）
15.5 AIR程序集成网页实例
15.6 文本编辑器（AIR）
15.7 组件数据拖拽实例
CH16 增强用户界面设计
美化界面不仅包括组件静态外观，也包括组件的动态效果。本章讲解FLEX4.0中如何自定义效果美化界面。
CH17 CSS 美化界面
17.8 使用<fx:style>组件定义CSS
CH18 美化应用
CH17中介绍了使用CSS美化界面的用法，本章介绍更多的美化应用，如自定义字体、自定义光标等。