Flex 与 Asp.Net 通过 Remoting 方式进行通讯 (四)

版权由http://xingfustar.cnblogs.com/所有，转载请注明出处，XingFuStar 2007年12月14日

六、自定义实体对象的传递（http://xingfustar.cnblogs.com/)

    本节是Remoting通讯的最后一节，主要讲述自定义实体对象的传递，并简单了解下Flex中类的声明及DataGrid的使用方法。我们仍分两个部分来讲。

1、.NET服务器端程序（http://xingfustar.cnblogs.com/)

    首先，我们编写一个用户实体类，包括姓名、性别及年龄，类代码如下

/* ----------------------------------------------------------------
 * 版权： http://XingFuStar.cnblogs.com
 * 
 * 文件名： User.cs
 * 文件功能描述： User实体类
 * 
 * 作者：XingFuStar
 * 日期：2007年12月11日
 * 
 * 当前版本：V1.0.0
 * 
 * 修改日期：
 * 修改内容：
 *--------------------------------------------------------------- */

using  System;

namespace  RemotingSample
{
     public   class  User
    {
         private   string  name;

         public   string  Name
        {
             get  {  return  name; }
             set  { name  =  value; }
        }

         private   int  age;

         public   int  Age
        {
             get  {  return  age; }
             set  { age  =  value; }
        }

         private   string  sex;

         public   string  Sex
        {
             get  {  return  sex; }
             set  { sex  =  value; }
        }

         public  User()
        {

        }
    }
}

    在我们前两节编写的RemotingSample类中添加 GetUsers 方法，代码如下：

         public  List < User >  GetUsers()
        {
            List < User >  users  =   new  List < User > ();

            User user  =   new  User();
            user.Name  =   " 张三 " ;
            user.Age  =   23 ;
            user.Sex  =   " 男 " ;
            users.Add(user);

            user  =   new  User();
            user.Name  =   " 李四 " ;
            user.Age  =   24 ;
            user.Sex  =   " 女 " ;
            users.Add(user);

            user  =   new  User();
            user.Name  =   " 王五 " ;
            user.Age  =   22 ;
            user.Sex  =   " 男 " ;
            users.Add(user);

             return  users;
        }

    接下来，我们开编写Flex端，重点在Flex这里

2、Flex客户端程序（http://xingfustar.cnblogs.com/)

    在Flex工程中，添加一个 ActionScript Class， 我们先在工程中添加一个 名为Module的文件夹 。接下来，右键点击这个文件夹，在其中添加一个 ActionScript Class， 类名为“User”（并不一定要与.NET中的类相同，这里想同是便于理解和管理）
    在新建的类中添加如下代码：

/* ----------------------------------------------------------------
 * 版权： http://XingFuStar.cnblogs.com
 * 
 * 文件名： User.as
 * 文件功能描述： 用户实体类
 * 
 * 作者：XingFuStar
 * 日期：2007年12月14日
 *--------------------------------------------------------------- */
 
package Module
{
     // 这名话是必须的，用这句话来绑定.Net中的类
    [RemoteClass(alias = " RemotingSample.User " )]
     public   class  User
    {
         public  function User()
        {
             // 请不要删除以下信息
             // 版权： http://XingFuStar.cnblogs.com
        }
        
         private  var name:String;
        
         public  function  get  Name():String
        {
             return  name;
        }
        
         public  function  set  Name(setValue:String): void
        {
            name  =  setValue;
        }
        
         private  var age: int ;
        
         public  function  get  Age(): int
        {
             return  age;
        }
        
         public  function  set  Age(setValue: int ): void
        {
            age  =  setValue;
        }
        
         private  var sex:String;
        
         public  function  get  Sex():String
        {
             return  sex;
        }
        
         public  function  set  Sex(setValue:String): void
        {
            sex  =  setValue;
        }
    }
}

    注意这个类的第一行，有这样一句话 [RemoteClass(alias="RemotingSample.User")] 这是连接.NET类的关键所在， 添加这句话后，这个类，才与.NET中创建的User类建立了联系。

    [RemoteClass(alias="命名空间.类名")] 

    在 Design 模式下添加，添加一个 DataGrid，id为dgUser，新添加的DataGrid自动生成了三个DataGridColumn，修改其headerText，和dataField。headerText为DataGrid每行的标题，dataField为绑定的实体对象的属性。
    DataGrid设计如下代码所示：

     < mx:DataGrid  x ="38"  y ="318"  height ="116"  width ="312"  id ="dgUser" >
         < mx:columns >
             < mx:DataGridColumn  headerText ="姓名"  dataField ="Name" />
             < mx:DataGridColumn  headerText ="性别"  dataField ="Sex" />
             < mx:DataGridColumn  headerText ="年龄"  dataField ="Age" />
         </ mx:columns >
     </ mx:DataGrid >

    继续添加一个Button控件，id为btnGetUsers，Label属性为 GetUsers

    在 Source 模式下, 修改　mx:RemoteObject 标签，添加　
    <mx:method name="GetUsers" result="RemoteResult(event)" fault="RemoteFault(event)"/> 
    修改脚本中 RemoteResult 方法，代码如下

             public  function RemoteResult(re:ResultEvent): void
            { 
                 switch (re.currentTarget.name)
                {
                     case   " HelloWord " :
                        var str:String  =  re.result  as  String;
                         this .txtHelloWord.text  =  str;
                         break ;
                     case   " SayHello " :
                        str  =  re.result  as  String;
                         this .txtSayHello.text  =  str;
                         break ;
                     case   " GetArray " :
                         for (var i: int = 0 ; i < re.result.length; i ++ )
                        {
                             this .txtUsers.text  +=  re.result[i].toString()  +   " ,  " ;
                        }
                         break ;
                     case   " GetDictionary " :
                     case   " GetHashTable " :
                         this .txtZhangSan.text  =  re.result[ " 张三 " ];
                         this .txtLiSi.text  =  re.result[ " 李四 " ];
                         this .txtWangWu.text  =  re.result[ " 王五 " ];
                         break ;
                     case   " GetUsers " :     // 新加部分
                        var userList:ArrayCollection  =   new  ArrayCollection();
                        
                         for (var j: int = 0 ; j < re.result.length; j ++ )
                        {
                            var user:User  =  re.result[j]  as  User;
                            userList.addItem(user);
                        }
                        
                         // 用来绑定DataGrid
                         this .dgUser.dataProvider  =  userList;
                         break ;
                }
            }

    在 mx:Button （GetUsers） 标签中添加属性 click="sampleRemoteObject.GetUsers()"

    运行Flex程序，在浏览器中查看效果　

附件：源码
1、.Net端

/* ----------------------------------------------------------------
 * 版权： http://XingFuStar.cnblogs.com
 * 
 * 文件名： RemotingSample
 * 文件功能描述： .NET与Flex通讯DEMO
 * 
 * 作者：XingFuStar
 * 日期：2007年12月11日
 * 
 * 当前版本：V1.0.0
 * 
 * 修改日期：2007年12月14日
 * 修改内容：增加获取数组，Dictionary，HashTable等方法例程
 *--------------------------------------------------------------- */

using  System;
using  com.TheSilentGroup.Fluorine;
using  System.Collections.Generic;
using  System.Collections;

namespace  RemotingSample
{
    [RemotingService( " Fluorine sample service " )]
     public   class  RemotingSample
    {
         public  RemotingSample()
        {
             // 请不要删除以下信息
             // 版权： http://XingFuStar.cnblogs.com
        }

         public   string  HelloWord()
        {
             return   " Hello Word! " ;
        }

         public   string  SayHello( string  name)
        {
             return   " Hello  "   +  name  +   " ! " ;
        }

         public   string [] GetArray()
        {
             string [] array  =   new   string []{ " 张三 " , " 李四 " , " 王五 " };

             return  array;
        }

         public  Dictionary < String, Int32 >  GetDictionary()
        {
            Dictionary < String, Int32 >  dictionary  =   new  Dictionary < string ,  int > ();
            dictionary.Add( " 张三 " ,  23 );
            dictionary.Add( " 李四 " ,  24 );
            dictionary.Add( " 王五 " ,  22 );
             return  dictionary;
        }

         public  Hashtable GetHashTable()
        {
            Hashtable hash  =   new  Hashtable();
            hash.Add( " 张三 " ,  23 );
            hash.Add( " 李四 " ,  24 );
            hash.Add( " 王五 " ,  22 );
             return  hash;
        }

         public  List < User >  GetUsers()
        {
            List < User >  users  =   new  List < User > ();

            User user  =   new  User();
            user.Name  =   " 张三 " ;
            user.Age  =   23 ;
            user.Sex  =   " 男 " ;
            users.Add(user);

            user  =   new  User();
            user.Name  =   " 李四 " ;
            user.Age  =   24 ;
            user.Sex  =   " 女 " ;
            users.Add(user);

            user  =   new  User();
            user.Name  =   " 王五 " ;
            user.Age  =   22 ;
            user.Sex  =   " 男 " ;
            users.Add(user);

             return  users;
        }
    }
}

2、Flex端

<? xml version="1.0" encoding="utf-8" ?>
<!--
* 版权：http://XingFuStar.cnblogs.com
*
* 作者：XingFuStar
* 日期：2007年12月11日
*
* 修改日期：2007年12月14日
* 修改内容：增加获取数组，Dictionary，HashTable等方法例程。
-->
< mx:Application  xmlns:mx ="http://www.adobe.com/2006/mxml"  layout ="absolute" >

     < mx:Script >
         <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.rpc.events.FaultEvent;
            import mx.rpc.events.ResultEvent;
            import mx.controls.Alert;
            
            import Module.User;
        
            public function RemoteResult(re:ResultEvent):void
            { 
                switch(re.currentTarget.name)
                {
                    case "HelloWord":
                        var str:String = re.result as String;
                        this.txtHelloWord.text = str;
                        break;
                    case "SayHello":
                        str = re.result as String;
                        this.txtSayHello.text = str;
                        break;
                    case "GetArray":
                        for(var i:int=0; i<re.result.length; i++)
                        {
                            this.txtUsers.text += re.result[i].toString() + ", ";
                        }
                        break;
                    case "GetDictionary":
                    case "GetHashTable":
                        this.txtZhangSan.text = re.result["张三"];
                        this.txtLiSi.text = re.result["李四"];
                        this.txtWangWu.text = re.result["王五"];
                        break;
                    case "GetUsers":    //新加部分
                        var userList:ArrayCollection = new ArrayCollection();
                        
                        for(var j:int=0; j<re.result.length; j++)
                        {
                            var user:User = re.result[j] as User;
                            userList.addItem(user);
                        }
                        
                        //用来绑定DataGrid
                        this.dgUser.dataProvider = userList;
                        break;
                }
            }
        
            public function RemoteFault(re:FaultEvent):void
            {
                Alert.show("Message:" + re.fault.faultString,"出错");
            }           
         ]]>
     </ mx:Script >

     <!-- 这里Source 对应.NET类，前面是命名空间，后面是类名 source = 命名空间.类名 -->
     < mx:RemoteObject 
         id ="sampleRemoteObject"
        destination ="fluorine"
        source ="RemotingSample.RemotingSample"
        showBusyCursor ="true" >
         <!-- 这里是.NET中的方法，name = 方法名  -->
         < mx:method  name ="HelloWord"  result ="RemoteResult(event)"  fault ="RemoteFault(event)" />     
         < mx:method  name ="SayHello"  result ="RemoteResult(event)"  fault ="RemoteFault(event)" />             
         < mx:method  name ="GetArray"  result ="RemoteResult(event)"  fault ="RemoteFault(event)" />
         < mx:method  name ="GetDictionary"  result ="RemoteResult(event)"  fault ="RemoteFault(event)" />     
         < mx:method  name ="GetHashTable"  result ="RemoteResult(event)"  fault ="RemoteFault(event)" />         
         < mx:method  name ="GetUsers"  result ="RemoteResult(event)"  fault ="RemoteFault(event)" />         
     </ mx:RemoteObject >

     < mx:Text  x ="38"  y ="25"  id ="txtHelloWord" />
     < mx:Button  x ="38"  y ="51"  label ="HelloWord"  id ="btnHelloWord0"  click ="sampleRemoteObject.HelloWord()" />
    
     < mx:Text  x ="38"  y ="105"  id ="txtSayHello" />
     < mx:Label  x ="38"  y ="131"  text ="name:" />
     < mx:TextInput  x ="88"  y ="129"  id ="txtName" />
     < mx:Button  x ="256"  y ="129"  label ="SayHello"  id ="btnSayHello"  click ="sampleRemoteObject.SayHello(this.txtName.text)" />
    
     < mx:Text  x ="38"  y ="181"  id ="txtUsers" />
     < mx:Button  x ="38"  y ="207"  label ="GetArray"  id ="btnGetArray"  click ="sampleRemoteObject.GetArray()" />
    
     < mx:Label  x ="38"  y ="262"  text ="张三:" />
     < mx:Text  x ="76"  y ="262"  id ="txtZhangSan" />
     < mx:Label  x ="129"  y ="262"  text ="李四:" />
     < mx:Text  x ="167"  y ="262"  id ="txtLiSi" />
     < mx:Label  x ="218"  y ="262"  text ="王五:" />
     < mx:Text  x ="256"  y ="262"  id ="txtWangWu" />
     < mx:Button  x ="38"  y ="288"  label ="GetDictionary"  id ="btnGetDictionary"  click ="sampleRemoteObject.GetDictionary()" />
     < mx:Button  x ="157"  y ="288"  label ="GetHashTable"  id ="btnGetHashTable"  click ="sampleRemoteObject.GetHashTable()" />

     < mx:DataGrid  x ="38"  y ="318"  height ="116"  width ="312"  id ="dgUser" >
         < mx:columns >
             < mx:DataGridColumn  headerText ="姓名"  dataField ="Name" />
             < mx:DataGridColumn  headerText ="性别"  dataField ="Sex" />
             < mx:DataGridColumn  headerText ="年龄"  dataField ="Age" />
         </ mx:columns >
     </ mx:DataGrid >
     < mx:Button  x ="38"  y ="453"  label ="GetUsers"  id ="btnGetUsers"  click ="sampleRemoteObject.GetUsers()" />
</ mx:Application >

至此，Flex 与 Asp.Net 通过 Remoting 方式进行通讯 的全部文章都已完成，前后经历了一个星期的时间，有很多地方写的还不完善，希望看过的朋友们批评指教！还是希望喜欢本文的朋友们，转载请注明出处！

版权由http://xingfustar.cnblogs.com/所有，转载请注明出处，XingFuStar 2007年12月11日