Inline TextField


By Richard Leggett.  Download the source here

This script allows the user to enter text with T9 (non-predictive) text input, you don't need to give focus to the textfield. For example: pressing the 2 key will cycle through "a", "b", "c", "2" and wait a sec for it to advance to the next letter in the string. 

Set myInlineField.setFocus(true); to activate user input.

import mx.utils.Delegate;

/**
 * Simple inline TextField class
 * TODO : - Finish support for different input modes
 *        - Deal with left/right arrows, backspace etc
 *        - Deal with Focus in a more intuitive way, (test on handset)
 *        - Show focus with a focus rect
 * @author Richard Leggett
 */
 
class InlineTextField extends MovieClip
{
 public static var ALPHA:String = "alpha";
 public static var NUMERIC:String = "numeric";
 public static var ALPHA_NUMERIC:String = "alphaNumeric";
 public static var CHAR_CHANGE_TIMEOUT:Number = 1500; // ms
 
 public var inputMode:String = ALPHA_NUMERIC;
  
 private var __labelField:TextField;
 private var __arrowMC:MovieClip;
 private var __inputModeMC:MovieClip;
 
 private var __hasFocus:Boolean = false;
 private var __charIndex:Number = 0;
 private var __enteringChar:Boolean = false;
 private var __upperCase:Boolean = false;
 private var __previousKey:String = "";
 private var __deleteKey:Number = Key.LEFT;
 private var __caseKey:Number = 42; // * key
 private var __timeoutInterval:Number = null;
 private var __keys:Object =  {_1:49, _2:50, _3:51, _4:52, _5:53,
          _6:54, _7:55, _8:56, _9:57, _0:48};
 private var __chars:Object = {_1:[".",",","1"],
          _2:["a","b","c","2"],
          _3:["d","e","f","3"],
          _4:["g","h","i","4"],
          _5:["j","k","l","5"],
          _6:["m","n","o","6"],
          _7:["p","q","r","s","7"],
          _8:["t","u","v","8"],
          _9:["w","x","y","z","9"],
          _0:[" ","_","0"] };
 
 /**
  *
  */
 public function set upperCase(toggleUpper:Boolean)
 {
  __upperCase = toggleUpper;
  
  if(__upperCase) __inputModeMC.gotoAndStop("alphaNumericUpper");
  else __inputModeMC.gotoAndStop("alphaNumeric");
 }
 
 /**
  *
  */
 public function get upperCase() : Boolean
 {
  return __upperCase;
 }
 
 /**
  *
  */
 public function InlineTextField ()
 {
  var kl:Object = new Object();
  kl.onKeyDown = Delegate.create(this, onKeyPress);
  Key.addListener(kl);
 }
 
 
 /**
  *
  */
 public function setFocus (toggleFocus:Boolean) : Void
 {
  __hasFocus = toggleFocus;
 }
 
 
 /**
  *
  */
 public function setDeleteKey(keyCode:Number) : Void
 {
  __deleteKey = keyCode;
 }
 
 
 /**
  *
  */
 public function setCaseKey(keyCode:Number) : Void
 {
  __caseKey = keyCode;
 }
 
 
 /**
  *
  */
 private function onKeyPress () : Void
 {
  if(__hasFocus)
  {
   // Check to see if it is an upper case command
   if(Key.getAscii() == __caseKey)
   {
    upperCase = !upperCase;
   }
   else if(Key.getCode() == __deleteKey)
   {
    __labelField.text = __labelField.text.substr(0, __labelField.text.length-1);
   }
   else
   {
    processInput();
   }
  }
 }
 
 
 /**
  *
  */
 private function processInput() : Void
 {
  var str:String = __labelField.text;
  
  for(var key in __keys)
  {    
   if(Key.getCode()==__keys[key])
   {
    if(__enteringChar && (key == __previousKey))
    {
     if(__charIndex < __chars[key].length-1) __charIndex++;
     else __charIndex = 0;
     str = str.substr(0, str.length-1);
    }
    else __charIndex = 0;
    
    clearInterval(__timeoutInterval);
    
    str += (__upperCase) ? __chars[key][__charIndex].toUpperCase() : __chars[key][__charIndex];
    __enteringChar = true;
    __previousKey = key;      
    __timeoutInterval = setInterval(this, "inputTimeout", CHAR_CHANGE_TIMEOUT);
   }
  }
    
  __labelField.text = str;
 }
 
 
 /**
  *
  */
 private function inputTimeout() : Void
 {
  __enteringChar = false;
  __arrowMC.play();
  clearInterval(__timeoutInterval);
 }

Back to home