How to Scope Input in Your Windows Phone Application

Introduction

While today’s mobile devices have
processing power comparable to some desktops, it lags on one front – screen
real estate. Physical keyboards now no longer in vogue, the touch screen keyboard
has become the norm.

Since touch based keyboards have
to compete for screen real estate, it makes sense to have the keyboard render
only those keys which are applicable for the input.

Fortunately, like other popular mobile
operating systems, Windows Phone
allows input scoping.

Input scoping can be achieved by
adding the tag InputScope to your control.

For example, if we have a TextBox
control where you only want to have numbers as input, you will tag your control
as shown below.

<TextBox InputScope="Number" Name="txtCellPhone" />

Alternately, you can also specify
the input scope via code.

Here is how you can do it via
code.

TextBox txtCellPhone;

InputScope scope = new InputScope();

InputScopeName scopeName = new InputScopeName();

scopeName.NameValue = InputScopeNameValue.Number;

scope.Names.Add(scopeName);

txtCellPhone.InputScope = scope;

To see how you can leverage this
feature in your Windows Phone application, let’s walk through a sample
application where we will have our input scoped.

Hand-On

Create a Windows Phone
application called WindowsPhoneInputScopeDemo.

Add a Textbox control to the
MainPage. Let’s call it txtBoxCellPhone.

Open the XAML for
MainPage and change the XAML for txtBoxCellPhone as shown below.

<TextBox InputScope="Number" B Height="72" HorizontalAlignment="Left" Margin="9,96,0,0" Name="txtBoxCellPhone" Text="TextBox" VerticalAlignment="Top" Width="426" />

When you run your application, you’ll get the following screen.

Input Scoping
Figure 1: Input Scoping

However, as soon as you focus on
the textbox, the contextual keyboard will appear:

Windows Phone contextual keyboard
Figure 2: Windows Phone contextual keyboard

You will notice that the
contextual keyboard only has numeric input. Hence, users are not prompted with
irrelevant keys (alphabets), thereby making the application more user-friendly.

Note that TextBox control in
Windows Phone supports various input scopes, which determine the keyboard
layout for the input panel.

Let’s look at how the input scope
panel looks for various scopes.

Scope: URL

Notice that for URL inputs, we
get the full alphabet keys, as well as .com key.

Windows Phone Input Scoping
Figure 3: Windows Phone Input Scoping: URL

Scope: Text

Text scope has autocorrect and
text suggestions.

Windows Phone Input Scoping
Figure 4: Windows Phone Input Scoping: Text

Application developers can look
at the MSDN
page for InputScopeNameValue enumeration
to see the full range of input
scoping available on Windows Phone.

Summary

In this article, we saw how to
set input scoping in a Windows Phone application. I hope you have found this
information useful.

More by Author

Get the Free Newsletter!

Subscribe to Developer Insider for top news, trends & analysis

Must Read