In diesem Beispiel wird gezeigt, wie ein DataGrid dynamisch erstellt und seine Ereignisse überwacht werden können.
Gehen Sie wie folgt vor, um das Beispiel auszuführen:
- Fügen Sie die DataGrid-, Button-, Label- und TextArea-Komponenten der Bibliothek hinzu.
- Speichern Sie diesen Code als "StyleManagerExample.as" im gleichen Verzeichnis wie die FLA-Datei.
- Legen Sie in der FLA-Datei die Dokumentklasse "StyleManagerExample" fest.
package
{
import fl.controls.Button;
import fl.controls.DataGrid;
import fl.controls.Label;
import fl.controls.TextArea;
import fl.core.UIComponent;
import fl.managers.FocusManager;
import fl.managers.StyleManager;
import flash.display.InteractiveObject;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.TextFormat;
public class StyleManagerExample extends Sprite
{
private var btn:Button;
private var ta1:TextArea;
private var ta2:TextArea;
private var ta3:TextArea;
private var ta4:TextArea;
private var description:Label;
private var dg:DataGrid;
private var formatForInstance:TextFormat;
private var formatForGlobal:TextFormat;
private var testStringHTML:String = "<body><span class='heading'>Hello </span>World...</body>";
private var testString:String = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce vitae turpis id nibh suscipit tincidunt. Quisque nulla dui, elementum eget, rutrum in, ultricies nec, erat. Donec ante turpis, lacinia eget, semper ac, consequat eget, neque. Maecenas eleifend pharetra quam. Quisque suscipit nibh a ipsum. Donec sit amet mi eu ligula volutpat imperdiet. Ut quis velit quis lectus laoreet eleifend. Aliquam pulvinar lorem. Cras ultrices felis sit amet urna. Cras viverra porttitor est. Nulla justo. Sed scelerisque."
public function StyleManagerExample() {
setupComponents();
setupUI();
setupStyles();
}
private function setupUI():void {
var setInstanceStyleBtn:Button = new Button();
var clearInstanceStyleBtn:Button = new Button();
var setClassStyleBtn:Button = new Button();
var clearClassStyleBtn:Button = new Button();
var setGlobalStyleBtn:Button = new Button();
var clearGlobalStyleBtn:Button = new Button();
setInstanceStyleBtn.label = "Set Instance Style";
clearInstanceStyleBtn.label = "Clear Instance Style";
setClassStyleBtn.label = "Set Class Style";
clearClassStyleBtn.label = "Clear Class Style";
setGlobalStyleBtn.label = "Set Global Style";
clearGlobalStyleBtn.label = "Clear Global Style";
setInstanceStyleBtn.focusEnabled = false;
clearInstanceStyleBtn.focusEnabled = false;
setClassStyleBtn.focusEnabled = false;
clearClassStyleBtn.focusEnabled = false;
setGlobalStyleBtn.focusEnabled = false;
clearGlobalStyleBtn.focusEnabled = false;
setInstanceStyleBtn.move(10,310);
clearInstanceStyleBtn.move(10,340);
setClassStyleBtn.move(140,310);
clearClassStyleBtn.move(140,340);
setGlobalStyleBtn.move(270,310);
clearGlobalStyleBtn.move(270,340);
setInstanceStyleBtn.setSize(120,24);
clearInstanceStyleBtn.setSize(120,24);
setClassStyleBtn.setSize(120,24);
clearClassStyleBtn.setSize(120,24);
setGlobalStyleBtn.setSize(120,24);
clearGlobalStyleBtn.setSize(120,24);
setInstanceStyleBtn.addEventListener(MouseEvent.CLICK,setInstanceStyle);
clearInstanceStyleBtn.addEventListener(MouseEvent.CLICK,clearInstanceStyle);
setClassStyleBtn.addEventListener(MouseEvent.CLICK,setClassStyle);
clearClassStyleBtn.addEventListener(MouseEvent.CLICK,clearClassStyle);
setGlobalStyleBtn.addEventListener(MouseEvent.CLICK,setGlobalStyle);
clearGlobalStyleBtn.addEventListener(MouseEvent.CLICK,clearGlobalStyle);
description = new Label();
description.move(10, 370);
description.autoSize = TextFieldAutoSize.LEFT;
description.text = "";
addChild(setInstanceStyleBtn);
addChild(clearInstanceStyleBtn);
addChild(setClassStyleBtn);
addChild(clearClassStyleBtn);
addChild(setGlobalStyleBtn);
addChild(clearGlobalStyleBtn);
addChild(description);
}
private function setupComponents():void {
dg = new DataGrid();
dg.addItem( { Name:"John Alpha", Number:"555-123-0101" } );
dg.addItem( { Name:"Mary Bravo", Number:"555-372-3322" } );
dg.addItem( { Name:"Trevor Gamma", Number:"555-485-1212" } );
dg.addItem( { Name:"Susan Delta", Number:"555-987-3434" } );
dg.move(10,10);
dg.setSize(200,290);
dg.columns = ["Name","Number"];
addChild(dg);
ta1 = new TextArea();
ta1.move(220,10);
ta1.setSize(150,140);
ta1.text = testString;
ta1.tabEnabled = true;
addChild(ta1);
ta2 = new TextArea();
ta2.move(380,10);
ta2.setSize(150,140);
ta2.text = testString;
ta2.tabEnabled = true;
addChild(ta2);
ta3 = new TextArea();
ta3.move(220,160);
ta3.setSize(150,140);
ta3.text = testString;
ta3.tabEnabled = true;
addChild(ta3);
ta4 = new TextArea();
ta4.move(380,160);
ta4.setSize(150,140);
ta4.text = testString;
ta4.tabEnabled = true;
addChild(ta4);
}
private function setupStyles():void {
formatForGlobal = new TextFormat();
formatForGlobal.font = "Georgia";
formatForGlobal.size = 10;
formatForInstance = new TextFormat();
formatForInstance.underline = true;
}
private function setInstanceStyle(e:MouseEvent):void {
var fm:FocusManager = new FocusManager(this);
var uiComponent:UIComponent = fm.getFocus() as UIComponent;
if(uiComponent is TextArea) {
uiComponent.setStyle("textFormat",formatForInstance);
description.text = "The TextArea object with focus is now underlined.";
}
}
private function clearInstanceStyle(e:MouseEvent):void {
var fm:FocusManager = new FocusManager(this);
var uiComponent:UIComponent = fm.getFocus() as UIComponent;
if(uiComponent is TextArea) {
uiComponent.clearStyle("textFormat");
description.text = "The TextArea object with focus is no longer underlined.";
}
}
private function setClassStyle(e:MouseEvent):void {
var c:Class = TextArea;
var styleName:String = "textPadding";
var value:Number = 10;
StyleManager.setComponentStyle(c,styleName,value);
description.text = "Padding for all TextArea instances is now 10.";
}
private function clearClassStyle(e:MouseEvent):void {
var styleName:String = "textPadding";
var c:Class = TextArea;
StyleManager.clearComponentStyle(c,styleName);
description.text = "TextArea padding has been reset to the default.";
}
private function setGlobalStyle(e:MouseEvent):void {
var styleName:String = "textFormat";
var value:Object = formatForGlobal;
StyleManager.setStyle(styleName,value);
description.text = "All components now use font Georgia size 10.";
}
private function clearGlobalStyle(e:MouseEvent):void {
var styleName:String = "textFormat";
StyleManager.clearStyle(styleName);
description.text = "Font style for all components has been cleared.";
}
}
}