Share on Google+Share on Google+

Flex NumericStepper

In this tutorial you can see how to use NumericStepper in flex and what is this.

NumericStepper in Flex:-

NumericStepper is a control in flex which is provide functionality to select a number from an ordered list. It is contain a input text field with a pair of arrows that are opposite direction. Through that pair of arrow user can increase value of NumericStepper to select up arrow and decrease value to select down arrow.

In this tutorial the NumericStepper created with the help of <mx:NumericStepper>tag. After that set value for NumericStepper which is started value that is display in NumericStepper box  and set id  for this control. This control have property which play important role when user use  NumericStepper that property is value and stepSize. The property stepSize  identify how much value increase and decrease value of numeric stepper  and you also set minimum and meximum value for this controls. In this tutorial we can illustrate how to create NumericStepper in flex. and how to use property and how to access of value.


<?xml version="1.0"?>

<mx:Application xmlns:mx="" layout="horizontal">




import mx.controls.Alert;

private function nsValue(event:NumericStepperEvent):void{

nsvalue.text = "Numeric Stepper Current Value is :"+mynstepper.value;

var nextvalue:Number = mynstepper.nextValue;

var previousvalue:Number = mynstepper.previousValue;

nsnvalue.text = "Numeric Stepper Next Value is :"+nextvalue;

nspvalue.text = "Numeric Stepper Previous Value is:"+previousvalue;




<mx:Panel width="400" height="200" horizontalAlign="center" verticalAlign="middle" title="Numeric Stemmer Example">



<mx:Text text="Choose NumericStepper Value :" fontWeight="bold"/>

<mx:NumericStepper id="mynstepper" value="0" stepSize="1" maximum="100" change="nsValue(event)"/>


<mx:Text id="nsvalue"/>

<mx:Text id="nspvalue"/>

<mx:Text id="nsnvalue"/>




In this example you can see how to find next and previous value of NumericStepper. Output is-






Posted on: April 2, 2010 If you enjoyed this post then why not add us on Google+? Add us to your Circles

Share this Tutorial Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.