Flex获取窗体大小 Flex与JS互相调用

转载 2012年03月27日 10:22:12
有时我们需要弹出自定义提示框,并显示在屏幕中心,这是需要根据浏览器大小来动态或得浏览器中心位置的坐标,这时可以使用flex和html里的js进行通讯,来获取。
效果图:
使用ExternalInterface.addCallback 来发布 ActionScript 要提供给 JavaScript 调用的函数或方法,执行完 ExternalInterface.addCallback 后,通过 ExternalInterface.call 方法调用 JavaScript 中的方法获取屏幕参数。

详细复制下面代码运行

favzone.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
				layout="absolute"
				backgroundColor="#FFFFFF"
				creationComplete="init()">
	<mx:Script>
		<![CDATA[
			import mx.core.Container;
			import flash.external.ExternalInterface;
			import mx.containers.Canvas;
			[Bindable]
			private var screenWidth:int=new int();
			[Bindable]
			private var screenHeight:int=new int();

			internal function init():void
			{
				ExternalInterface.addCallback("setScreenSize", setScreenSize);
				ExternalInterface.call("getScreenSize", setScreenSize);
			}

			private function setScreenSize(width:int, height:int):void
			{
				this.screenWidth=int(width);
				this.screenHeight=int(height);
			}
		]]>
	</mx:Script>

	<mx:Text text="screenWidth:{screenWidth}"/>
	<mx:Text text="screenHeight:{screenHeight}"
			 y="42"/>
</mx:Application>


 

 

 

 

calljs.js

function thisMovie(movieName) {
	if (navigator.appName.indexOf("Microsoft") != -1) {
		return window[movieName];
	} else {
		return document[movieName];
	}
}





// send to flex
function getScreenSize() {
	var size = [];
	size = getSize();
	thisMovie("favzone").setScreenSize(size[0], size[1]);
}




//get size
function getSize() {
	var myWidth = 0, myHeight = 0;
	if (typeof (window.innerWidth) == "number") {
		myWidth = window.innerWidth;
		myHeight = window.innerHeight;
	} else {
		if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
			myWidth = document.documentElement.clientWidth;
			myHeight = document.documentElement.clientHeight;
		} else {
			if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
				myWidth = document.body.clientWidth;
				myHeight = document.body.clientHeight;
			}
		}
	}
	var size = [];
	size[0] = myWidth;
	size[1] = myHeight;
	return size;
}


 

 

 

 

index.template.html

<!-- saved from url=(0014)about:internet -->
<html lang="en">

	<!-- 
Smart developers always View Source. 

This application was built using Adobe Flex, an open source framework
for building rich Internet applications that get delivered via the
Flash Player or to desktops via Adobe AIR. 

Learn more about Flex at http://flex.org 
// -->

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

		<!--  BEGIN Browser History required section -->
		<link rel="stylesheet" type="text/css" href="history/history.css" />
		<!--  END Browser History required section -->

		<title>${title}</title>
		<script src="AC_OETags.js" language="javascript"></script>

		<!--  BEGIN Browser History required section -->
		<script src="history/history.js" language="javascript"></script>
		<!--  END Browser History required section -->
		
		<script src="calljs.js" language="javascript"></script>
		
		
		
		

		<style>
body {
	margin: 0px;
	overflow: hidden
}
</style>
		<script language="JavaScript" type="text/javascript">
<!--
// -----------------------------------------------------------------------------
// Globals
// Major version of Flash required
var requiredMajorVersion = ${version_major};
// Minor version of Flash required
var requiredMinorVersion = ${version_minor};
// Minor version of Flash required
var requiredRevision = ${version_revision};
// -----------------------------------------------------------------------------
// -->
</script>
	</head>

	<body scroll="no">
		<script language="JavaScript" type="text/javascript">
<!--
// Version check for the Flash Player that has the ability to start Player Product Install (6.0r65)
var hasProductInstall = DetectFlashVer(6, 0, 65);

// Version check based upon the values defined in globals
var hasRequestedVersion = DetectFlashVer(requiredMajorVersion, requiredMinorVersion, requiredRevision);

if ( hasProductInstall && !hasRequestedVersion ) {
	// DO NOT MODIFY THE FOLLOWING FOUR LINES
	// Location visited after installation is complete if installation is required
	var MMPlayerType = (isIE == true) ? "ActiveX" : "PlugIn";
	var MMredirectURL = window.location;
    document.title = document.title.slice(0, 47) + " - Flash Player Installation";
    var MMdoctitle = document.title;

	AC_FL_RunContent(
		"src", "playerProductInstall",
		"FlashVars", "MMredirectURL="+MMredirectURL+'&MMplayerType='+MMPlayerType+'&MMdoctitle='+MMdoctitle+"",
		"width", "${width}",
		"height", "${height}",
		"align", "middle",
		"id", "${application}",
		"quality", "high",
		"bgcolor", "${bgcolor}",
		"name", "${application}",
		"allowScriptAccess","sameDomain",
		"type", "application/x-shockwave-flash",
		"pluginspage", "http://www.adobe.com/go/getflashplayer"
	);
} else if (hasRequestedVersion) {
	// if we've detected an acceptable version
	// embed the Flash Content SWF when all tests are passed
	AC_FL_RunContent(
			"src", "${swf}",
			"width", "${width}",
			"height", "${height}",
			"align", "middle",
			"id", "${application}",
			"quality", "high",
			"bgcolor", "${bgcolor}",
			"name", "${application}",
			"allowScriptAccess","sameDomain",
			"type", "application/x-shockwave-flash",
			"pluginspage", "http://www.adobe.com/go/getflashplayer"
	);
  } else {  // flash is too old or we can't detect the plugin
    var alternateContent = 'Alternate HTML content should be placed here. '
  	+ 'This content requires the Adobe Flash Player. '
   	+ '<a href=http://www.adobe.com/go/getflash/>Get Flash</a>';
    document.write(alternateContent);  // insert non-flash content
  }
// -->
</script>
		<noscript>
			<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
				id="${application}" width="${width}" height="${height}"
				codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">
				<param name="movie" value="${swf}.swf" />
				<param name="quality" value="high" />
				<param name="bgcolor" value="${bgcolor}" />
				<param name="allowScriptAccess" value="sameDomain" />
				<embed src="${swf}.swf" quality="high" bgcolor="${bgcolor}"
					width="${width}" height="${height}" name="${application}"
					align="middle" play="true" loop="false" quality="high"
					allowScriptAccess="sameDomain" type="application/x-shockwave-flash"
					pluginspage="http://www.adobe.com/go/getflashplayer">
				</embed>
			</object>
		</noscript>
	</body>
</html>


 

JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度

网页可见区域宽:document.body.clientWidth  网页可见区域高:document.body.clientHeight  网页可见区域宽:document.body.offsetW...
  • lpy3654321
  • lpy3654321
  • 2014年02月13日 16:36
  • 9299

css学习18:css3 flex流动自适应响应式布局实例

上次简要的说了一些css3中flex的相关概念(详细:css学习16:css3 flex流动自适应响应式布局设计),这次继续说下css3的flex,简单的举几个实例。 一、图片自适应居中 实例图...
  • hsany330
  • hsany330
  • 2016年09月13日 14:25
  • 2508

flex与布局(基本网格布局、百分比布局、一侧固定一侧自适应、圣杯布局)

1、基本网格布局 分情况讨论: (1)如果所有的项目有相同的结构 flex-shrink压缩 .container{ padding-top:20px; ...
  • zxy9602
  • zxy9602
  • 2016年11月13日 21:34
  • 5010

Flex 窗体 最大化、最小化实例

---导入flexMdi.swc (http://code.google.com/p/flexmdi/);--- ----测试代码---- Xml代码 xml   ve...
  • hongtashan11
  • hongtashan11
  • 2011年11月03日 14:48
  • 791

Flex弹出自定义窗体,并且居中

大致就是分两步: (1)先自定义窗体的布局mxml文件
  • breaker892902
  • breaker892902
  • 2014年04月03日 21:02
  • 1906

Flex PopUpManager 窗体间参数传递

//TestPopForm 主窗体(Application)
  • xumengxing
  • xumengxing
  • 2012年10月09日 18:42
  • 2725

Flex AIR)创建“不规则形状”的Air透明窗体

Flex AIR)创建“不规则形状”的Air透明窗体 Adobe AIR 是使用Flash /Flex 编程方式开发桌面应用的一种方式, 由于Flash /Flex 快速构建界面、基于...
  • a1171156733
  • a1171156733
  • 2014年04月18日 16:22
  • 714

flex中的动画以及窗体的布局

  • xinghui_liu
  • xinghui_liu
  • 2012年03月15日 14:39
  • 679

JS弹出层(可适应窗体调节的大小)

  • 2010年12月10日 12:34
  • 4KB
  • 下载

flex 窗体拖拽,可以自由拖拽,最大化,最小化等等

  • 2011年07月27日 15:10
  • 8KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Flex获取窗体大小 Flex与JS互相调用
举报原因:
原因补充:

(最多只允许输入30个字)