Using swfobject to allow fullscreen with Flex Builder

If you’re trying to develop a flex app that can go fullscreen (allowFullScreen) you’ll get an error in Flex Builder when you try and run code that launches fullscreen mode.

The issue is that allowing fullscreen is set as a param in the code of that embeds the SWF in it’s HTML page not in MXML or ActionScript. Here’s how to use swfobject instead of Adobe’s default AC_OET.js so that Flex Builder’s generated HTML allows fullscreen during debugging.

Download swfobject to your Flex Builder project’s ‘html-template’ directory (unzipping it so swfobject.js is in that folder). Then change index.template.html to the following:

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>${application}</title>

<style>
body { margin: 0px; overflow:hidden }
</style>

</head>

<body scroll="no">

<script type="text/javascript" src="swfobject.js"></script>

<div id="${application}">
  This text is replaced by the Flash movie.
</div>

<script type="text/javascript">
   var so = new SWFObject("${swf}.swf", "${application}", "${width}", "${height}", "9", "${bgcolor}");
   so.addParam("allowFullScreen", "true");
   so.write("${application}");
</script>

</body>
</html>

That’s it! Now when you debug from within Flex Builder you can try out your fullscreen code.

Post a Comment

Your email is never shared. Required fields are marked *

*
*

*
To prove you're a person (not a spam script), type the security word shown in the picture. Click on the picture to hear an audio file of the word.
Click to hear an audio file of the anti-spam word