Adobe高级技术官员Christophe Coenraets发表了一篇题为"30-Minute Flex Test-Drive for Java Developers."的文章，目的是为Java开发者在很短的时间内学习Flex的关键特性，以及它的潜在的编程模型提供机会。
通过配置运行在Tomcat上或另一个应用服务器上的内含的WAR文件，向开发人员展示了10个应用事例。这些例子主要集中于将Flex与Java整合，其中包括远程方法与web services的，server push，实时协作，发布/订阅消息与JMS联合以及持续性。它们也演示了图表与多媒体组件等特点。
从企业应用到简单的CRUD应用，Flex正被采用。对于你们当中已经采用Flex构建了企业应用，选择它的原因是什么呢？对于它，你又喜欢它什么了呢？
Flex正被一些Java shops,ISVs和OEMs采用来在防火墙内部与外部构建应用。然而，我也意识到仍有许多的Java开发者并不熟悉Flex，并且有时对它有错误概念。Flex与Java back-end结合的特别好，从试用过Flex的开发者反馈回的信息看对它的评价一直都是非常棒的。
一个问题就是，每天我们都有许多新产品要去试用，但是我们仅有这么多的时间…，因此，我写了“this 30 minutes test-drive”，用最少的时间，给出开发者对于Flex的理解—Flex如何工作，它能做些什么：你要做的就是配置运行在你选择的Tomcat上或另一个应用服务器上的内含的WAR文件，这些例子主要集中于将Flex与Java back-end整合，针对的读者是对Flex事先没有了解的Java开发者把你们的问题/评论和任何能提高这个测试的建议发给我们，不要迟疑，多谢！！！
这个测试的目的是用较少的时间，给出开发者对于Flex的理解—Flex如何工作，它能做些什么。测试由尽可能简明的例子组成，清晰地展示了有趣的特征。这些例子主要集中于将Flex与Java back-end整合。针对的读者是对Flex事先没有了解的Java开发者
开始之前你要知道的几件事...
Flex编程模块由以下部分组成
MXML，一个XML语言，用来公开地展示你的应用的用户接。ActionScript,一个符合ECMAScript的面向对象的编程模块。除了语法上的一些不同，ActionScript与Java看上去以及感受上很相似，也支持面向对象结构：包，类。继承，接口，强制类型（也是动态性）等等。
一个扩展的类库。在http://livedocs.macromedia.com/flex/2/langref/index.html上可以获得与Javadoc格式类似的在线的API文档，Flex源代码（.mxml和.as文件）被编译成Flash字节码(.swf)，在客户端可以被Flash 虚拟机执行。
你可以通过不同的方式使用Flex编译器：从命令行做为ant脚本的一部分，使用FlexBuilder，编译过程被整合于IDE中使用web编译器（可以通过Flex Data Services获得）。这与JSP编译模型有些类似，第一次一个应用被要求编译成字节码，然后缓存到服务并发请求中。
在产品运行的环境中你根本不用web编译器，然而在这个测试中为了在你机器上安装最少量的组件，我们一直使用了web编译器（你需要安装的是一个war文件）。
Flex产品包括：
Flex SDK，它是免费的，包含Flex库，编译器(mxmlc),调试器，文档。
Flex Data Services (FDS),一个部署于你的J2EE应用服务器上的一套可选择的服务器端组件。FDS包括一个Java RPC 服务（Java RPC service--见例3），发布/订阅消息(publish/subscribe messaging--见例6与7)，数据管理服务（data management services --见例8）。FDS对于采用单CPU情况是免费的(FDS Express)，如果部署在多CPU系统上，需要按每CPU方式得到许可。
FlexBuilder,一个用于Flex开发的可选择的IDE。做为一个为Eclipse构建的插件，FlexBuilder包括一个设计视图和一个代码视 图，代码提示，可视调试等，FlexBuilder
按每开发者方式为基础获得许可。
可选择charting component（图表组件）按每开发者方式为基础获得许可。
你可以完全免费地使用SDK并选择IDE来开发和部署Flex应用。对于需要Flex Data Services的例子我会显著地标示出来。
安装测试驱动文件
因为我们将使用Flex Data Services，你需要一个J2EE服务器或最小程度上，要有一个Servlet容器。
下载测试驱动的war文件。
如果你要使用执行全部J2EE stack的应用服务器(IBM Websphere, BEA Weblogic, JBoss, JRun,等等)，从http://coenraets.org/download/testdrive/flex4j/j2ee/testdrive.war下载要用到的版本。它包括Flex Data Services的应用事例，内嵌的支持事例的HSQLDB数据库。
如果你使用Tomcat 5.5.x，从http://coenraets.org/download/testdrive/flex4j/tomcat/testdrive.war下载要用到的版本。它包括内嵌的支持事例的HSQLDB数据库，JOTM（在例8中用到的一个数据管理服务--data management services所需要的Java事务API --Java Transaction API的开源实现）。
如果你使用Tomcat 5.0.x，从http://coenraets.org/download/testdrive/flex4j/tomcat50
/testdrive.war下载要用到的版本。它包括Flex Data Services，应用事例，内嵌的支持事例的HSQLDB数据库，JOTM（在例8中用到的一个数据管理服务--data management services所需要的Java事务API --Java Transaction API的开源实现）。
注意：5.5.x和5.0.x版本唯一不同就是在META-INF/context.xml文件中的JOTM的配置（在Tomcat 5.5中你配置UserTransaction的方式已经改变了）。
Deploy testdrive.war in your application server
在你的应用服务器中部署testdrive.war文件 ，访问http://localhost:8080/testdrive（适当地改变主机名和端口号）。
样例1：使用HTTPService访问数据
运行样例：
访问http://localhost:8080/testdrive/sample1/SampleXML.mxml
在这个测试中，你会注意到在你第一次访问一个应用时会有一个延迟。这是因为第一次访问应用时我们使用的web编译器要将你的应用编译成字节码（和JSP编译模型相类似）。在此之后的请求会更快，因为这个应用已经被编译过了。在一个产品环境中，你应当部署你的预编译应用。
注意：根据你的配置不同，你可能需要增加你的应用服务器的JVM的堆容量，以便使用web编辑器。在产品环境中不会需要这样做，因为你不使用web编辑器。如果你在尝试第一次访问一个样例时，获得一个java.lang.OutOfMemoryError例外，那么你必须增加堆容量。
点击"Get Data"：DataGrid控件被填充catalog.jsp文件返回的XML数据,也要注意到一些内置的DataGrid控件的特点：列可以排序（点击列标题头）,列可以移动（点击列标题头，按下鼠标按钮，将列移到一个新的位置）在代码编辑器中打开下面的文件：
testdrive/sample1/SampleXML.mxml
testdrive/sample1/catalog.jsp
使用HTTPService，你能够发送HTTP请求到服务器，然后处理响应。虽然HTTPService能用来处理不同的响应类型，但是处理XML是更为特色的。你可以利用任何种类的服务器端技术来使用HTTPService：JSP, Servlet, ASP, Ruby on Rails, PHP等等。你可以在HTTPService的url属性里指定目标服务。
Flex提供了精致的数据绑定性能。你可以将一个属性值绑定到另一个属性值上，或到一个通用表达式上。在这个例子中，DataGrid控件的dataProvider属性被绑定到了HTTPService的lastResult属性上。
HTTPService调用是异步的。在客户端应用获得数据时，导致HTTPService上的结果事件被触发。如果在服务器端一个错误发生，或网络出现错误，那么错误事件被触发。（参见例5，一个代码结果与错误事件处理器的例子）默认地，从服务器获得的XML文档被无序地放入一个目标图表中。这允许你使用点符号操纵数据。你也可以通过在HTTPService上指定resultFormat="e4x"做为一个XML文档获取结果。在那样的情况下，你可以使用E4X (ECMAScript for XML)解析文档。
更多信息HTTP和HTTPS都得到支持:
取代使用url属性指定一个hardcoded URL，你能够在目的属性中指定一个逻辑名称。然后你可以将这个逻辑名称映射到WEB-INF/flex/proxy-config.xml文件中的一个确切的URL上。在这个例子中，你可以用destination="catalog"替换url="catalog.jsp"（打开WEB-INF/flex/proxy-config.xml查看catalog destination是如何配置的）。另一个例子，你可以指定destination="news" 然后改变DataGrid的数据绑定到dataProvider="{srv.
lastResult.rss.channel.item}"，就可以从纽约时报上获得标题。
样例2：
运行样例
访问http://localhost:8080/testdrive/sample2/SampleWebService.mxml
点击"Get Data": DataGrid控件被填充在我的博客上的ProductWS web服务返回的数据。
在代码编辑器中打开下列文件：
testdrive/sample2/SampleWebService.mxml
访问http://coenraets.org/services/ProductWS?wsdl例子中的web服务
使用WebService标签，你能激活部署于你的应用服务器或互联网上的基于SOAP的web服务,web服务返回的对象被自动地并不连续地放入ActionScript对象中。同样作为参数传递给一个web服务操作的ActionScript对象按照wsdl文件描述成为连续的。
注意在这个例子中我们也加入了DataGrid控件的列定义（使用DataGridColumn）
更多信息：
Flex支持RPC-encoded和document-literal和HTTPService一样, WebService调用是异步的：你可以用代码编写结果和查错事件处理器,和使用HTTPService一样，你可以使用一个逻辑名而不是一个硬编码的URL来确定服务，名将其映射到WEB-INF/flex/proxy-config.xml中。
样例3：
运行样例
访问http://localhost:8080/testdrive/sample3/SamplePOJO.mxml
点击"Get Data": DataGrid控件被填充ProductService Java 类的getProducts()方法返回的数据，在代码编辑器中打开下列文件：
sample3/SamplePOJO.mxml
使用RemoteObject，你能够直接激活部署于你的应用服务器中的Java对象的方法，然后处理返回值。返回值可以是一个原始数据类型，一个对象，一个对象集，一个对象图表等等，RemoteObject的目标属性值是一个逻辑名称，被映射到remoting-config.xml文件中的一个具有全部资格的Java类中。
服务器端的方法返回的Java对象被不连续地放入动态的或指定类型的ActionScript对象中。在这个例子中，我们并没有一个很具体的Product Java类的。Product objects因此被不连续地放入动态对象中。在事例5中，我们会在ActionScript中用到一个具体的Product类。
更多信息：
和HTTPService与WebService一样, RemoteObject调用是异步的。你使用RemoteObject的结果与差错事件来处理结果与错误。
运行样例
访问 http://localhost:8080/testdrive/sample4/MasterDetail.mxml
点击列表中的一个电话：被选择电话的细节出现在右边的panel控件中。
在代码编辑器中打开下面的文件：
当你生成一个mxml文件时，实际上是生成一个类。Mxml文件的根结点预示了你要扩展的类。
例如，产生一个根结点为<Application>的MasterDetail.mxml文件就等同于使用public class MasterDetail extends Application { }产生一个ActionScript类。
同样的，产生一个根结点为<Panel>的ProductView.mxml文件就相当于用public class ProductView extends Panel { }产生一个类。
一旦你已经定义了一个类，你可以无需一个附加的描述文件而公开地使用（做为MXML文件中的一个标签）。公共属性做为标签属性可以自动获得。例如，在MasterDetail.mxml文件中，我们定义<ProductView>标签，绑定它的产品属性到选择的产品列表上。也要注意对CSS样式表的支持
样例5：更新数据
运行样例
访问 http://localhost:8080/testdrive/sample5/SampleUpdate.mxml
选择一个电话 修改右面panel控件上的一些数据。例如，价格。
点击更新：修改被送到终端，被ProductService类保存在数据库中。
在代码编辑器中打开下面的文件：
注解将Product类(Product.as)中的ActionScript版本映射到Java版本 (Product.java)中。因此，由ProductService 的getProducts()方法返回的Product对象被deserialize到ActionScript Product类的实例中。同样地，作为一个参数被传递给RemoteObject的update方法的ActionScript Product实例被deserialize到服务器端Java版本的Product类的一个实例中。
样例6：发布/订阅消息（数据压入用例）
运行样例
在这个例子中，一个Java组件发布一个模拟的实时值给消息队列。Flex客户端到那个队列中订阅，然后实时显示数值。为了在 服务器端启动组件：访问http://localhost:8080/testdrive/sample6/startfeed.jsp。（你可以访问 http://localhost:8080/testdrive/sample6/stopfeed.jsp来停止组件）。打开一个浏览器，访问 http://localhost:8080/testdrive/sample6/FeedClient.mxml。点击"Subscribe to 'feed' destination"按钮：发布的值出现在文本域中。
在代码编辑器中打开下列文件：
Flex通过消息服务（Flex数据服务的一部分）支持发布/订阅消息。Flex通过消息服务管理一组Flex客户端能够在其上发布/订阅的目标文件。Flex提供两个组件，Producer and Consumer，你可以分别地使用它们发布/订阅到目标文件。为了从一个目标文件订阅，你可以使用Consumer类的subscribe()方法。当一个消息发布到你订阅的目标文件时，Consumer上的消息事件被触发。
在Feed.java文件中，Flex Java API (MessageBroker, AsyncMessage)被用来发布消息到
Flex目标文件。有关Java API 的Javadoc文档可以从http://livedocs.macromedia.com/flex/2/fds2javadoc/index.html获得。另一个用于在Flex和Java应用之间交换消息的选项是将Flex目标文件映射到JMS主题中。除了JMS，Flex消息服务适配器体系允许你与任何种类的消息系统整合。
Flex目标文件在messaging-config.xml文件中配置。你可以配置一个目标文件，使用实时协议或使用polling传输消息。
附加资源：
验证更复杂的发布数据的样例portfolio viewer sample
样例7：发布/订阅消息（协作用例）
运行样例
在不同的浏览器窗口中打开http://localhost:8080/testdrive/sample7/Chat.mxml
在其中的一个聊天客户窗口中输入消息，点击"Send"：消息出现在两个聊天客户窗口中
在代码编辑器中打开下列文件：
这个样例建立在前面样例中介绍过的概念和API上。为了在一个客户端发送一条消息，你可以使用Producer 类的send()方法。
在Flex中可以获得消息与实时构造使协作与数据发布应用以可升级的和可靠的方式建造，同时保留了轻量级的Web部署模式。
附加资源：
验证Google Map collaboration sample
样例8：数据管理服务（Data Management Services）
测试一致性
打开浏览器，访问http://localhost:8080/testdrive/sample8/SampleDataService.mxml
点击一个DataGrid控件的单元格，改变单元格中的数据，回车
点击浏览器中的刷新按钮：注意新的值出现在单元格中，表示数据已成功保留。
测试数据在客户端的同步性：
在另一个浏览器窗口中打开相同的应用
调整两个浏览器窗口的大小，以便于在屏幕上你能同时看到这两个窗口
改变一个浏览器中的数据，回车：注意对其它客户端更新是自动完成的
在代码编辑器中打开下列文件：
除了在事例1，2，3中描述的RPC服务外，Flex数据管理服务提供了一个创新的高效的途径通过交叉层级与客户端来同步数据。Flex数据管理服务由客户端API与服务器端服务组成。
在客户端，"managed objects"保持对数据改变的跟踪，通知这些改变的终端。在SampleDataService.mxml中你所必须做的是： 定义一个指向在data-management-config.xml中定义的“product”的DataService。
激活DataService的fill()方法，给"products"数组赋值。将DataGrid与"products"数组绑定。
你不必跟踪对数据的改变，也不必激活远程服务通知终端在客户端的改变（产生，更新，删除）。
在服务器端，数据服务收到改变列表，将它传递给你的服务器端的永久组件。数据服务也把改变传给其它的客户端。在这个例子中，利用java-dao适配器将"product" DataService配置在data-management-config.xml文件中，表示我们将用我们自己的Java类照看永久代码（另一个选择是使用Hibernate适配器）。
样例9：数据可视化
运行样例
访问http://localhost:8080/testdrive/sample9/Dashboard.mxml
在线形图表上点击任何数据点，屏幕底端的柱形图表被更新来显示一个所选月份的产品分类
在代码编辑器中打开下列文件：
sample9/Dashboard.mxml
Flex提供了一个扩展的图表组件库，例如本例子中用到的LineChart和PieChart。其它的图表组件包括ColumnChart, BarChart, AreaChart, BubbleChart, CandlestickChart, PlotChart, HLOCChart. Flex图表组件与其它数据组件的功能相似：你使用dataProvider属性将一个图表与数据绑定。
因为它们做成了矢量图，图表组件能在客户端被重画以及形成动画，帮助终端用户更好地理解数据走向与转换。
附加资源：
adobe.com上的Dashboard sample
Ely Greenfield的Chart Sampler
另一个Ely的图表组件样例Interactive bubble chart
样例10：丰富的媒体
运行样例
访问http://localhost:8080/testdrive/sample10/SampleMedia.mxml
点击列表中的一个问题：一个视频出现了，对这个传统的"FAQ"应用增添了一个多媒体过程
在代码编辑器中打开下列文件：
sample10/SampleMedia.mxml
sample10/questions.mxml
HTTPService用于获取一个包含问题列表，视频连接和cuepoint的XML文档
VideoDisplay组件的source属性被绑定到了List控件的selectedItem上，所以当一个问题被点击时，"answer video"自动开始播放。
cuepoint事件用于VideoDisplay，与caption进行同步（caption并不是video的一部分，是从XML文档读取出来的）。同时关注 在Panel控件上的尺寸效果，当它大小改变时，会自动处理。
最后，应用有2种查看状态：默认状态与"videoPlaying"状态。"videoPlaying"状态允许你使用MXML公开地描述不同的应用状态。在这个简单的例子中，Panel控件被扩展到videoPlaying状态，来显示VideoDisplay组件。
附录 A：数据访问表现性能
为测试数据访问表现性能
访问http://localhost:8080/testdrive/appendixa/Perf.mxml
设定几行用于retrieve
点击"Get Data"
观察retrieve和render数据时所花费的毫秒数
测试客户端排序：
设定20000行
点击一个列头在客户端将20000行排序
在代码编辑器里打开下面的文件：
WEB-INF/src/flex/testdrive/census/CensusService.java WEB-INF/flex/remoting-config.xml 在客户端，我们使用RemoteObject远程激活部署在应用服务器上的CensusService 类的getItems方法。CensusService类访问内嵌的HSQLDB数据库，返回需要的行数。使用RemoteObject，数据通过HTTP以二进制格式传输。
附录 B:产生客户的UI组件
运行样例：
访问http://localhost:8080/testdrive/appendixb/Store.mxml
使用slider控件修改价格范围：过滤出的项动态地进入或移出列表，可以帮助使用者对过滤器对产品产生的影响有个形象化的认识。
在代码编辑器里打开下面的文件：
sample12/Store.mxml
sample12/AnimatedTileList.as
虽然一些Flex完全是用Flex框架下的UI组件来构建的，但是你能通过扩展Flex框架的
类来生成客户UI组件。AnimatedTileList.as文件提供了一个类的例子，通过扩展Canvas，提供一个TileList组件的动画版本。
概括与进一步
这个测试已经提供给你了对Flex的最初的经历，主要体现在与Java的整合。然而，我们只是做了一些表面文章，针对于这个产品的不同方面还有许多其它的在线资源。http://flex.org/会让你对这些资源变得熟悉起来。开发者的经验对于Flex是重要的一个方面。因此也要确保下载FlexBuilder来开始构建你自己的Flex项目
把你们的问题/评论和任何能提高这个测试的建议发给我们，不要迟疑，多谢！！！
扫一扫
3280
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
