Definition could not be found compilation error ClassReference in CSS file to Swf file

Question

I compile css files to swf files and load them at runtime. I have no problem compiling them and using ClassReference statements most of the time:

.miniCashLadderGridStyle { color : #2a2a2a; backgroundAlpha : 0; borderSkin : ClassReference("mx.skins.ProgrammaticSkin"); headerSortSeparatorSkin : ClassReference("mx.skins.ProgrammaticSkin"); horizontalSeparatorSkin : ClassReference("company.assets.GridHorzDivLine"); verticalSeparatorSkin : ClassReference("company.assets.GridVertDivLine"); } 

It works great. Assets come from a separate swc, but this:

 header-background-skin : ClassReference("company.view.grid.skin.HeaderBackground"); 

Does not work. The difference is that HeaderBackground is a class in the same project as the css file. This compiles fine if I move the style to the mxml file.

I wonder if the compiler uses different source paths when compiling css settings or something like that.

This is in FlashBuilder 4 build 269271 SDK 13963

Answer 1

Since the skin class that you referenced was not compiled into the application unless you use it elsewhere, therefore, when using the SWF style, a runtime class error will occur. Avoiding this error, you can force the classes of skins to be compiled into your application. For instance:

 <s:Application> import company.view.grid.skin.HeaderBackground; private var referrenceEnforcer:Array = [HeaderBackground]; </s:Application> 

Answer 2

The problem is that when compiling css to swf in Flex / Flash builder, it starts mxmlc without the project build path, so the sources are not visible to the compiler. Old bug filed 2 years ago

The workaround is to put the packages in the same folder where css is located (even for a symbolic link is enough). The compiler will see the files and compile them into classes accordingly.

Answer 3

This can help:

Flex supports external CSS stylesheets. To apply a stylesheet to the current document and its child documents, use the source property of the tag. External style table files must be located in the folder containing the MXML source files. By default, this is the src folder in your MXML project.

Note. You should try to limit the number of stylesheets used in the application and set the stylesheet only in the top-level document in the application (the document containing the tag). If you set a stylesheet in a child document, unexpected results may occur.

The following example defines two CSS class selectors in an external CSS file called external.css. You are using an external CSS file in your Flex application by specifying its path and file name in the original tag property. Example: External CSS File

 /* An external CSS file */ .solidBorder { borderStyle: "solid"; } .solidBorderPaddedVertically { borderStyle: "solid"; paddingTop: 12px; paddingBottom: 12px; } 

MXML file

 <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="150" height="140" viewSourceURL="src/StylesExternal/index.html" > <mx:Style source="styles/external.css" /> <mx:VBox styleName="solidBorder"> <mx:Button label="Submit"/> </mx:VBox> <mx:VBox styleName="solidBorderPaddedVertically"> <mx:Button label="Submit"/> </mx:VBox> </mx:Application> 

Answer 4

When compiling CSS, give the SWF module in the path parameter of the library for the compiler, and it will see the class.

Answer 5

Try right-clicking CSS in FlashBuilder 4 Package Explorer and then compiling CSS into SWF. This seemed to fix it for me.

Answer 6

here is my solution for this problem http://volokh.com.ua/blog/2011/06/14/my-fix-for-classreference-in-nested-css-file-compiled-to-swf-causes-error/