Flex FlashVars in AS3 Example
Line Break
Author: Roelof (11 Articles) - Author Website
Roelof is a SAP Consultant specialized in Front-End development. In his spare free time he is either developing on the web, playing basketball, watching soccer, travelling or just being lazy. He is also the co-owner of Flex-Blog.com.
While building my WordPress Flash Comment Form in Flex / ActionScript 3.0 over the weekend I needed to find out how to use FlashVars to pass data to my SWF file.
In this small example I will show you how to pass them and how to handle them in your Flex application. And ofcourse a small example application (with view source enabled).
Example Application
Below is an example using FlashVars with View Source enabled. Complete source of the HTML and Flex application can be found below.
Continue reading for more implementation tips.
Passing FlashVars to your SWF
Adding SWF files to your HTML is not an easy job, at our examples we usualy embed the HTML file, that was generated when you release your project, in an Iframe. If you are using that solution, you should add your FlashVars as follows:
The source below is taken from FlashVarsExample.html, created with the release build of this example:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <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 = "10.0.0"; <!-- To use express install, set to playerProductInstall.swf, otherwise the empty string. --> var xiSwfUrlStr = "playerProductInstall.swf"; var flashvars = {}; flashvars.name = "Flex-Blog Visitor"; var params = {}; params.quality = "high"; params.bgcolor = "#ffffff"; params.allowscriptaccess = "sameDomain"; params.allowfullscreen = "true"; var attributes = {}; attributes.id = "FlashVarsExample"; attributes.name = "FlashVarsExample"; attributes.align = "middle"; swfobject.embedSWF( "FlashVarsExample.swf", "flashContent", "500", "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> |
The flashvar called name will be available in your Flex application.
1 | flashvars.name = "Flex-Blog Visitor"; |
The next option to embed your SWF is directly. For WordPress you have a great plugin called Kimili Flash Embed, this will generate the following code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id="fm_FlashVarsExample_2040187859" class="flashmovie" width="500" height="100"> <param name="movie" value="http://www.flex-blog.com/samples/sample36/FlashVarsExample.swf"> <param name="allowscriptaccess" value="sameDomain"> <param name="FlashVars" value="name=Flex-Blog.com Visitor"> <!--[if !IE]>--> <object type="application/x-shockwave-flash" data="http://www.flex-blog.com/samples/sample36/FlashVarsExample.swf" name="fm_FlashVarsExample_2040187859" width="500" height="100"> <param name="allowscriptaccess" value="sameDomain"> <param name="FlashVars" value="name=Flex-Blog.com Visitor"> <!--<![endif]--> <a href="http://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> |
Especially note this:
1 | <param name="FlashVars" value="name=Flex-Blog.com Visitor"> |
So how to use the FlashVar in your Flex application?
In your application you have an Array available called:
1 | this.parameters; |
You can use it in your application as follows:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | <?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" width="500" height="100" initialize="init(event)" viewSourceURL="srcview/index.html"> <fx:Script> <![CDATA[ import mx.events.FlexEvent; [Bindable] public var flashvarname:String; protected function init(event:FlexEvent):void { var obj:Object = this.parameters; flashvarname = obj.name; } ]]> </fx:Script> <s:Label text="Hello {flashvarname}" verticalAlign="middle" height="100%" width="100%" textAlign="center"/> </s:Application> |
Please rate this post or leave a comment!
Related posts:
Written by · Filed Under Examples
Was this post useful to you?
(4 votes, average: 5.00 out of 5)
Loading ...Comments
2 Responses to “Flex FlashVars in AS3 Example”
Awesome! Many thanks for this, Flex Rocks!
Right on!