Flex 学习小结（2）

1 两个模块(MODULE间的传输)
主程序:
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:ModuleLoader url="m1.swf" id="m1"/>
<mx:ModuleLoader url="m2.swf" id="m2"/>
</mx:Application>
模块1:
<mx:Script>
<![CDATA[
public function getData():String {
return "Module数据";
}
]]>
</mx:Script>
模块2:
<mx:Script>
<![CDATA[
[Bindable]
private var title:String;
private function changeData():void {
title = parentApplication.m1.child.getData();
}
]]>
</mx:Script>
<mx:HBox>
<mx:Label id="l1" text="Title: "/>
<mx:Label id="myTitle" text="{title}"/>
</mx:HBox>
<mx:Button id="b1" label="数据传输" click="changeData()"/>

2 flex+struts1+livecycle的整合小结
先来看看单单使用HTTPSERVICE的形式去跟JAVA连通的方法。

1）建立FLEX-PROJECT工程，
2） 要下载一个flex.war的东西（好象livecycle 最新的版本居然没这玩意，要重新下载）
3) 在建立FLEX-PROJECT时，选J2EE容器，然后不选"use remote object access service"
4)设定好TOMCAT容器后，注意把flex.war下的WEB-INF\FLEX目录整个COPY到当前工程的WEB-INF下，把web-inf\lib下的所有包也COPY到当前工程的web-inf下的LIB下去了。
5)要修改一下web.xml，为了能支持structs1以及能以http://xxxx.mxml的形式访问，否则TOMCAT会解析不到mxml的形式。

<web-app id="WebApp_ID" version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<display-name>
UserInfoSys</display-name>
<context-param>
<param-name>flex.class.path</param-name>
<param-value>/WEB-INF/flex/hotfixes,/WEB-INF/flex/jars</param-value>
</context-param>

<!-- Http Flex Session attribute and binding listener support -->
<listener>
<listener-class>flex.messaging.HttpFlexSession</listener-class>
</listener>

<!-- MessageBroker Servlet -->
<servlet>
<servlet-name>MessageBrokerServlet</servlet-name>

<servlet-class>flex.messaging.MessageBrokerServlet</servlet-class>
<init-param>
<param-name>services.configuration.file</param-name>
<param-value>/WEB-INF/flex/services-config.xml</param-value>
</init-param>
<init-param>
<param-name>flex.write.path</param-name>
<param-value>/WEB-INF/flex</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>

<servlet>
<servlet-name>FlexMxmlServlet</servlet-name>


<servlet-class>flex.bootstrap.BootstrapServlet</servlet-class>
<init-param>
<param-name>servlet.class</param-name>
<param-value>flex.webtier.server.j2ee.MxmlServlet</param-value>
</init-param>
<init-param>
<param-name>webtier.configuration.file</param-name>
<param-value>/WEB-INF/flex/flex-webtier-config.xml</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>

<servlet>
<servlet-name>FlexSwfServlet</servlet-name>

<servlet-class>flex.bootstrap.BootstrapServlet</servlet-class>
<init-param>
<param-name>servlet.class</param-name>
<param-value>flex.webtier.server.j2ee.SwfServlet</param-value>
</init-param>
<!-- SwfServlet must be initialized after MxmlServlet -->
<load-on-startup>2</load-on-startup>
</servlet>

<servlet>
<servlet-name>FlexForbiddenServlet</servlet-name>

<servlet-class>flex.bootstrap.BootstrapServlet</servlet-class>
<init-param>
<param-name>servlet.class</param-name>
<param-value>flex.webtier.server.j2ee.ForbiddenServlet</param-value>
</init-param>
</servlet>

<servlet>
<servlet-name>FlexInternalServlet</servlet-name>
<servlet-class>flex.bootstrap.BootstrapServlet</servlet-class>
<init-param>
<param-name>servlet.class</param-name>
<param-value>flex.webtier.server.j2ee.filemanager.FileManagerServlet</param-value>
</init-param>
<load-on-startup>10</load-on-startup>
</servlet>

<!-- Standard Action Servlet Configuration -->
<servlet>
<servlet-name>action</servlet-name>
<servlet-class>org.apache.struts.action.ActionServlet</servlet-class>
<init-param>
<param-name>config</param-name>
<param-value>/WEB-INF/struts-config.xml</param-value>
</init-param>
<load-on-startup>2</load-on-startup>
</servlet>

<servlet-mapping>
<servlet-name>MessageBrokerServlet</servlet-name>
<url-pattern>/messagebroker/*</url-pattern>
</servlet-mapping>

<servlet-mapping>
<servlet-name>FlexMxmlServlet</servlet-name>
<url-pattern>*.mxml</url-pattern>
</servlet-mapping>

<servlet-mapping>
<servlet-name>FlexSwfServlet</servlet-name>
<url-pattern>*.swf</url-pattern>
</servlet-mapping>

<servlet-mapping>
<servlet-name>FlexForbiddenServlet</servlet-name>
<url-pattern>*.as</url-pattern>
</servlet-mapping>

<servlet-mapping>
<servlet-name>FlexForbiddenServlet</servlet-name>
<url-pattern>*.swc</url-pattern>
</servlet-mapping>

<servlet-mapping>
<servlet-name>FlexInternalServlet</servlet-name>
<url-pattern>/flex-internal/*</url-pattern>
</servlet-mapping>

<!-- Standard Action Servlet Mapping -->
<servlet-mapping>
<servlet-name>action</servlet-name>
<url-pattern>*.do</url-pattern>
</servlet-mapping>
6 之后就可以在src目录下象原来做STRUTS1那样去做struts1
7 在flex界面中，使用httpservice组件
<mx:HTTPService id="listSrv" url="/UserInfoSys/ListAllUsers.do" />
<mx:Panel title="当前系统用户" width="100%" height="100%">
<mx:TileList id="list" dataProvider="{listSrv.lastResult.user}"
itemRenderer="Bref" width="100%" height="100%" />
</mx:Panel>

<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;

private function resultHandler(event:ResultEvent):void
{
Alert.show("更新成功!");
}

private function faultHandler(event:FaultEvent):void
{
Alert.show(event.fault.message, "无法完成更新!");
}

]]>
</mx:Script>

<mx:HTTPService id="updateSrv" method="GET" url="/UserInfoSys/UpdateUser.do" result="resultHandler(event)"
fault="faultHandler(event)">
<mx:request>
<user_id>{list.selectedItem.user_id}</user_id>
<name>{userName.text}</name>
<title>{titl.text}</title>
<image>{list.selectedItem.image}</image>
<imagebref>{list.selectedItem.imagebref}</imagebref>
<description>{description.text}</description>
</mx:request>
</mx:HTTPService>
注意，{listSrv.lastResult.user}其实就是struts1返回给界面的列表集合了，注意lastResult的运用;

<mx:HTTPService id="updateSrv">部分，指出了当更新数据信息时，需要把当前的信息发送到struts1的sevice层去处理

 

8 在flex中使用livecycle的功能
1） 在flex-project时记得选用use remote object access service
2) 修改web-inf\flex目录下的remoting-config.xml，修改如下：
<destination id="user">
<properties>
<source>flex.userinfosys.db.user.UserService</source>
</properties>
</destination>
这表明要通过flex远程调用struts1中的service层

3） 使用remoteobject组件
<mx:RemoteObject id="srv" destination="user"/>
<mx:Panel title="所有系统用户" width="70%" height="100%">
<mx:DataGrid width="100%" id="list" dataProvider="{srv.getUsers.lastResult}" height="100%">
<mx:columns>
<mx:DataGridColumn headerText="姓名" dataField="name"/>
<mx:DataGridColumn headerText="职位" dataField="title"/>
<mx:DataGridColumn headerText="简介" dataField="description"/>
</mx:columns>
</mx:DataGrid>
4) 假如我们的应用是分左右两部分，左边部分显示数据列表，右边部分要实现的效果是点每条左边的数据，右边显示出其
详细信息的话，可以这样做：
A首先建立一个User.as，
[Managed]
[RemoteClass(alias="flex.userinfosys.db.user.UserProfile")]

public class User
{
public function User()
{
}
public var userId:int;
public var name:String;
public var title:String;
public var image:String;
public var imagebref:String;
public var description:String;

}
remoteclass建立了一个user类（actionscript)到JAVA的POJO类之间的一个映射，会将actionscript类转化为JAVA的POJO类了

要特别注意的是，JAVA的POJO类中，必须要默认的空的构造函数，否则会出错的。
B 然后建立一个MX控件
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="367" height="522" title="详细信息" xmlns:local="*">

<local:User id="user"
userId="{user.userId}"
name="{userName.text}"
title="{titl.text}"
image="{image.text}"
imagebref="{imagebref.text}"
description="{description.text}"/>

<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;

private function resultHandler(event:ResultEvent):void
{
Alert.show("更新成功!");
}

private function faultHandler(event:FaultEvent):void
{
Alert.show(event.fault.message, "无法完成更新!");
}

]]>
</mx:Script>
<mx:RemoteObject id="srv" destination="user" result="resultHandler(event)" fault="faultHandler(event)"/>
<mx:Image top="10" left="28" horizontalAlign="center" source="images/{user.image}" width="140" height="210" />
<mx:Form width="100%" top="220" left="10" height="185">
<mx:FormItem label="姓名">
<mx:TextInput text="{user.name}" id="userName"/>
</mx:FormItem>
<mx:FormItem label="职位">
<mx:TextInput text="{user.title}" id="titl"/>
</mx:FormItem>
。。。。。。。
<mx:Button label="更新" click="srv.update(user);"/>

5 注意的一点是，在建立FLEX PROJECT时，最好设置的CONTENT FOLDER为WebRoot，这样可以通过MYECLIPSE的ADD WEB project
capbilities，将工程转化为J2EE PROJECT，可以部署到TOMCAT去（注意不要选重新生成WEB。XML，否则会覆盖掉原来FLEX的web.xml)