On Windows Phone devices, with the absence of physical keyboard, you probably would have guessed that we have to interact with the device using on-screen keyboard. SIP or Soft Input Panel is the name given for Windows Phone’s on-screen keyboard. One of the common scenarios in which SIP will appear is when we interact with a TextBox.
A standard SIP layout is QWERTY panel with alphabets as the main display. To view the numbers, we press the digit button on the lower left corner of the keyboard. But there may be certain scenarios in which you’d want the SIP to only display numbers when users use it to input a value. This can also be a mechanism to prevent invalid user inputs.
Such configuration can be easily done using LayoutOptions property for SIP. The supported layouts are: Default, Text, Digits, Web, and Email Address. Each of the layouts has its own unique characteristic. Text for example, has a similar layout to the default layout but with the addition of autocorrect and text suggestion features.
To learn about this, let’s follow the steps below:
1. If you continue from the previously made project, then add a page to learn about SIP Layout. Otherwise, create a new project for this purpose. Having been doing exercises up to this page, it should be fairly easy to do. The following example uses a previously existing project. Right click on the project, Add New Item, select Windows Phone Portrait Page and rename the file, in this example SIPLayout.xaml then select Add.
2. Add two buttons and a TextBox.
For this example, if the first button is pressed, it will show the Text layout, while pressing the second button will show the Email layout.
3. Double click on the first button and type in the following code:
4. Double click on the second button and type in the following code:
5. Press F5 to see results.
Click on the TextBox first to see the Default layout. Then click on the first button then click on the TextBox again. Now your keyboard shows the Text layout. When you type in ‘Fr’ for example, several word suggestions that you can pick from will appear. Now click on the second button and click the TextBox again. Although there aren’t any significant differences, now on the bottom part of the keyboard you can see two additional characters, which are @ and .com that we often use to input email addresses.
6. Other than using code, keyboard layout can also be configured directly with XAML in TextBox control. Observe the following code:
7. Press F5 for results. Click on the TextBox and now the SIP layout will display the number panels as its main display.
Using SIP Layout we can freely configure keyboard display. This should be used to our advantage. A better implementation of this feature will give the application a more professional feel to it, don’t you think?
