Flex のフルスクリーン

  SWFObject 側の設定



▼ 実装ページ
Papervision3D : マテリアルローダ : WEB Flex

Pv3dloader



赤い部分が必要になります

  
<div id="flashcontent"></div>

<script type="text/javascript">
var flashvars = {};
var params = {
  allowScriptAccess:"always"
 ,bgcolor:"#ffffff"
 ,allowFullScreen:"true"
}; 
var attributes = {
  id: "id_sample",
  name: "id_sample"
};
swfobject.embedSWF(
	"Main.swf?reload="+(new Date()).getTime(),
	"flashcontent", 
	"700",
	"620",
	"9.0.0",
	"",
	flashvars,
	params,
	attributes
);
</script>
  

以下は、SWFObject が IE で展開した結果です。
( 指定していないものは、デフォルト値です )

※ 厳密には、SWFObject が展開した内容を innerHTML で取得したものです

  
<OBJECT 
	id=id_sample
	height=620
	width=700
	classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000
	name=id_sample
>
<PARAM NAME="_cx" VALUE="18521">
<PARAM NAME="_cy" VALUE="16404">
<PARAM NAME="FlashVars" VALUE="">
<PARAM NAME="Movie" VALUE="Main.swf?reload=1260360342953">
<PARAM NAME="Src" VALUE="Main.swf?reload=1260360342953">
<PARAM NAME="WMode" VALUE="Window">
<PARAM NAME="Play" VALUE="0">
<PARAM NAME="Loop" VALUE="-1">
<PARAM NAME="Quality" VALUE="High">
<PARAM NAME="SAlign" VALUE="LT">
<PARAM NAME="Menu" VALUE="-1">
<PARAM NAME="Base" VALUE="">
<PARAM NAME="AllowScriptAccess" VALUE="always">
<PARAM NAME="Scale" VALUE="NoScale">
<PARAM NAME="DeviceFont" VALUE="0">
<PARAM NAME="EmbedMovie" VALUE="0">
<PARAM NAME="BGColor" VALUE="FFFFFF">
<PARAM NAME="SWRemote" VALUE="">
<PARAM NAME="MovieData" VALUE="">
<PARAM NAME="SeamlessTabbing" VALUE="1">
<PARAM NAME="Profile" VALUE="0">
<PARAM NAME="ProfileAddress" VALUE="">
<PARAM NAME="ProfilePort" VALUE="0">
<PARAM NAME="AllowNetworking" VALUE="all">
<PARAM NAME="AllowFullScreen" VALUE="true">
</OBJECT>
  

Firefox だと以下のようになっていました

※ javascript:alert(document.body.innerHTML) で取得

  
<object
	data="Main.swf?reload=1260360591012"
	name="id_sample"
	id="id_sample"
	type="application/x-shockwave-flash"
	width="700"
	height="620"
>
<param value="always" name="allowScriptAccess">
<param value="#ffffff" name="bgcolor">
<param value="true" name="allowFullScreen">
</object>
  



  ポップアップメニューにフルスクリーンと解除のイベントを登録



stage.displayState に、'fullScreen' をセットするか、'normal' をセットするかの違いだけですが、
タイプの違うフルスクリーンを実行する為に、変数で切り分けています。ですから、復帰時に元へ戻す
必要がある為、フルスクリーンが切り替わるイベントを登録する必要があります。このイベントは、画面の
コントロールが完全に作成された後の Application の applicationComplete で行う必要があります。

※ ESC キーで 復帰します

  
// 右クリックメニュー
var cMenu:ContextMenu = new ContextMenu();
// 必要最低限の adobe メニューのみ表示
cMenu.hideBuiltInItems();

var cMenuItem2:ContextMenuItem =
	new ContextMenuItem("フルスクリーンA");
cMenuItem2.addEventListener(
	ContextMenuEvent.MENU_ITEM_SELECT,
	function (event:ContextMenuEvent):void {

		stype = 1;
		stage.displayState='fullScreen';

	}
);
cMenu.customItems.push(cMenuItem2);


var cMenuItem3:ContextMenuItem =
	new ContextMenuItem("フルスクリーンB");
cMenuItem3.addEventListener(
	ContextMenuEvent.MENU_ITEM_SELECT,
	function (event:ContextMenuEvent):void {

		stype = 2;
		stage.displayState='fullScreen';

	}
);
cMenu.customItems.push(cMenuItem3);


var cMenuItem4:ContextMenuItem =
	new ContextMenuItem("元へ戻す");
cMenuItem4.addEventListener(
	ContextMenuEvent.MENU_ITEM_SELECT,
	function (event:ContextMenuEvent):void {

		stage.displayState='normal';

	}
);
cMenu.customItems.push(cMenuItem4);


// 1) コンテキストメニュー変更
this.contextMenu = cMenu;
  

※ このメニューは、Application の initialize イベントで登録しています




  フルスクリーンのイベント処理

event.fullScreen が true になるのは、フルスクリーンになろうとしている時です

フルスクリーンモードは現時点で、キーボードの入力が不可になります( AIR は可能なモードがあります )
その為、stype が 1 の場合は、キー入力可能なコントロールを隠して単純にフルスクリーンを行っています
この場合 Panel ごと大きくなり、自動的に背景もフルになるようになっています。

それに対して、stype が 2 の場合は、3D を表示している 3D 空間を ルートのステージに移動して、
元の Panel を非表示にしています( よって復帰時には戻しています )

  
// フルスクリーンの処理
stage.addEventListener(
	FullScreenEvent.FULL_SCREEN,
	function (event:FullScreenEvent):void {

		if ( stype == 1 ) {
			if ( event.fullScreen ) {
				controlbox.visible = false;
			}
			else {
				controlbox.visible = true;
			}
		}
		if ( stype == 2 ) {
			if ( event.fullScreen ) {
				frame.visible = false;
				base.rawChildren.removeChild( view3D );
				stage.addChild( view3D );
			}
			else {
				stage.removeChild( view3D );
				base.rawChildren.addChild( view3D );
				frame.visible = true;
			}
		}

	}
);
  

(注意)
Flex のバグなのか、Papervision3D のバグなのか、フルスクリーンが復帰した場合、表示エリア( Canvas ) からはみ出る
という現象が起きています










  infoboard   管理者用   
このエントリーをはてなブックマークに追加





フリーフォントWEBサービス
SQLの窓WEBサービス

SQLの窓フリーソフト

素材

一般WEBツールリンク

SQLの窓

フリーソフト

JSライブラリ