第一次写,请见谅!
背景:
使用Flex做开发,碰到一些需求,要求能够在Flex开发的swf中嵌入其他html页面.
或者将swf嵌入到其他页面.
解决思路:
在swf嵌入其他页面:
利用Iframe来进行嵌入,或本页弹框,或本页框架嵌入
网上有相关Flex开源的IFrame组件可供使用.名称叫 flex-iframe
在其他页面嵌入swf:
可以使用object 或者embed进行嵌入.也可以使用iframe引用一个object和embed包装的html页面
问题1描述: wmode 模式的选用 ,导致鼠标滚轮无效
wmode的三个模式分别为:window/Transparent/opaque
window:窗口模式,在没有指定wmode的时候,flash默认是以这种方式创建的。在这种模式下,flash拥有自己的窗口句柄,从而相对独立于浏览器的页面表现,独立的进行表现和渲染,所以窗口模式是相对其他模式来说效率最高的一种。同时也是因为它独立于浏览器的HTML渲染表面,所以当html的表现层和flash的表现层重合的时候,flash总是会遮住位置与他重合的所有html层。eg:你要做一个模态的提示框,想让灰色覆盖整个页面,但在有flash的情况,flash会不管你html中z-index的设置而表现在上层。 于是,就引出了第二种模式。
transparent :透明模式,这种模式类似于把flash放到html层结构里,可以通过z-index来进行层表现的传递和高度。在这种模式下flash会让可以透明的html层都以透明的方式展示在自己之上。这种对动画的性能表现的非常差,而且在9.0.115之前的flash player版本设置wmode=”transparent”会导致全屏模式失效。
Opaque:非透明模式,整个是相对于transparent方式来说的,它使flash隐藏html层上所有位于它后面的所有内容。
除了window模式外其他两个模式flash都没有自己的窗口句柄,表现力上会差很多.抛开表现上的差距,当非window模式下时,在Firefox/chrome浏览器下会发生事件滚轮无效的问题.ie9以上没有该问题,那么解决该问题的方法是:
通过js监听浏览器的鼠标滚轮事件,通过js和flash的function调用来实现对浏览器滚轮的实现.
具体做法如下:
if(!(document.all)) { if (document.addEventListener) { window.addEventListener("DOMMouseScroll", onMouseWheelHandler, false); } window.onmousewheel = document.onmousewheel = this.onMouseWheelHandler; //Opera/Chrome } function getFlashMovieObject(movieName){ if (window.document[movieName]) { return window.document[movieName]; } if (navigator.appName.indexOf("Microsoft Internet") == -1) { if (document.embeds && document.embeds[movieName]) return document.embeds[movieName]; }else { return document.getElementById(movieName); } } function onMouseWheelHandler(e){ var o = {x: e.screenX, y: e.screenY, delta: e.wheelDelta ? e.wheelDelta : -e.detail, ctrlKey: e.ctrlKey, altKey: e.altKey, shiftKey: e.shiftKey}; var vflash = getFlashMovieObject("${application}"); vflash.handleWheel(o); };
通过添加该段js脚本可以使得js可以调用flash为js注册的handleWheel方法.
在flex中我们需要添加该注册方法,在swf构建完毕后,添加如下内容
ExternalInterface.addCallback( "handleWheel" , handleWheel);
实现handleWheel方法
public function handleWheel(event:Object):void { var obj:InteractiveObject = null; var objects:Array = this.getObjectsUnderPoint(new Point(event.x, event.y)); for (var i:int = objects.length - 1; i >= 0; i--) { if (objects[i] is InteractiveObject) { obj = objects[i] as InteractiveObject; break; } else { if (objects[i] is Shape && (objects[i] as Shape).parent) { obj = (objects[i] as Shape).parent; break; } } } if (obj) { var mEvent:MouseEvent = new MouseEvent(MouseEvent.MOUSE_WHEEL, true, false, event.x, event.y, obj, event.ctrlKey, event.altKey, event.shiftKey, false, Number(event.delta) >0 ? 1:-1); obj.dispatchEvent(mEvent); } }
就可以实现在非window模式下 FF/Chrome 滚轮事件的响应了
问题2描述: wmode 模式的选用 ,导致鼠标滚轮无效-FireFox特殊处理
进行问题1的解决方法后,会发现在FireFox下仍然无效,解决方法是在flex中注册js调用方法前加入:
Security.allowDomain("*"); Security.allowInsecureDomain("*");同意FireFox的js可以调用访问该域下swf的方法.
问题3描述: wmode 模式的选用 ,导致ComboBox无法打开使用的处理方式
由于鼠标的滚轮事件会通过js来传递给ComboBox,原combobox的鼠标监听事件无法使用,会导致在combobox打开的状态下,会认为js传来的事件是combobox的外部事件,那么combobox会自动关闭listbase.
解决方法,自己动手写一个combobox,将combbox的listbase打开关闭状态记录下来.当在接到外部js的滚轮事件时 && 并且 combobox的listbase处理打开状态,那么手动处理combobox的滚动.
代码如下:
package com.loyo.ui { import flash.utils.Dictionary; import mx.controls.ComboBox; import mx.events.DropdownEvent; public class SelfComboBox extends ComboBox { public static var selfComboBoxNum:int = 0; public static var selfComboBoxDict:Dictionary = new Dictionary(); public static function getSCombobox(id:String):SelfComboBox{ return selfComboBoxDict[id]; } public static function setSelfComboBox(id:String,scombobox:SelfComboBox):void{ selfComboBoxDict[id] = scombobox; } public var isOpen:Boolean = false; public function SelfComboBox() { super(); this.id = "scombobox_"+selfComboBoxNum; selfComboBoxNum++; setSelfComboBox(this.id,this); addEventListener(DropdownEvent.OPEN,onDropdownOpen); addEventListener(DropdownEvent.CLOSE,onDropdownClose); } public function onDropdownOpen(event:DropdownEvent):void{ trace(" SelfComboBox isOpen : true" ); this.isOpen = true; } public function onDropdownClose(event:DropdownEvent):void{ trace(" SelfComboBox isOpen : false" ); this.isOpen = false; } public function doMouseWheelByJS(delta:Number):void{ if(isOpen){ if(delta > 0){ if(dropdown.selectedIndex > 0){ dropdown.selectedIndex--; } }else{ dropdown.selectedIndex++; } dropdown.scrollToIndex(dropdown.selectedIndex); } } } }
相关推荐
flex iframe 支持在flash中嵌套入html jsp asp php等flex iframe 支持在flash中嵌套入html jsp asp php等flex iframe 支持在flash中嵌套入html jsp asp php等flex iframe 支持在flash中嵌套入html jsp asp php等flex...
本例,flash内嵌在flex里,示例了: 1、flash调用flex的函数(方法) 2、flex调用flash的函数(方法)
flex调用flash cs 里方法;flex响应flash的点击事件;flex给flash变量赋值
flex 卸载flash 安装编译版10flash flex 卸载flash 安装编译版10flash
flex 设置背景音乐flex 设置背景音乐flex 设置背景音乐flex 设置背景音乐flex 设置背景音乐flex 设置背景音乐flex 设置背景音乐
Flex与Flash相互调用。解压后有两个工程目录,一个是flash程序,一个是flex工程。
Flex获取设置html cookie;Flex获取设置html cookie
FLEX和Actionscript开发FLASH游戏的中文文档,内容和详细 希望对你有用~
Flex(Flash)与.net交互教程详解,一步一步教你如何实现FLEX与.net的交互。
flashplayer_10_ax_debug.exe flashplayer_10_ax_debug.exe flashplayer_10_ax_debug.exe
flex、flash及air等ios开发证书(P12格式) 压缩包内含两个文件: ios.p12(ios开发证书) mobileprovision.mobileprovision(配置文件) 用该证书及对应配置文件可以免99刀的Apple developer费用,编译出的ipa...
3.1.1 在air应用程序描述符文件中设置属性 66 3.1.2 手动编辑hello world app的应用程序描述符文件 66 3.1.3 blackberry tablet os配置 76 3.1.4 为google android打包 79 3.1.5 为apple ios打包 85 3.1.6 为...
flash调试版,用于flex开发调试,好不容易找到这个资源大家珍惜了
flex 与 Js 通信 相互调用;用于flex 与JS 中的 方法通信,其中的crossdomain.xml 属于安全策略问题
一个flash做的flex的样式 比较的齐全
使用FLEX 和 Actionscript开发FLASH 游戏(一)
Flex java blazeds 开中 遇到的问题大全
flex中文帮助flex中文帮助flex中文帮助flex中文帮助
flex flex flex flex flex flex flex
很全面的flex教程,里面的实例也很丰富~~不过是英文的~~