Stylekit is a CSS3 parser and rendering engine intended for use in AS3 applications that provide a customizable user interface design.
The stated design goals of Stylekit are:
- Provide parsing and support for a broad range of CSS3 properties including transitions and animations
- Provide an unopinionated tree-like structure for UI elements that may be queried using CSS3 selectors
- Provide basic UI elements that may be composed to produce bespoke UI elements with more advanced functionality.
- Avoid non-standard CSS declarations. CSS written for Stylekit should work just as well in the browser.
Some features:
- Block-level box model including floats, borders, margins, padding and alignment
- Static, absolute and relative positioning
- Image backgrounds using http or data URIs
- Opacity
- [With glitches/issues] CSS3 Transitions
Sample
package org.myapplication { import org.stylekit.css.parse.StyleSheetParser; import org.stylekit.css.StyleSheet; import org.stylekit.ui.BaseUI; import org.stylekit.ui.element.UIElement; public class MyUI extends Sprite { protected var _baseUI:BaseUI; protected var _sampleWrapperElement:UIElement; protected var _sampleChildElement:UIElement; public function MyUI() { // Create the BaseUI and add it to the stage. // The BaseUI is the top-level StyleKit UI class and is analogous to the Document // object in an HTML application. this._baseUI = new Base(); this.addChild(this._baseUI); // Create a couple of sample elements this._sampleWrapperElement = new UIElement(this._baseUI); this._sampleWrapperElement.elementId = "wrapper"; this._sampleChildElement = new UIElement(this._baseUI); this._sampleChildElement.addElementClassName("child"); // Add the elements to the UI this._baseUI.addElement(this._sampleWrapperElement); this._sampleWrapperElement.addElement(this._sampleChildElement); // Now we can style it! var css:String = "#wrapper { width: 50px; height: 50px; background: red; } #wrapper .child { width: 25px; height: 25px; background: blue; }"; var parser:StyleSheetParser = new StyleSheetParser(); var cssParsed:StyleSheet = parser.parse(css); this._baseUI.styleSheetCollection.addStyleSheet(cssParsed); } } }
[…] http://www.as3gamegears.com/ui/stylekit/ […]