Transcript Flex介绍

Agenda
客户端技术
 什么是Flex
 Flex的历史
 开发语言,工具
 Flex原理
 Pros & Cons
 学习资源

•带宽加大
•客户端性能提高
•对用户体验的要求增加
客户端技术
•对部署能力的需求
SOA/RIA
B/S
C/S
•Pros:
•响应快
•Cons:
•部署困难
•升级困难
•安全问题(端口)
•Pros:
•容易部署
Rich Internet
Application
可以看做是基于web
的C/S架构
•Cons:
•浏览器混杂
•用户体验差
•服务器压力大
•客户端计算资源浪费
Pros:
•用户体验好
客户端技术
Internet 开发模式正在从B/S到C/S回归
浏览器和各种运行时都将发展为虚拟机
客户端技术
OpenLaszlo
JavaFX
Mozilla XUL
HTML5
Silverlight
Flash/Flex
AJAX
Rich Client
什么是Flex
-- Flash for Developer
Flex 基于Flash
 Flex是为程序员设计的Flash
 Flex的开发语言:ActionScript、MXML、
CSS。
 可以把Flex当作Flash

 Flash:专注平面动画、广告设计、多媒体处理
 Flex: 一种RIA解决方案,针对企业级网络应用。
Flex
Builder
Flex
SDK
MXML
Action
Script
Flex
什么是Flex
Flex 的历史





2004 Macromedia Flex1.0、Flex1.5。
(Flash 5 )
2005 Adobe Flex 2.0、Flex 2.0.1(Flash
MX 2004)
2007 Flex 3.0
2009.6.1 Flex 4 SDK beta
2010.3.22 Flex 4 正式版发布
开发语言- ActionScript





符合 ECMAScript 3
面向对象
强类型
支持包,名称空间
支持Socket




语法上类似JavaScript,Java,C#的杂合
不允许重载
单线程(除非存取网络)
数据服务:xml、JSON 、AMF
开发语言-MXML
Flex markup language
 基于XML的界面描述语言

开发工具
Flex 3 SDK Mozilla Public License
 Flex Builder –收费

 很多菜单被省掉了
 没有代码格式化(第三方插件)
 Search 功能有bug.
Flex的原理
MXML
Action Script
SWF
Mxml是flex的标记语言,用来描述界面,同Html非常相
似,而且mxml更加规范化和标准化。
Mxml最终会被编译器解析为Action Script,然后生成
flash的swf文件。
说白了,我们写的代码最终会编译成flash。
Mxml使用 Flex Sdk进行编译。
Flex VS. Ajax
Flex
开发效率
Ajax
Flex SDK, 可视化开发, Javascript 和XML编写,
效率高
没有成熟IDE
运行形式
编译执行,易于Debug
解释执行,脚本语言,不
容易Debug
执行效率
FLASH VM (Flash
Player)执行,独立于浏
览器,效率高
浏览器解释执行,效率低
移植性
安装Flash Player即可,
各种平台下表现一致
不同浏览器可能执行得不
同
安全性
编译后的二进制文件,隐
藏了程序实现细节
脚本代码,易被偷窃,篡
改
Pros



很好的用户体验
跨浏览器,跨平台
开发者角度
易学
免费/开源
丰富的组件库
对多媒体的广泛支持( 76%的视频文件在使用Flash
技术构建 如youtube)
 设计师(Flash)、开发人员(Flex)通过
ActionScript可以更有效的合作。





Adobe官方数据,99%的电脑都装有
FlashPlayer。
Cons
对搜索引擎不友好
 目前产生文件较大(相对于Flash)
 Flex Builder收费

与HTML交互麻烦-竞争关系
 不支持多线程

学习资源-libs
控件库:FlexLib
 测试库:FlexUnit 、ASUnit
 MVC框架:pureMVC、Cairngorm、
Mate
 3D引擎 - Papervision3D等
 物理 引擎- APE (Actionscript Physics
Engine)

例子-Flex窗口组件
例子-动画效果
例子-物理建模动画
例子-3D效果
问题
不支持泛型,如:
 public var solution:Array = new
Array(); //解

if (solution[3].storeID? == ri.storeID)
 无法判断这个属性
