Home Tutorial Flex Flex-components Flex Embed Assets Process

 
 

Share on Google+Share on Google+
Flex Embed Assets Process
Posted on: April 3, 2010 at 12:00 AM
Advertisement
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.

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

[Bindable]

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

public var imgCls:Class;

After that bind this variable with the component.

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

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>

.myCustomButton {

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

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

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

}

</mx:Style>

 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.

Output:-

 

Advertisement

Related Tags for Flex Embed Assets Process:


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: April 3, 2010

Recommend the tutorial

Advertisements Advertisements
 

 

 

DMCA.com