当数字步进器的值超出范围时显示错误

Question

当我为数字步进器设置最大值和最小值时，仍然可以输入超出该范围的数字。但如果输入的数字大于此值，它会自动获得最大值。我怎样才能显示这种情况下的错误，但仍然保持最大值和最小值？

Answer 1

当用户打ENTER从的text input键或focus out的NumericStepper你可以把你的逻辑来检查，如果输入的号码是在以下范围内：

<?xml version="1.0"?> 
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark"> 
<fx:Script><![CDATA[ 
    import mx.controls.Alert; 

    private var isProcessRequiredOnFocusOut:Boolean = true; 

    private function addEventListeners():void { 
     numericStepper.addEventListener(KeyboardEvent.KEY_DOWN, checkRange, true); 
     numericStepper.addEventListener(FocusEvent.FOCUS_OUT, checkRange, true); 
    } 

    private function checkRange(event:Event):void { 
     if (event is KeyboardEvent && (event as KeyboardEvent).keyCode == Keyboard.ENTER) { 
      isProcessRequiredOnFocusOut = false; 
      processRangeCheck(); 
     } 
     else if (event is FocusEvent && (event as FocusEvent).type == FocusEvent.FOCUS_OUT 
       && isProcessRequiredOnFocusOut) { 
      processRangeCheck(); 
     } 
    } 

    private function processRangeCheck():void { 
     var typedNumber:Number = Number(numericStepper.textDisplay.text); 
     if (typedNumber > numericStepper.maximum || typedNumber < numericStepper.minimum) { 
      Alert.show("The typed number " + typedNumber + " is out of range.", "Out of Range Warning"); 
     } 
     isProcessRequiredOnFocusOut = true; 
    } 
    ]]></fx:Script> 
<s:Panel title="Show Error message when Typed Number is out of range in Numeric Stepper." 
      verticalCenter="0" horizontalCenter="0"> 
    <s:VGroup paddingTop="10" paddingLeft="10" 
       paddingRight="10" paddingBottom="10" 
       horizontalAlign="center" 
       width="100%"> 
     <s:Label text="The valid range of Numeric Stepper is 10-20."/> 
     <s:NumericStepper id="numericStepper" 
          minimum="10" 
          maximum="20" 
          creationComplete="addEventListeners()"/> 
     <s:Button label="Click here to focus out from the Text Input of Numeric Stepper."/> 
    </s:VGroup> 
</s:Panel> 
</s:Application> 

Answer 2

好，以直观的方式检查对最大和NumericStepper组件-while仍然得到进入它的最低值输入的数值，将听取KEY_UP键盘事件的textField财产在NumericStepper实例：

import fl.controls.NumericStepper; 
import flash.events.KeyboardEvent; 

var numericStepper:NumericStepper = new NumericStepper(); 
numericStepper.maximum = 250; 
numericStepper.minimum = 3; 

numericStepper.textField.addEventListener(KeyboardEvent.KEY_UP, function(e:Event):void { 
    var n:Number = Number(numericStepper.textField.text); 
    if (n > numericStepper.maximum || n < numericStepper.minimum) { 
     trace("Error: Out of Range!"); 
    } 
}); 
addChild(numericStepper); 

Answer 3

使用mx_internal属性是指当NumericStepper

的inputField 10