開發 Flex 情境 22 -- 關於 : Flex 比較 2
1. Main.html：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0014)about:internet -->
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml: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>
<title></title>
<meta name="google" value="notranslate" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Include CSS to eliminate any default margins/padding and set the height of the html element and
the body element to 100%, because Firefox, or any Gecko based browser, interprets percentage as
the percentage of the height of its parent container, which has to be set explicitly. Fix for
Firefox 3.6 focus border issues. Initially, don't display flashContent div so it won't show
if JavaScript disabled.
-->
<style type="text/css" media="screen">
html, body { height:100%; }
body { margin:0; padding:0; overflow:auto; text-align:center;
background-color: #ffffff; }
object:focus { outline:none; }
#flashContent { display:none; }
</style>
<!-- Enable Browser History by replacing useBrowserHistory tokens with two hyphens -->
<!-- BEGIN Browser History required section -->
<link rel="stylesheet" type="text/css" href="history/history.css" />
<script type="text/javascript" src="history/history.js"></script>
<!-- END Browser History required section -->
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
// For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection.
var swfVersionStr = "11.1.0";
// To use express install, set to playerProductInstall.swf, otherwise the empty string.
var xiSwfUrlStr = "playerProductInstall.swf";
/**
1.
通過創建一個名為flashvars的對象添加Flash變量變量，在該對像上設置屬性，
然後將該對像傳遞給：swfobject.embedSWF()
2.
The value of the flashVars properties do not have to be static. If you use JSP to return the
wrapper, for example, you can use any JSP expression for the value of
the flashVars properties that can be evaluated to a String.
3.
Flash Builder 會自動更新Main.html的內容回原本預設的內容，所以，當build project
之後，加在flashvars、params內的新的內容，會被復舊。執行時，Main.mxml會無法取
用到新的parameter，會出現undefine的錯誤，或null的錯誤(當在Flash UI Component元件
內使用{}的時候) -- 註1。
*/
var flashvars = {};
var params = {};
params.quality = "high";
params.bgcolor = "#ffffff";
params.allowscriptaccess = "sameDomain";
params.allowfullscreen = "true";
var attributes = {};
attributes.id = "Main";
attributes.name = "Main";
attributes.align = "middle";
swfobject.embedSWF(
"Main.swf", "flashContent",
"100%", "100%",
swfVersionStr, xiSwfUrlStr,
flashvars, params, attributes);
// JavaScript enabled so display the flashContent div in case it is not replaced with a swf object.
swfobject.createCSS("#flashContent", "display:block;text-align:left;");
</script>
</head>
<body>
<!-- SWFObject's dynamic embed method replaces this alternative HTML content with Flash content when enough
JavaScript and Flash plug-in support is available. The div is initially hidden so that it doesn't show
when JavaScript is disabled.
-->
<div id="flashContent">
<p>
To view this page ensure that Adobe Flash Player version
11.1.0 or greater is installed. -- XXX
</p>
<script type="text/javascript">
var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://");
document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='"
+ pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>" );
</script>
</div>
<noscript>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" id="Main">
<param name="movie" value="Main.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="true" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="Main.swf" width="100%" height="100%">
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="true" />
<!--<![endif]-->
<!--[if gte IE 6]>-->
<p>
Either scripts and active content are not permitted to run or Adobe Flash Player version
11.1.0 or greater is not installed. -- YYY
</p>
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash Player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</noscript>
</body>
</html>
2. index.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>flex4-project-1</title>
<meta name="description" content="" />
<script src="js/swfobject.js"></script>
<script>
var flashvars = {
};
var params = {
menu: "false",
scale: "noScale",
allowFullscreen: "true",
allowScriptAccess: "always",
bgcolor: "",
wmode: "direct" // can cause issues with FP settings & webcam
};
var attributes = {
id:"flex4-project-1"
};
swfobject.embedSWF(
"flex4-project-1.swf",
"altContent", "100%", "100%", "10.0.0",
"expressInstall.swf",
flashvars, params, attributes);
</script>
<style>
html, body { height:100%; overflow:hidden; }
body { margin:0; }
</style>
</head>
<body>
<div id="altContent">
<h1>flex4-project-1</h1>
<p><a href="http://www.adobe.com/go/getflashplayer">Get Adobe Flash player</a></p>
</div>
</body>
</html>
註1：因此，Main.mxml的內容，以及Call Main.swf的方式如下
(1).
http://localhost:61221/flex-project-2/Main.swf?myName=yuehchung
(2).
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
applicationComplete="init()">
<fx:Style>
/*Button {
color:red;
}*/
</fx:Style>
<fx:Script>
<![CDATA[
// import mx.messaging.messages.AsyncMessage;
// import mx.messaging.messages.IMessage;
import mx.core.FlexGlobals;
/* Declare bindable properties in Application scope. */
[Bindable]
public var myName:String;
[Bindable]
public var myHometown:String;
private function init():void
{
myName = FlexGlobals.topLevelApplication.parameters.myName;
}
protected function button2_clickHandler(event:MouseEvent):void
{
log.text += "firstName:"+FlexGlobals.topLevelApplication.parameters.myName +"\n";
}
protected function button3_clickHandler(event:MouseEvent):void
{
for (var i:String in FlexGlobals.topLevelApplication.parameters) {
log.text += i + ":" + FlexGlobals.topLevelApplication.parameters[i] + "\n";
}
}
]]>
</fx:Script>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
<fx:Model id="MyEmployee">
<root>
<name>
<first>Will</first>
<last>Tuckerman</last>
</name>
<department>Accounting</department>
<email>wtuckerman@wilsoncompany.com</email>
</root>
</fx:Model>
</fx:Declarations>
<s:Panel title="Chat" top="12" bottom="12" left="12" right="12">
<s:TextArea id="log" width="100%" height="100%" borderVisible="false"/>
<s:controlBarContent>
<mx:Form width="100%" paddingTop="4" paddingBottom="4" paddingLeft="4" paddingRight="4">
<mx:FormItem label="User Id:{myName}">
<s:TextInput id="userId" width="100" enter=""/>
</mx:FormItem>
<mx:FormItem label="Message:" width="100%" direction="horizontal">
<s:TextInput id="msg" width="100%" enter=""/>
<s:Button label="Send 1" click="button2_clickHandler(event)"/>
<s:Button label="Send 2" click="button3_clickHandler(event)"/>
</mx:FormItem>
</mx:Form>
</s:controlBarContent>
</s:Panel>
</s:Application>
1. Main.html：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0014)about:internet -->
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml: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>
<title></title>
<meta name="google" value="notranslate" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Include CSS to eliminate any default margins/padding and set the height of the html element and
the body element to 100%, because Firefox, or any Gecko based browser, interprets percentage as
the percentage of the height of its parent container, which has to be set explicitly. Fix for
Firefox 3.6 focus border issues. Initially, don't display flashContent div so it won't show
if JavaScript disabled.
-->
<style type="text/css" media="screen">
html, body { height:100%; }
body { margin:0; padding:0; overflow:auto; text-align:center;
background-color: #ffffff; }
object:focus { outline:none; }
#flashContent { display:none; }
</style>
<!-- Enable Browser History by replacing useBrowserHistory tokens with two hyphens -->
<!-- BEGIN Browser History required section -->
<link rel="stylesheet" type="text/css" href="history/history.css" />
<script type="text/javascript" src="history/history.js"></script>
<!-- END Browser History required section -->
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
// For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection.
var swfVersionStr = "11.1.0";
// To use express install, set to playerProductInstall.swf, otherwise the empty string.
var xiSwfUrlStr = "playerProductInstall.swf";
/**
1.
通過創建一個名為flashvars的對象添加Flash變量變量，在該對像上設置屬性，
然後將該對像傳遞給：swfobject.embedSWF()
2.
The value of the flashVars properties do not have to be static. If you use JSP to return the
wrapper, for example, you can use any JSP expression for the value of
the flashVars properties that can be evaluated to a String.
3.
Flash Builder 會自動更新Main.html的內容回原本預設的內容，所以，當build project
之後，加在flashvars、params內的新的內容，會被復舊。執行時，Main.mxml會無法取
用到新的parameter，會出現undefine的錯誤，或null的錯誤(當在Flash UI Component元件
內使用{}的時候) -- 註1。
*/
var flashvars = {};
var params = {};
params.quality = "high";
params.bgcolor = "#ffffff";
params.allowscriptaccess = "sameDomain";
params.allowfullscreen = "true";
var attributes = {};
attributes.id = "Main";
attributes.name = "Main";
attributes.align = "middle";
swfobject.embedSWF(
"Main.swf", "flashContent",
"100%", "100%",
swfVersionStr, xiSwfUrlStr,
flashvars, params, attributes);
// JavaScript enabled so display the flashContent div in case it is not replaced with a swf object.
swfobject.createCSS("#flashContent", "display:block;text-align:left;");
</script>
</head>
<body>
<!-- SWFObject's dynamic embed method replaces this alternative HTML content with Flash content when enough
JavaScript and Flash plug-in support is available. The div is initially hidden so that it doesn't show
when JavaScript is disabled.
-->
<div id="flashContent">
<p>
To view this page ensure that Adobe Flash Player version
11.1.0 or greater is installed. -- XXX
</p>
<script type="text/javascript">
var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://");
document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='"
+ pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>" );
</script>
</div>
<noscript>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" id="Main">
<param name="movie" value="Main.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="true" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="Main.swf" width="100%" height="100%">
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="true" />
<!--<![endif]-->
<!--[if gte IE 6]>-->
<p>
Either scripts and active content are not permitted to run or Adobe Flash Player version
11.1.0 or greater is not installed. -- YYY
</p>
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash Player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</noscript>
</body>
</html>
2. index.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>flex4-project-1</title>
<meta name="description" content="" />
<script src="js/swfobject.js"></script>
<script>
var flashvars = {
};
var params = {
menu: "false",
scale: "noScale",
allowFullscreen: "true",
allowScriptAccess: "always",
bgcolor: "",
wmode: "direct" // can cause issues with FP settings & webcam
};
var attributes = {
id:"flex4-project-1"
};
swfobject.embedSWF(
"flex4-project-1.swf",
"altContent", "100%", "100%", "10.0.0",
"expressInstall.swf",
flashvars, params, attributes);
</script>
<style>
html, body { height:100%; overflow:hidden; }
body { margin:0; }
</style>
</head>
<body>
<div id="altContent">
<h1>flex4-project-1</h1>
<p><a href="http://www.adobe.com/go/getflashplayer">Get Adobe Flash player</a></p>
</div>
</body>
</html>
註1：因此，Main.mxml的內容，以及Call Main.swf的方式如下
(1).
http://localhost:61221/flex-project-2/Main.swf?myName=yuehchung
(2).
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
applicationComplete="init()">
<fx:Style>
/*Button {
color:red;
}*/
</fx:Style>
<fx:Script>
<![CDATA[
// import mx.messaging.messages.AsyncMessage;
// import mx.messaging.messages.IMessage;
import mx.core.FlexGlobals;
/* Declare bindable properties in Application scope. */
[Bindable]
public var myName:String;
[Bindable]
public var myHometown:String;
private function init():void
{
myName = FlexGlobals.topLevelApplication.parameters.myName;
}
protected function button2_clickHandler(event:MouseEvent):void
{
log.text += "firstName:"+FlexGlobals.topLevelApplication.parameters.myName +"\n";
}
protected function button3_clickHandler(event:MouseEvent):void
{
for (var i:String in FlexGlobals.topLevelApplication.parameters) {
log.text += i + ":" + FlexGlobals.topLevelApplication.parameters[i] + "\n";
}
}
]]>
</fx:Script>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
<fx:Model id="MyEmployee">
<root>
<name>
<first>Will</first>
<last>Tuckerman</last>
</name>
<department>Accounting</department>
<email>wtuckerman@wilsoncompany.com</email>
</root>
</fx:Model>
</fx:Declarations>
<s:Panel title="Chat" top="12" bottom="12" left="12" right="12">
<s:TextArea id="log" width="100%" height="100%" borderVisible="false"/>
<s:controlBarContent>
<mx:Form width="100%" paddingTop="4" paddingBottom="4" paddingLeft="4" paddingRight="4">
<mx:FormItem label="User Id:{myName}">
<s:TextInput id="userId" width="100" enter=""/>
</mx:FormItem>
<mx:FormItem label="Message:" width="100%" direction="horizontal">
<s:TextInput id="msg" width="100%" enter=""/>
<s:Button label="Send 1" click="button2_clickHandler(event)"/>
<s:Button label="Send 2" click="button3_clickHandler(event)"/>
</mx:FormItem>
</mx:Form>
</s:controlBarContent>
</s:Panel>
</s:Application>
發表文章
