.NET程序员也用JAVA:使用BlazeDS,SpringFramework,MySql,Flex构建RIA应用 part 3 :Flex及As 3代码编写

Flex这边要有一个实体类和Java的实体类对应，用来存放Java传回的数据和把数据传给Java处理．在这里我们创建了一个Java的User的实体类，所以在Flex这边也要有这样一个User实体类．．这个类的代码如下：

package cn.otis.flex.model
{
    [Bindable]
    [RemoteClass(alias="cn.otis.spring.model.User")]    
    public class User
    {
        public var id:int;
        public var userName:String;
        public var password:String;
        //public var note:String;
        public var note:String;
    }
}

[RemoteClass(alias="cn.otis.spring.model.User")]  这句的意思是说这个类对应Java的cn.otis.spring.model.User类．

[Bindable] 这句的意思是说这个as 3类是可以绑定的．．

只是用这个类来传送数据，所以public 也可以了．． 不用都写成geter ,seter.

有了这个类之后，就可以写Mxml了．．

我们要实现的UI如下图：

一开始让他获取所有用户． 然后左边是添加用户．

我贴出所有的mxml代码：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" horizontalAlign="center"
     width="100%" height="100%" initialize="init()">
   

 <mx:Script>
        <![CDATA[
            import mx.controls.*;
            import mx.rpc.events.*;
            import cn.otis.flex.model.*;
            import mx.collections.ArrayCollection;

            [Bindable]
            private var users:ArrayCollection;
            [Bindable]
            private var u:User = new User();
            private function init():void{
                this.getUsers();
            }    
            private function addUser():void{
                u.userName = tb_userName.text;
                u.password = tb_password.text;
                u.note = tb_note.text;
                ro_userService.addUser(u);
                ro_userService.removeEventListener(ResultEvent.RESULT,resultHandler);
                ro_userService.removeEventListener(FaultEvent.FAULT,faultHandler);
                ro_userService.addEventListener(ResultEvent.RESULT,addUserEventOK);
                ro_userService.addEventListener(FaultEvent.FAULT,addUserEventFail);
            }
            private function addUserEventOK(event:ResultEvent):void{
                this.getUsers();
            }
            private function addUserEventFail(event:FaultEvent):void{
                Alert.show("调用失败!" + event.message);
            }
            
            private function getUsers():void{
                
                
                ro_userService.getUsers();
                ro_userService.removeEventListener(ResultEvent.RESULT,addUserEventOK);
                ro_userService.removeEventListener(FaultEvent.FAULT,addUserEventFail);
                ro_userService.addEventListener(ResultEvent.RESULT,resultHandler);
                ro_userService.addEventListener(FaultEvent.FAULT,faultHandler);
            }
            private function resultHandler(event:ResultEvent):void
            {
                users = event.result as ArrayCollection;
            }
            
            private function faultHandler(event:FaultEvent):void
            {
                Alert.show(event.fault.faultString);
            }
            
        ]]>
    </mx:Script>

    <mx:RemoteObject id="ro_userService" showBusyCursor="true" destination="ser_UsersService"/>

    
    <mx:Panel width="1000" height="430" layout="absolute" id="addUserPanel" title="增加用户" cornerRadius="8">
        <mx:Text text="新增加用户" fontWeight="bold" x="191" y="60"/>
        <mx:Label text="用户名:" x="179" y="86"/>
        <mx:Label text="简介:" x="179" y="143"/>
        <mx:Label text="密码:" x="179" y="113"/>
        <mx:TextInput x="224" y="84" id="tb_userName"/>
        <mx:TextInput x="224" y="111" id="tb_password" displayAsPassword="true"/>
        <mx:TextArea height="111" id="tb_note" x="224" y="142"/>
        <mx:Button x="267" y="261" label="增加" click="addUser()" id="btn_add"/>
        <mx:DataGrid id="dg" dataProvider="{users}" width="388" height="243" x="425" y="40"/>
        <mx:Button label="Get Data" click="getUsers()" x="580" y="291"/>
        
    </mx:Panel>
    
</mx:Application>

<mx:RemoteObject id="ro_userService" showBusyCursor="true" destination="ser_UsersService"/>  新建一个remoteObject对象， 设定他的ID．然后要注意思的是destination这个属性，这个是跟另外一个文件相关联的．． 这个文件就是 remoting-config.xml . 这个文件在WebRoot>WEB-INF>flex下.这个文件要加入以下一些配置， 这里我是贴上了该文件的完整内容．

<?xml version="1.0" encoding="UTF-8"?>
<service id="remoting-service"
    class="flex.messaging.services.RemotingService">

    <adapters>
        <adapter-definition id="java-object"
            class="flex.messaging.services.remoting.adapters.JavaAdapter"
            default="true" />
    </adapters>

    <default-channels>
        <channel ref="my-amf" />
    </default-channels>
    <destination id="ser_UsersService">
        <properties>
            <source>cn.otis.spring.service.UsersService</source>
        </properties>
    </destination>
</service>

destination  这里是跟flex的RemotingObject的destination 属性对应的．

所以要： <mx:RemoteObject id="ro_userService" showBusyCursor="true" destination="ser_UsersService"/> 这样设置， 然后，ro_userService就可以调用cn.otis.spring.service.UsersService类的任何public方法了．

 private function getUsers():void{
                
                
                ro_userService.getUsers(); //调用cn.otis.spring.service.UsersService类的getUsers方法
                ro_userService.removeEventListener(ResultEvent.RESULT,addUserEventOK);
                ro_userService.removeEventListener(FaultEvent.FAULT,addUserEventFail);
                ro_userService.addEventListener(ResultEvent.RESULT,resultHandler);
                ro_userService.addEventListener(FaultEvent.FAULT,faultHandler);
            }
            private function resultHandler(event:ResultEvent):void
            {
                users = event.result as ArrayCollection;
            }
            
            private function faultHandler(event:FaultEvent):void
            {
                Alert.show(event.fault.faultString);
            }

这里．

ro_userService.removeEventListener(ResultEvent.RESULT,addUserEventOK); ro_userService.removeEventListener(FaultEvent.FAULT,addUserEventFail); ro_userService.addEventListener(ResultEvent.RESULT,resultHandler); ro_userService.addEventListener(FaultEvent.FAULT,faultHandler);

其实不应该这样写的．只要创建两个RemotingObject对象就可．．

一开始以为建一个RemotingObject就好了．所以就写成这样了．．

这个小例子算是完成了．．之后会做另外的例子．． 使用MS sql server ２００５的Northwind数据库来做例子．． 因为我坚信，学习技术的最好方式和最有挑战性的方式是在做项目中学习． 呵．

下面测试一下．．

添加用户．

^_^.