继承FormItem实例

/*******FromItemWithButton 类*******/

//自定义事件
[Event(name="doSomething", type="flash.events.Event")]

//定义样式，将css文件中的newButtonSkin样式应用到此自定义组件中
[Style(name="newButtonSkin", type="Class")]
public class FromItemWithButton extends FormItem{
    private var newButtonSkin:Class;
    private var newButton:Button;
    private var _newButtonLabel:String;
    private var _newButtonWidth:int = 40;
    private var _newButtonHeight:int = 25;
    private var _newButtonSpace:int = 10;
    public function FromItemWithButton(){
        super();
    }

    public function set newButtonLabel(value:String):void{
        _newButtonLabel = value;
    }

    public function set newButtonWidth(value:String):void{
        _newButtonWidth = value;
    }

    public function set newButtonHeight(value:String):void{
        _newButtonHeight = value;
    }

    //设置按钮与formitem内的控件（如textInput）之间的间距
    public function set newButtonSpace(value:String):void{
        _newButtonSpace = value;
    }

    private function doDispatch(event:Event):void{
        this.dispatchEvent(new Event("doSomething"));
    }

    override protected function createChildren():void{
        super.createChildren();
        newButton = new Button();

        //skin类定义在css文件中。
        newButtonSkin = getStyle("newButtonSkin");
        newButton.setstyle("upSkin",newButtonSkin);
        newButton.setstyle("downSkin",newButtonSkin);
        newButton.setstyle("overSkin",newButtonSkin);

        newButton.width = _newButtonWidth;
        newButton.height=_newButtonHeight;
        newButton.label = _newButtonLabel;

        newButton.addEventListener(MouseEvent.Click, doDispatch);

        rawChildren.addChild(newButton);     //作为一个非内容子项添加
    }

    //调整按钮的位置，显示在formItem的最右边
    override protected function updateDisplayList(unscaleWidth:Number,unscaleHeight:Nuber):void{
        //计算加上新加的按钮的formItem宽度，并列新父的宽
        var containerWidth:int = _newButtonWidth + unscaleWidth + _newButtonSpace;
        super.updateDisplayList(containerWidth,unscaleHeight);
       
        //取得应放置按钮的xy座标
        var xPos:int = containerWidth = _newButtonWidth;
        var yPos:int = 0;

        //此时不能用xPos、yPos赋值给newButton的xy座标，应该用newButton的move方法
        newButton.move(xPos,yPos);
    }
}

 

/****在MXML中调用FormItemWithButton ****/
<comp:FormItemWithButton label="username"
    newButtonLabel="help"
    newButtonHeight="50"
    newButtonWidth="70"
    styleName="formItemButton"
    doSomething="doSomeHandler()">
</comp:FormItemWithButton>

 

 

/*****css定义******/
.formItemButton:{
    newButtonSkin: ClassRefrence("skins.RoundedButtonSkin"); //ActionScript类
}