flash源码使用方法有什么(分析嵌入开源 Flash 控件 Ruffle)

网站编辑01 2022-07-27 15:51:21 阅读:17

  方法一、使用基于微软 WebView2 的 web.view 嵌入 JS 版 Ruffle

  Ruffle 是一个开源免费的 Flash 播放器,网页版 ruffle.js 体积很小,打个包 1.7 MB,调用也非常简单。aardio 标准库中的 web.view ( WebView2 ) 可以完美支持 ruffle.js ,不过我们先要解决 2 个小问题:

  1、ruffle.js 通过网址加载 Flash 动画不太正常会报错,但是直接内存加载动画数据没问题。

  2、浏览器不能直接用代码访问本地文件。

flash源码使用方法有什么(分析嵌入开源 Flash 控件 Ruffle)

  我们先使用 external 接口导出 aardio 函数来解决上面的问题,使用 aardio 将远程或本地的 swf 文件先读入到内存,再转换为字节数组传给 ruffle.js 就可以了,关键代码如下:

  import web.view;var wb = web.view(winform);wb.external = { getSwf = function(){ //可返回包含 SWF 文件二进制数据的数组、SAFEARRAY,buffer return com.SafeArrayV( inet.http.get("https://update.aardio.com/v10.files/demo/transparent.swf") ); //本地文件可以直接返回 buffer return string.loadBuffer("\res\tet.swf"); }; }

  给 ruffle.js 返回数组就行(buffer、数组、COM 数组都行), 要注意 string.load 加载文件返回的是字符串,string.loadBuffer() 返回的是字节数组。

  网页里面用下面的 JavaScript 加载 Flash 动画:

  const ruffle = window.RufflePlayer.newest();const player = ruffle.createPlayer();player.style.width = "100vw";player.style.height = "100vh";const container = document.getElementById("container");container.appendChild(player);player.load({data: await aardio.getSwf() });

  在 JS 里用 aardio.getSwf() 调用 aardio 导出的 wb.external.getSwf() 函数,注意所有本地函数在 WebView2 里都是异步函数,所以用了 await 取返回值( 要在异步函数里才能使用 await )。

  ruffle.js 最好是通过 HTTP 服务器加载,这在 aardio 中很容易解决,如果创建了 aardio 工程,只要简单地将所有网页以及 ruffle.js 添加到工程的资源目录内,然后用类似:

  wb.go( wsock.tcp.simpleHttpServer.startUrl("/res/swf/index.html") )

  打开网页就可以了,aardio 会自动使用 HTTP 协议内存加载这个资源目录下的所有文件(可以发布为独立 EXE 文件)。

  写范例的时候为了方便大家复制就可以运行,没有创建工程文件,HTML代码与 aardio 代码混写在一起,所以我写了一个扩展库 web.ruffle 用于获取通过 HTTP 服务器访问 ruffle.js 的地址。

  首先在 aardio 中导出 getRuffleScriptSrc 函数:

  import web.ruffle;import web.view;var wb = web.view(winform);wb.external = { getSwf = function(){ return com.SafeArrayV( inet.http.get("https://update.aardio.com/v10.files/demo/transparent.swf") ); }; getRuffleScriptSrc = function(){ return web.ruffle.getUrl("/ruffle/ruffle.js"); }; }

  然后在 HTML 代码中添加一个空的 script 元素:

  

  然后在 JavaScript 中调用 aardio 函数获取到 ruffle.js 的地址并加载该 JS:

  var ruffleScript = document.getElementById("ruffle");ruffleScript.src = await aa


二维码