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

ercv8c1e  于 2022-11-01  发布在  Apache
关注(0)|答案(3)|浏览(122)

当我为数字步进器设置最大值和最小值时,我仍然可以输入超出该范围的数字。但如果我输入的数字大于该范围,它会自动接收最大值。我如何显示这种情况下的错误,但仍然保持设置的最大值和最小值?

w8ntj3qf

w8ntj3qf1#

当用户按下ENTER键或NumericSteppertext input中的focus out时,您可以使用逻辑检查输入的数字是否在以下范围内:

<?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>
yr9zkbsy

yr9zkbsy2#

要根据NumericStepper组件的 maximumminimum 值检查输入的值,有一种直观的方法, -在输入时,可以在NumericStepper示例的textField属性上侦听KEY_UP的键盘事件:

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);
vhmi4jdf

vhmi4jdf3#

使用mx_internal属性引用NumericStepper的inputField

numericStepper.maximum = 250;
        numericStepper.minimum = 3;

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

相关问题