样例4:Flex编程模型
运行样例
访问http://localhost:8080/testdrive/sample4/MasterDetail.mxml
点击列表中的一个电话:被选择电话的细节出现在右边的panel控件中。
在代码编辑器中打开下面的文件:
sample4\MasterDetail.mxml
sample4\Thumb.mxml
sample4\ProductView.mxml
和其他的面向对象语言一样,一个Flex应用也是由很多类的集合组成。使用Flex,你能使用MXML或ActionScript产生类。典型地,你可以在MXML生成视图类,在ActionScript中产生模块类与控制器类。
当你生成一个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类保存在数据库中。
在代码编辑器中打开下面的文件:
sample5\SampleUpdate.mxml
sample5\ProductForm.mxml
sample5\Product.as
WEB-INF\src\flex\testdrive\store\ProductService.java
WEB-INF\flex\remoting-config.xml
在Product.as文件中,我们使用[RemoteClass(alias="flex.testdrive.store.Product")]
注解将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"按钮:发布的值出现在文本域中。
在代码编辑器中打开下列文件:
sample6\FeedClient.mxml
WEB-INF\src\flex\testdrive\feed\Feed.Java
WEB-INF\flex\messaging-config.xml
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":消息出现在两个聊天客户窗口中
在代码编辑器中打开下列文件:
sample7\Chat.mxml
WEB-INF\flex\messaging-config.xml
这个样例建立在前面样例中介绍过的概念和API上。为了在一个客户端发送一条消息,你可以使用Producer 类的send()方法。
在Flex中可以获得消息与实时构造使协作与数据发布应用以可升级的和可靠的方式建造,同时保留了轻量级的Web部署模式。
附加资源:
验证Google Map collaboration sample