0 Replies Latest reply on Feb 28, 2008 5:08 PM by Xopods

    Keyboard events question

    Xopods
      Hi everyone... I have a newbie question. I'm working on my first real Flex app, which will allow people to view and solve my crossword puzzles interactively on my website instead of just downloading and printing a PDF. It's been coming along well so far... it reads the clues and answers in XML format, automatically generates the grid, and when you click in the grid it selects the whole word and displays the clue. Now I need to allow people to type in their answers and have it check them.

      Thing is, I want people to be able to type into the grid directly, rather than in a text box. For one thing, it looks nicer and more professional. For another, it means the checked letters (ones from orthogonal clues that have already been solved) will already be there. Each box in the grid is a separate object (a custom component called LetterBox, with functionality to hide/reveal the letter, contain the clue number in the top left for numbered boxes, know which word(s) it's a part of, etc.).

      The way I planned on handling it is that when you have a word selected in the grid, it highlights the whole word in light green and the first box in a darker green, and listens for your keystrokes. When you hit a letter, it will appear in the first box, and the dark green highlight will move to the next box, and so on. When you've finished typing your answer, you hit return/enter and it checks it for you.

      The trouble is that, although my Grid object has no problem using a MouseEvent listener, it doesn't seem to respond to a KeyboardEvent at all. That is, something like:

      mainGrid.addEventListener(MouseEvent.CLICK, clickDetected);

      and

      function clickDetected(ev:MouseEvent):void {
      testBox.text = "Click detected!";
      }

      ...works fine, but...

      mainGrid.addEventListener(KeyboardEvent.KEY_DOWN, keyDetected);

      and

      function keyDetected(ev:KeyboardEvent):void {
      testBox.text = "Key detected!";
      }

      ...doesn't do anything at all.

      I tried adding the same kind of code to a TextInput object, and it did work, so I guess the problem is that Grid objects aren't typically supposed to respond to keyboard input. I tried mainGrid.setFocus() in the mouse-click handling code, thinking that might get it to listen once a word had been selected, but it still doesn't work.

      The next thing I tried was to listen for keystrokes globally. The documentation seems to say you can add a listener to stage from your Application, so in my app's creationComplete routine I did:

      stage.addEventListener(KeyboardEvent.KEY_DOWN,keyDetected);

      and

      function keyDetected(ev:KeyboardEvent):void {
      mainGrid.keyPress(ev.charCode);
      }

      ...and a keyPress function on the grid that accepts an integer argument... but still no response.

      What's going on, and how to I make it do what I want?