SWFObject.jsを使ってswfにパラメータを渡す方法

以下、FlashDevelopにて作業を行いました。

1.新規プロジェクトの作成。

'Project => New Project... => Flex 3 Project'と選びます。
今回はProject名を'SWFObjectTest'としました。

2.中身を確認。

FlashDevelopがSWFObject.jsを用意してくれます。


組み込まれたhtmlのソースはこんな感じ。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<title>SWFObjectTest</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="language" content="en" />
	<meta name="description" content="" />
	<meta name="keywords" content="" />
	
	<script src="js/swfobject.js" type="text/javascript"></script>
	<script type="text/javascript">
		var flashvars = {
		};
		var params = {
			menu: "false",
			scale: "noScale",
			allowFullscreen: "true",
			allowScriptAccess: "always",
			bgcolor: "#FFFFFF"
		};
		var attributes = {
			id:"SWFObjectTest"
		};
		swfobject.embedSWF("SWFObjectTest.swf", "altContent", "100%", "100%", "9.0.0", "expressInstall.swf", flashvars, params, attributes);
	</script>
	<style>
		html, body { height:100%; }
		body { margin:0; }
	</style>
</head>
<body>
	<div id="altContent">
		<h1>SWFObjectTest</h1>
		<p>Alternative content</p>
		<p><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></p>
	</div>
</body>
</html>

3.index.htmlを書き換え。

swfに渡す値を記述します。

var flashvars = {
    caption: 'HelloFlex!!'
};

4.Main.mxmlの書き換え。

  • mxmlの記述において、creationCompleteによって表示内容がレンダリングされた後に呼び出す関数を定義します。
  • ASにおいて、this.parametersでSWFObject.js から FlashVars に記述された値を引き受けます。

ちなみにinitializeとの違いはここに。あとで読むけど^^;。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" creationComplete="init()">
    <mx:Label id="caption" text="Hello World"/>
    <mx:Script>
        <![CDATA[
            /**
             * 初期データ読み込み
             */
            private function init():void {
                // SWFObject.js から FlashVars を読み込み。
                var params:Object = this.parameters;
                if (params['caption'] != null) {
                    caption.text = params['caption'];
                }
            }
        ]]>
    </mx:Script>
</mx:Application>

これでソースは完成です。

5. プロジェクトをビルドします。



htmlファイルに記述されている'SWFObjectTest.swf'という名前でSWFファイルが作成されました。

6. index.htmlをブラウザで開きます。


無事に値を渡すことができました。