Embedding a movieclip using CSS in Flex 3

Question

We use

[Embed(source="assets/styles/basic/my_skins.swf",symbol="preloader_3")]
private var PreloaderAnim:Class;

for embedding a movieclip from an swf file.

How can I do the same using a CSS file (which is loaded at runtime) and use it in my class?

Answer 1

You need to remember that runtime flex CSS with embedded assets is also an swf. So if you wan't to load an swf you should probably just go ahead and load it without additional embedding. If you're, however, planning to use the swf symbols as part of the skin you should use something similiar to this:

style.css:
ComboBox.Styled
{
 skin: Embed(source='skin/some_file.swf', symbol='ComboBoxSkinInSomeFile');
}

I'm almost sure you can't just use the CSS as a container for symbols, without defining them as a part of some style.

For more info on how to compile css to swf look here: Blog post

Answer 2

You can do it in a way like this:

1) In your css file declare a new style. For example:

.myPreloader {
    skin: Embed(source="assets/styles/basic/my_skins.swf", symbol="preloader_3");   
}

2) Anywhere you can access the class you need:

var PreloaderAnim:Class = StyleManager.getStyleDeclaration(".myPreloader").getStyle("skin");

That's it. You can use PreloaderAnim variable as you want. For example, you can create new movie clip.