Today I added sound and cursor movement to my log-in screen.
First, I modified the _boxPositions array in my LogIn scene:
Now each input box has four additional numbers besides x and y coordinates: lft, rgt, up, and dwn. These each indicate to which index the cursor (ie: Focus) is to move if the user hits the respective arrow key (or tab button). For example: in the third array element, for box #2 we have x=180, y=100, then lft=1 (the cursor/focus will move to element #1 when the user presses left arrow), rgt=3 (the cursor/focus will move to element #3 when the user presses right arrow), up and down both =2 (the cursor will stay on element #2 if the user presses up or down arrow).
From now on when I add additional input boxes/configurations I can direct the cursor/focus to move logically within that new pattern.
Second, I added the "if" statements within the keyDown handler to (1) move the cursor around, (2) set the correct letter or number (if pressed), and initiate the appropriate sound (a key press click or an error sound).
Line 160 tests to see if a legitimate letter was pressed.
Line 162 sets the current box's letter to match the key pressed.
Line 163 to 165 moves the focus/cursor forward to the next box.
Line 166 dispatches the "keyPressSound" event which triggers the application class (main class) event "makeKeyPressSound" to make the appropriate sound. (next image)
Above you can see the three main sounds that are in the application class. (one sound is a standard keypress. One sound is a higher pitched key press for numbers. The third sound is a quick error sound for when the user presses an incompatible key.) The sounds were embedded earlier in the application class.
Time: 3 hours
No comments:
Post a Comment