Text Renderer
The Text Renderer is a dual purpose renderer. It can be used as a simple label or for user input.
**Note: Currently this renderer only displays one default device font ("Arial") however in a future update you will be able to change the font or render the text with a font bitmap.
Label Renderer
- Font Size - Is the size of the text rendererd in pixels
- Font Color - Is the color of the text
- Auto Resize - Will automatically change the size of this renderer based on the text property.
Text Input Functionality
To turn this renderer into a text input control just change the Type dropdown to "Input Field". This will present a user input field to the user whenever a touch event or mouse down event is received on this renderer.
Code Sample
var entity : IEntity = PBE.allocateEntity(); //Used with a Basic 2D Scene var textRenderer : UITextRendererComponent = new UITextRendererComponent(); textRenderer.fileName = "assets/image.png"; textRenderer.fontSize = 30; textRenderer.fontColor = 0xFF0000; //RED textRenderer.text = "Sample Text"; //OR //Use as a text input field textRenderer.type = flash.text.TextFieldType.INPUT; //If you set auto resize to true this renderer will automatically //resize to fit the string in the text property textRenderer.autoResize = true; //Add to a scene to be displayed. textRenderer.scene = scene; entity.addComponent(textRenderer, "TextRenderer");
Bitmap Font
var entity : IEntity = PBE.allocateEntity();
//Used with a Basic 2D Scene
var textRenderer : UITextRendererComponent = new UITextRendererComponent();
textRenderer.fileName = "assets/image.png";
textRenderer.fontSize = 30;
textRenderer.fontColor = 0xFF0000; //RED
textRenderer.text = "Sample Text";
textRenderer.fontImage = PBE.resourceManager.load("assets/fontbitmap.png") as ImageResource;
textRenderer.fontData = PBE.resourceManager.load("assets/fontbitmapData.fnt") as DataResource;
Rendering bitmap fonts can be achieved by passing a Data Resource of the font letter coordinates and an Image Resource of the font sprite sheet. This renderer is capable of parsing a BMFont data file which you can generate using a free Bitmap Font generator application (http://www.angelcode.com/products/bmfont/) or the commercial Glyph Designer (http://www.71squared.com/glyphdesigner) from 71Squared.
This will try to find the letters found in the text property of this component inside of the font bitmap and composite a final image of the text property. If you are using this renderer as a text input it is probably not a good idea to use a bitmap font.
**Note: This bit of functionality will most likely change to accept a bitmap font data file in xml format and offer more functionality when it comes to rendering a bitmap font. Stay tuned...
