08 September, 2010

WP7: How to force numeric keyboard

When you have a textbox that you wish to allow the User to enter values into; do so in an intuitive and nice way. Keyboard presses on a phone should in general be avoided as much as possible, hence when ever you are forced to display a keyboard – show the right keyboard as the first option! Your users will definitely love you for it!

On a WP7 phone, 2 keyboards are possible. The default (left) and the numeric (right):
Update: More than 2 exists! I've so far counted 8!

Default keyboard Numeric keyboard

So - how does one force the numeric keyboard? Here comes in the InputScope attribute to the rescue.

In XAML (verbose version) it looks like this:
<TextBox Height="72"HorizontalAlignment="Left"Margin="186,46,0,0"x:Name="tbxPrice"VerticalAlignment="Top"Width="244">
<
TextBox.InputScope>
<
InputScope>
<
InputScopeName NameValue="CurrencyAmount"/>
</
InputScope>
</
TextBox.InputScope>
</
TextBox>

And the non-verbose XAML version looks like this:
<TextBox Height="72" HorizontalAlignment="Left" Margin="186,46,0,0" x:Name="tbxPrice" VerticalAlignment="Top" Width="244" InputScope="CurrencyAmount"/>

It will make the Numeric keyboard pop up when ever the textbox is entered.
Details can be found here: http://msdn.microsoft.com/en-us/library/ff626520(VS.92).aspx

Another (better) info is found here: http://msdn.microsoft.com/en-us/library/system.windows.input.inputscopenamevalue%28VS.96%29.aspx

Technorati Tags:

1 comment:

Bernd said...

Great! Wonderful! Thank you!
Works fine with just adding
InputScope="CurrencyAmount"