Windows XP Media Center Edition SDK Using Soft Keyboard Mode
.jpg) |
| Previous | Next |
Using Soft Keyboard Mode
The example in this topic shows how to create an instance of the Triple-tap/Soft-keyboard control in the soft keyboard mode. It uses the HTML OBJECT element to create the control, and puts the control in soft keyboard mode by using a PARAM element to set the control's InputMode property to a value of 2 for soft keyboard. The example uses a number of other PARAM elements to customize the appearance of the control. Parameters that begin with "Input" set the appearance of the text input box on the control. Parameters with names that begin with "KB" set the appearance of the buttons on the soft keyboard.
The following illustration shows the Triple-tap/Soft-keyboard in soft keyboard mode.
.gif)
When the control is in soft keyboard mode, making it focusable with the remote control requires several steps. When the control receives the focus, you must anticipate which particular key on the soft keyboard should receive the focus, based on the direction from which the user has navigated to the control. When the user navigates away from the control to a button on your HTML page, you must anticipate which button should get the focus based on the key that the user navigated away from and, if the user navigated from one of the keys in the corner of the control, on which arrow button the user pressed on the remote control.
There are several ways to make the control focusable. The following steps describe a method that uses JScript code.
Create a container element and place the control inside the element. Make this element focusable by using the remote control. For more information, see Making Buttons and Other Elements Focusable.
When the focus moves to the container element, call a function named useKeypad (or something similar), and pass as an argument the ID of the button from which the user navigated. For example:
useKeypad(Button3)
Ensure that the focus is going to land on the correct soft keyboard key, based on the button from which the user navigated. In your useKeypad function, create a switch that evaluates button ID argument and determines the index of the key that should receive the focus. Use the HtmlInput.SetKBFocus method to move the focus to that key:
function useKeypad(prevBtn) { // The following variable holds the index of a key on the soft // keyboard. Each key has a predefined index. var targetKey// Create a case for each button on your page, and then assign a // target key on the soft keyboard for each button. switch (prevBtn) { // Suppose Button2 is directly to the right of the N key on the // soft keyboard. If Button6 has the focus and the user presses the // left arrow, the focus should go to the soft keyboard and then to // the N key. The index for the N key is 13. case Button2: targetKey = 13 break;
// Create one case for every button from which the user can // navigate to the soft keyboard, and target the most appropriate // key for each button. case Button4: targetKey = 13 break;
case Button5: targetKey = 20 break;
case Button6: targetKey = 20 break;
// Put additional case statements here.
}
// Move the focus to the soft keyboard and then to the correct // key. myControl.SetKBFocus(targetKey)
}
After making the keyboard focusable, the next task is to enable the focus to return gracefully to the buttons on your HTML page. To determine which button should receive the focus, you must first identify the soft keyboard key from which the user is navigating away. For example, if the user is navigating from a key on the right side of the soft keyboard, the focus should land on the nearest button to the right of the soft keyboard. When the user navigates off the edge of the soft keyboard (that is, uses the remote control arrow keys to navigate to a button at the edge of the soft keyboard and then presses the same arrow button one more time), the control generates the HtmlInput.FocusOutEvnt event. If your application includes a handler for this event, the handler receives two arguments. The first is the index of the key from which the user is navigating, and the second is the key code of the remote control arrow key that the user pressed to cause the navigation. Start by writing script to capture the FocusOutEvnt event, and implementing a event handler function that receives the key index and key code arguments. For example:
<script language="javascript" for="HtmlInput" event="FocusOutEvnt(KeyIndex, KeyCode)"> LeaveKeyboard(KeyIndex, KeyCode) </script>
Create a variable to represent the button on your page that should receive the focus. Next, create a switch statement that evaluates the key indices. The switch should include a case statement for each key at the perimeter of the soft keyboard (the user cannot navigate away from the control from the middle keys), skipping any keys that do not need to be connected through navigation to a button on the HTML page. For a list of index values for each soft keyboard key, see Supporting Multiple Languages.
switch (KeyIndex) { case 6: // G key nNextBtn = Button2 break; case 13: // N key nNextBtn = Button2 break; case 20: // U key nNextBtn = Button3 break; case 27: // 2 key nNextBtn = Button4 break; case 34: // 9 key nNextBtn = Button4 break;// Place additional case statements here.
}
For corner keys, your handler for the FocusOutEvnt event must check the key code argument to identify the remote control arrow button that the user pressed. The following table shows the key codes for the arrow buttons:
Key code Arrow button 0x25 Left arrow 0x26 Up arrow 0x27 Right arrow 0x28 Down arrow For example, if the user navigates from the key in the upper-right corner, you may want to set the focus to different buttons depending on whether the user pressed the up arrow or the left arrow. The following code shows a case statement that does this:
case 52: // upper right if (KeyCode == 0X25) { nNextButton = Button2 } else { nNextButton = Button1 } break;
Not all soft keyboard keys need to have a corresponding button on the HTML page. For example, if the control is on the left side of a page and the user presses the left arrow button to navigate off the left edge of the control, there is no button on the left to receive the focus. In this case, move the focus back onto the control, as follows:
if (nNextBtn == null) { // Index of soft keyboard key that is losing the focus. targetKey = KeyIndex; // Place the focus back on the target key. Use the application- // defined setTimeout method to ensure that the focus moves back to // the target key after the focus leaves the control. setTimeout("myControl.SetKBFocus(targetKey)",1); return }Move the focus to the button specified by the nNextButton parameter by calling whatever script your application uses to move the focus among the buttons on your HTML.
The Triple-tap/Soft-keyboard control receives the focus automatically when the HTML page that contains the control is loaded. If you need to set the initial focus to some other item, you can use a handler for the control's onfocus event to call a function that gives the focus back to the page, but only for the first time that the control gets focus. To receive the onfocus event, assign a handler for the event in the OBJECT element used to create the control (for example, onfocus=checkObjFocus()). The following example shows how to implement the event handler.
See Also
| Previous | Next |