首页 > 代码库 > flex集成IFrame,IFrame集成UnityWebPlayer直接通讯调用解决方案

flex集成IFrame,IFrame集成UnityWebPlayer直接通讯调用解决方案

做Web开发通常是flex与JS交互,UnityWebPlayer与JS交互。它们之间相互调用比较常见。

/**
 * Flex调用Javascript函数
 * @params  functionName:String   Javascript函数名称
 * @params ...params    Javascript函数参数
 * @return  返回Javascript函数的return内容
 **/
ExternalInterface.call(functionName:String, ...params);

/**
 * Javascript调用Flex函数
 * @params   functionName:String    Javascript调用Flex函数名
 * @params   closure:Function     Flex将要调用的函数
 * @return void
 **/
ExternalInterface.addCallback(functionName:String,closure:Function);

JS调用Unity web Content函数

<script type="text/javascript" language="javascript">
<!--
//initializing the WebPlayer
var u = new UnityObject2();
u.initPlugin(jQuery("#unityPlayer")[0], "Example.unity3d");

function SaySomethingToUnity()
{
	u.getUnity().SendMessage("MyObject", "MyFunction", "Hello from a web page!");
}
-->
</script>

在Unity web player中需要有一个“MyObject”的GameObject对象,并且附加一个带有“MyFunction”函数的脚本:

function MyFunction(param : String)
{
    Debug.Log(param);
}

unity web player调用网页中JS函数:

unity中加入该脚本调用
Application.ExternalCall( "SayHello", "The game says hello!" );

在web页面中需要定义一个叫 SayHello() 函数: 

<script type="text/javascript" language="javascript">
<!--
function SayHello( arg )
{
    // show the message
    alert( arg );
}
-->
</script>
以上两种交互方式是比较常用的,最近一个项目遇到了一个特殊的应用需求。需要把unity web player的页面签入到flex应用框架中,并且完成flex与unity web player直接的交互。

为了完成这项需求需要解决如下问题:

1、如何把html页面签入到flex容器中;

2、如何实现flex与unity web player直接的通讯问题;

问题1,通过收搜得出目前flex中有一个iframe插件,可以解决。

步骤:

1、在此链接中下载现成的资料 https://github.com/flex-users/flex-iframe/downloads

我下的是最新的 flex-iframe-1.5.1.zip

解压后,在 flex-iframe-1.5.1\sources\library\flex-iframe\src\com\google\code\flexiframe  这个路径中可以找到两个AcriptScript 类文件

2、将IFrame.as、IFrameExternalCalls.as  存放在Flex项目中,我将它复制到Class文件里或者引用bin\flex-iframe-1.5.swc

3、新建立 MXML应用程序,添加红色部分代码即可, source里填充要显示的页面

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:flexiframe="http://code.google.com/p/flex-iframe/"
      xmlns:s="library://ns.adobe.com/flex/spark" 
      xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
      xmlns:iframe="Class.*">
 <fx:Declarations>
  <!-- 将非可视元素(例如服务、值对象)放在此处 -->
 </fx:Declarations>
 <iframe:IFrame id="iFrame" source="http://www.baidu.com/" width="100%" height="100%"/>
</s:Application>
问题2,解决flex与unity web player直接通讯。

unity web player调用flex函数,关键是通过图上红色标注,其实很好理解就是iframe签入到了Flex的HTML中,通过iframe中脚本发现SwfContent对象就可以实现调用flex中的函数,实现与flex通讯。




flex集成IFrame,IFrame集成UnityWebPlayer直接通讯调用解决方案