Introducing Starling

TextField

We used the starling.text.TextField API briefly earlier when playing with quads. Let’s spend some little time on how text works with Starling. You may wonder how a GPU renders a font, but there is a trick here. Behind the scenes Starling creates a native TextField object on the CPU, and uses it as a offscreen buffer to render the font. Once rasterized, the texture is uploaded to the GPU and you have your text on screen.

Warning

Note that the TextField API does not create a native flash.text.TextField instance for each starling.text.TextField you use. One instance is cached and reused to render all the text.

In the following code, we create a TextField object and display some text using the Verdana system font:

package
{
    import starling.display.Sprite;
    import starling.events.Event;
    import starling.text.TextField;

    public class Game extends Sprite
    {
        public function Game()
        {
            addEventListener(Event.ADDED_TO_STAGE, onAdded);
        }

        private function onAdded (e:Event):void
        {
            // create the TextField object
            var legend:TextField = new TextField(300, 300, "Here is some text,
                              using a system font!", "Verdana", 38, 0xFFFFFF);

            // centers the text on stage
            legend.x = stage.stageWidth - legend.width >> 1;
            legend.y = stage.stageHeight - legend.height >> 1;

            // show it
            addChild(legend);
        }
    }
}

Figure 1-46 illustrates the result.

Figure 1-46. Some simple text

Again, remember that what you see here on screen ...