Flex and Flash Integration
==========================
The Flex technology is based on the flash player. So how can be it difficult to get and access the content of any swf in Flex and reflecting the changes in the flash swf.Here I am just discussing the case when you are using Action Script 3 version of the flash, and as all of us know that the Flex 2.0 and Flex 3.0 both uses Action Script 3.In depth we can say that in both cases we are using AVM 2. I have just created a swf in flash namely ‘ProAddRemoveApp.swf’. In this swf I am having two button with label ‘Add’ and ‘Remove’,and their id in flash are ‘btnAdd’ and ‘btnRemove’.Also I am having a MovieClip in Flash with id ‘MC’.In flash on the click of Add button I am creating a movieclip (red hexagonal),and adding that movieclip in an array and then attaching all items of the array to the ‘MC’ movieclip.Similarly on click of Remove button I am removing the last item from the array and attaching the array to movieclip MC. Here In flash the name of my array is ‘arr’. Now come to the Flex side,I have just loaded the earlier discussed swf in my Flex Application. Here I am simply creating a MovieClip and pushing all content of the swf in that.Now I can get the object of the flash swf by just using a dot with this one movieclip.In my application I have added a handler with each these two flash button,which is just showing an alert message of item Added/Removed.Except this swf I am adding a flex button here with id ‘btnRemoveOfFlex’.Now this is flex button and I am directly removing item from the array ‘arr’ of flash on its click and hence the item is removed from flash Swf.
In the image below the upper red rectangle is the swf of flash and lower rectangle red box is showing a flex button.
Hope you can get the clear idea after looking the code. I am just putting the
‘Flex’ code here for your better understanding.
*************************************************************************
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml“
width=”35%” height=”60%” layout=”absolute” creationComplete=”creationComplete()”
backgroundColor=”#ffffff”
horizontalAlign=”center” verticalAlign=”middle”
horizontalScrollPolicy=”off” verticalScrollPolicy=”off”
cornerRadius=”10″
>
<mx:Script>
<![CDATA[
import mx.controls.Button;
import mx.controls.Alert;
import flash.display.MovieClip;
import flash.display.DisplayObject;
private var addButtonCount:Number=0;
private var mc1:MovieClip;
private function creationComplete():void
{
mc1=MovieClip(mySWF.content);
mc1.btnAdd.addEventListener(MouseEvent.CLICK,addHandler,false);
mc1.btnRemove.addEventListener(MouseEvent.CLICK,removeHandler,false);
}
private function btnOfFlexHandler():void
{
var len:int =mc1.arr.length;
mc1.arr.pop();
if(len >0)
{
mc1.MC.removeChildAt(len);
}
}
private function addHandler(event):void
{
Alert.show("Added from Flash");
}
private function removeHandler(event):void
{
Alert.show("Removed from Flash");
}
]]>
</mx:Script>
<mx:HBox width=”100%” horizontalAlign=”center”>
<mx:VBox width=”50%” horizontalAlign=”center” verticalGap=”5″ verticalAlign=”top” top=”15″>
<mx:SWFLoader id=”mySWF” source=”ProAddRemoveApp.swf” autoLoad=”true”/>
<mx:Button id=”btnRemoveOfFlex” width=”150″ height=”30″ click=”btnOfFlexHandler()” label=”Remove From Flex”/>
</mx:VBox>
</mx:HBox>
</mx:Application>
******************************************************************************************
Hope you will enjoy this.
Enjoy Flexing…………………………….
