Text Input with Starling framework

Starling is a popular pure ActionScript 3 framework for Adobe Flash with a lot of features. It's an open source library, so you can download ans use it right away. Starling runs not only in the browser but on all major mobile platforms, like iOS and Android.
The Starling framework allows you to create hardware accelerated applications in Flash. The main target is the creation of 2D games, but Starling can be used for any graphical application.
Starling's API is very similar to the native Flash API what is very beneficial. It provides almost the same set of classes and functions, which makes it easy for experienced Flash developers to make the transition from the conventional display list to stage3D accelerated content.
Unfortunatly for today not all components are covered in Starling framework. Like Text Input component is not part of this framework. But we can still create a classic TextField and put it on top of Starling.

The simplest way is create the whole text input box in conventional Flash. For this could be used  flash.text.TextField class.

var textField:TextField = new flash.text.TextField();
// Create default text format
var textFormat:TextFormat = new TextFormat("Arial", 24, 0x000000);
textFormat.align = TextFormatAlign.LEFT;
textField.defaultTextFormat = textFormat;
// Set text input type
textField.type = TextFieldType.INPUT;
textField.autoSize = TextFieldAutoSize.LEFT;
textField.x = 10;
textField.y = 10;
// Set background just for testing needs
textField.background = true;
textField.backgroundColor = 0xffffff;
textField.text = "Some text...";

Another approach is create flash.text.StageText instance and wrap it in one subclass of flash.display.Sprite. Good example is Native Text Input component.

var textField:NativeText = new NativeText(1);
// Set return key from soft keyboard mode
textField.returnKeyLabel = ReturnKeyLabel.DONE;
textField.autoCorrect = true;
textField.fontSize = 24;
textField.fontFamily = "Arial";
textField.color = 0x000000;
textField.width = 400;
textField.height = 70;
textField.x = 10;
textField.y = 10;
textField.text = "Some text...";

Then add an instance of text input box class to Starling.current.nativeOverlay.

Starling.current.nativeOverlay.addChild(textField);

Additionaly we can turn off the default panning and resizing behavior associated with raising a soft keyboard by setting the softKeyboardBehavior element in the application descriptor to none.

<softKeyboardBehavior&rt;none</softKeyboardBehavior&rt;

When soft keyboard automatic behavior was turned off, it is application’s responsibility to make any necessary adjustments to the application display. A softKeyboardActivate event is dispatched when the keyboard opens. When the keyboard closes, a softKeyboardDeactivate event is dispatched, and we can return the application display to normal.

textField.addEventListener(SoftKeyboardEvent.SOFT_KEYBOARD_ACTIVATE, onActivateKeyboard);
textField.addEventListener(SoftKeyboardEvent.SOFT_KEYBOARD_DEACTIVATE, onDeactivateKeyboard);

private function onActivateKeyboard(event:SoftKeyboardEvent):void
{
 var offset:int = 0; 
 //if the softkeyboard is open and the field is at least partially covered 
 if( (Starling.current.nativeStage.softKeyboardRect.y != 0) && (textField.y + textField.height > Starling.current.nativeStage.softKeyboardRect.y) ) 
  offset = textField.y + textField.height - Starling.current.nativeStage.softKeyboardRect.y; 
 //but don't push the top of the field above the top of the screen 
 if( textField.y - offset < 0 ) offset += textField.y - offset;
 // Move text field and container
 textField.y -= offset; 
 this.y -= offset;
}

private function onDeactivateKeyboard(event:SoftKeyboardEvent):void
{
 // Move back text field and container
 textField.y = 10;
 this.y = 0;
}

The final step is to dispatch an event and remove the box.

Basically this is all stuff that we need to create simple Text Input component with Starling framework for our AIR mobile application.