Article Tutorials/Drawing text with TextField
Drawing Text
Type the following code in your main.lua file:
local textfield = TextField.new(nil, "Hello, world!")
textfield:setX(10)
textfield:setY(10)
stage:addChild(textfield)
Start the Player as shown previously and hit the Play button.
Code explanation
- local textfield = TextField.new(nil, "Hello, world!")
This code creates a local variable “textfield” with the content of “Hello, world!”. The ‘nil’ specifies to use Gideros default font.
- textfield:setX(10)
- textfield:setY(10)
These set the X and Y coordinates of the bottom-left corner of the text to display on the screen.
- stage:addChild(textfield)
This adds the text field to the screen.
You can change the color of the text:
Textfield:setTextColor(0xFF0000)
Font
You can use your own font, provided you include it with the application.
local myfont = Font.new("font.txt", "font.png")
The image file “font.png” contains your font:
local textField = TextField.new(myfont, "Hello World")
stage:addChild(textField)
TTFont
You can also use any TTF font in your application. Just copy it into Gideros Studio via Add Existing Files:
Then in your code:
local myfont = TTFont.new("LiberationMono-Regular.ttf", 18)
local text = TextField.new(myfont, "Hello world")
text:setPosition(10, 10)
stage:addChild(text)
The “18” above is the font size.
TTF fonts display is slow, so you should pre-cache any characters you will use to display your text. Make sure you cover ALL characters your app will be using:
local font = TTFont.new("FtraMd__.ttf", 18, " ABCDEFGHIJKLMNOPQRSTUVWXYZ")
local text = TextField.new(myfont, "HELLO WORLD")
text:setPosition(10, 10)
stage:addChild(text)
You can download the assets required in this tutorial here: File:Jason-Oakley-Drawing Text assets.zip
Note: This tutorial was written by Jason Oakley and was originally available here: http://bluebilby.com/2013/04/06/gideros-mobile-tutorial-drawing-text/
