Flex Embed Assets Process


 

Flex Embed Assets Process

In flex application, you can use external assets like images etc . Then you can put the location of the assets and load these in run time after that you want to compile your application having with these assets, this is called embedding the asset.

In flex application, you can use external assets like images etc . Then you can put the location of the assets and load these in run time after that you want to compile your application having with these assets, this is called embedding the asset.

Embed Assets in Flex:-

In flex application, you can use external assets like images etc . Then you can put the location of the assets and load these in run time after that you want to compile your application having with these assets, this is called embedding the asset. You can embed images, movie and other files in your application. In this process your assets which you want to embed with the application , are include in the SWF file. The application are load that assets at run time. In this example you can see how to embed image in the flex application.

Example:-

<?xml version="1.0"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal">

<mx:Script>

<![CDATA[

[Bindable]

[Embed(source="assets/button.jpeg")]

public var imgCls:Class;

]]>

</mx:Script>

<mx:Style>

.myCustomButton {

overSkin:Embed(source="assets/button.jpeg");

upSkin:Embed(source="assets/button1.jpeg");

downSkin:Embed(source="assets/button2.jpeg");

}

</mx:Style>

<mx:Panel width="400" height="400">

<mx:Button icon="@Embed(source='assets/button1.jpeg')"/>

<mx:Button id="mybutton" icon="{imgCls}"/>

<mx:Button id="mybutton2" styleName="myCustomButton"/>

</mx:Panel>

</mx:Application>

In this tutorial there are three way to embedded image with the application-

1. Direct with the components.

User can embed image with the component when uses it then assets are compile with this component like this.

<mx:Button icon="@Embed(source='assets/button1.jpeg')"/>

2.Through action script.

0

User can embed image in the <mx:Script>tag with the bendable variable like this,

[Bindable]

[Embed(source="assets/button.jpeg")]

1

public var imgCls:Class;

After that bind this variable with the component.

<mx:Button id="mybutton" icon="{imgCls}"/>

2

3. Through style.

User can embed the assets with style when it is require in the style. The process of that embed is,

<mx:Style>

3

.myCustomButton {

overSkin:Embed(source="assets/button.jpeg");

upSkin:Embed(source="assets/button1.jpeg");

4

downSkin:Embed(source="assets/button2.jpeg");

}

</mx:Style>

5

 After that use to set property styleName like this

<mx:Button id="mybutton2" styleName="myCustomButton"/>

These are the process to embed image with the component in flex.

6

Output:-

 

7

Ads