Introducing the RadNumericUpDown Control for Windows Phone 7

While developing the RadControls for Windows Phone 7 QSF we heavily discussed how the screen real estate should be organized so that we can display as much content as possible without losing on the UX front. We have many examples where user input is required which automatically implies increased amount of controls on the example page and thus leading to difficulties when optimally using the screen space.

For instance, our Animation examples allow for adjusting animation parameters to better demonstrate functionality. At the beginning we implemented the input via TextBox elements: we allowed the user to type in the desired value, after that we used to parse the string to double, validate it and update the animation parameter if the input was correct. This quickly proved to be cumbersome in many aspects and thus we had to think of something better to simplify the user input.

We quickly came up with a new control which perfectly found its place in the newborn RadControls for Windows Phone 7 suite: the RadNumericUpDown as shown on the picture below:

The RadNumericUpDown is very simple, yet easily customizable either by providing a new style, or by simply tweaking its properties. It works with double values of any ranges, i.e. you can specify the Change used to increment/decrement the value, an allowed values range, and also customize the appearance of the currently selected value, as shown on the picture below:

Another very interesting feature of the RadNumericUpDown is the ability to fine-tune the behavior of the control when one of the increment/decrement buttons is pressed and hold. By default, the control will periodically increment/decrement the value with an initial time interval of 250 ms. Eventually this interval will be decreased to 50 ms with a step of 20 ms. You can, however, change this behavior by setting the corresponding properties:

• InitialRepeatInterval  - changes the initial repeat interval in milliseconds.
• RepeatIntervalDecrementStep – changes the step in milliseconds used to decrement the initial repeat interval.
• MinimumRepeatInterval – changes the minimum repeat interval. This is the repeat interval in milliseconds which will be achieved if the user holds one of the increment/decrement buttons long enough.

Since it is important to give a hint to the user what exactly they change buy using an input control, the RadNumericUpDown introduces the Header and Suffix properties which can be used to explain the meaning of the edited value to the user:

You will be able to find this control in our next release (CTP2) which is available for you to download from our website. We are eager for your feedback so that we can further polish it to perfection.