F*CSS ist ein CSS-Parser für Flash. Das Ziel des Open Source Projekts ist eine verbesserte CSS-Unterstützung in Flash. Diese soll nicht nur auf Textfelder ausgelegt sein, sondern allgemein auf Objekte.

The main class called FStyleSheet (found inside of the com.flashartofwar.fcss.stylesheets package), goes well beyond the native StyleSheet class by supporting style inheritance, pseudo selectors, and merging styles on the fly.

F*CSS funktioniert mit Flash Player 9 und 10, Flex 3 und AIR. Die Bibliothek kann sowohl mit dem Flex SDK als auch mit Flash CS3/4 kompiliert werden.

Beispiel

Hier das Beispiel aus dem QuickStart Guide.

Actionscript:

  1. span style="color: #808080; font-style: italic;">/** Sample CSS ***/
  2.  
  3.             // Get some css. Normally you would load CSS from an external file but
  4.             // for this example we are going to put some CSS in a XML variable.
  5. /* This is a class *//* This is an ID */
  6.             #demoStyle
  7. /* This is how you can inharit from another style */
  8.             #demoStyle #demoStyle2
  9.             {
  10.                 y:100;
  11.             }
  12.  
  13.             #demoStyle #demoTextFieldFactroy
  14. /* This is how you do inline StyleSheets for TextFields */
  15.             #demoStyle #demoInlineStyleSheet
  16. #00ff00;
  17. #0000ff;
  18. #000000;
  19. #demoShapeStyle
  20. /** Style A TextField **/
  21.  
  22.             // Create a new StyleSheet
  23. // Get a style (Returns an object with properties as strings)
  24. "#demoStyle");
  25.  
  26.             // Trace out the style's properties
  27. "style"// Create a TextField
  28. // Use TextFieldUtility to apply the style to the TextField
  29. // Use TextField like you would normally
  30. "F*CSS - Hello World"/** Merging styles at runtime **/
  31.  
  32.             // You can merge styles on the fly when you call getStyle().
  33.             // Here we merge .TextField with #demoStyle2 to setup a new TF.
  34.  
  35.             // Lets get the 2 styles. Simply pass in any number
  36.             // of style names and separate them with a comma.
  37. ".TextField", "#demoStyle2");
  38.  
  39.             // Trace out the style we just created
  40. "style2 (Merged .TextField + #demoStyle2)"// Create a TextField
  41. // Use TextFieldUtility to apply the style to the TextField
  42. // Use TextField like you would normally
  43. "F*CSS Demo 2 - Hello World"/** Global StyleSheetManager **/
  44.  
  45.             // If you want to make the CSS available globally use the
  46.             // StyleSheetManager/StyleSheetCollection
  47.  
  48.             // Get a reference of the StyleSheetCollection from the StyleSheetManager
  49. // Register style sheet with the Collection.
  50. "defaultSheet");
  51.  
  52.  
  53.             /** How To Use The TextFieldFactory **/
  54.  
  55.             // This assumes you are using the StyleSheetManager. If not, you will have to
  56.             // create a new FStyleSheet, parse css data then pass that into the factory.
  57.  
  58.             // Create a new factory and pass in a reference to a IStyleSheet
  59. // The first param is the id and the second is the calls. It will
  60.             // automatically add # and . to the string to "emulate" how
  61.             // HTML/CSS would work.
  62. "demoTextFieldFactroy", "TextField");
  63.  
  64.             // Use TextField like you would normally
  65. "F*CSS TextFactory - Hello World"/** Add Native StyleSheets To TextField with F*CSS **/
  66.  
  67.             // To use native StyleSheets you simply add the Style names into the
  68.             // F*CSS's StyleSheet param on any F*CSS Style. Check out
  69.             // .demoInlineStyleSheet to see what I am talking about
  70. "demoInlineStyleSheet");
  71.  
  72.             // Use TextField like you would normally
  73. "F*CSS Native StyleSheet - Hello World"/** Style Any Object With StyleApplierUtil **/
  74.  
  75.             // For this demo we are going to create a simple shape
  76.             // then use CSS to position it and change it's dimensions
  77. // Get a Style
  78. "#demoShapeStyle");
  79.  
  80.             // Now you can apply the style to any object, lets use the
  81.             // shape as our target.
  82.  

Link: fcss.flashartofwar.com/