在用Flex开发时,经常遇到TextInput只允许输入数值的情况,如果只是少量的输入框还好处理,在输入框多了之后总觉得麻烦。为了解决这个问题,我在TextInput的基础上扩展,做了个简单的数值输入控件——NumberInput。
1.只允许输入数字
2.当数值发生变化时自动格式化
3.加入了value属性,省去了String转Number的麻烦
<!--NumberInput.mxml--> <?xml version="1.0" encoding="utf-8"?> <mx:TextInput xmlns:mx="http://www.adobe.com/2006/mxml" text="0.0" textAlign="right" restrict="0-9" change="changeHandler()" borderStyle="solid"> <mx:Script> <![CDATA[ private var _value:Number; public function get value():Number{ return this._value; } public function set value(_value:Number):void{ this.text = nf.format(_value); this._value = Number(this.text.replace(/,/g, "")); } protected function changeHandler():void { this.text = nf.format(this.text); _value = Number(this.text.replace(/,/g, "")); } ]]> </mx:Script> <mx:NumberFormatter id="nf" precision="2" /> </mx:TextInput>