Flex 4: Having slider and textbox combo
On a flex project, I have a slider and text box on a form whereby I seek user input using either the slider(for ease) or the textinput(for precise numbers). Based on user input on either of these, I update the other via a listener attached, that calls the relevant functions
slider.addEventListener("change",sliderUpdate);
textIn.addEventListener("change",valueUpdate);
I am having problems with the textinput in that, it doesn't allow me to key in a decimal number- this is probably happening as I have a listener that is incrementing the slider for every keystroke in textinput and hence unable to accept a ".". e.g. .05, .1, .00003
How do I get around this- can i hold 开发者_Go百科the textinput listener to holdoff till I can press an enter to indicate I am done?
This works for me:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<fx:Script>
<![CDATA[
import spark.events.TextOperationEvent;
protected function sliderUpdate(event:Event):void
{
textIn.text=slider.value.toString();
}
protected function valueUpdate(event:TextOperationEvent):void
{
slider.value=Number(textIn.text);
}
]]>
</fx:Script>
<s:HSlider id="slider" x="10" y="106" width="308" change="sliderUpdate(event)" maximum="100.0" minimum="0.0" stepSize="0.01"/>
<s:TextInput id="textIn" x="10" y="76" width="87" change="valueUpdate(event)" text="0"/>
</s:Application>
The slider's step value is 0.01; If you input a value in the text field the slider should automatically update.
EDIT:
Then on the TextInput you should listen for the keyDown event (KeyboardEvent.KEY_DOWN) and the function should check if the key pressed is ENTER and then update the slider:
<s:TextInput id="textIn" x="10" y="76" width="87" keyDown="textIn_keyDownHandler(event)" text="0"/>
The function:
protected function textIn_keyDownHandler(event:KeyboardEvent):void
{
if (event.keyCode == Keyboard.ENTER)
{
slider.value=Number(textIn.text);
}
}
If you prefer to use addEventListener the this should do it:
textIn.addEventListener(KeyboardEvent.KEY_DOWN, textIn_keyDownHandler);
精彩评论