Technology Demo

Text Demo

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Spot for images

Intro

This project will show you how to create a text panel that contains a text, and also how to show text on a 3D object.

Font File

After creating a new Luster project, we'll need to create a new Font file. Right click on the project name and make a new folder called "Fonts". Then right click on Fonts and select New > File. Save this new file as "Arial.font".

font Arial 
{
type truetype
source Fonts/arial.ttf
size 24
resolution 96
code_points 33-166
}

The first line names the font, and the second declares it as a true type font. It lists the source of the font file, which we will import in a minute. The next three lines determine the font size in points, the resolution (here it's the standard resolution) and the characters that will actually be used. 33-166 indicates the standard alphabet, standard punctuation and numbers.

Before we can start rendering text to the screen, we need to make sure that the font is embedded in case the user doesn't have it in their system.

Right click on the Fonts folder, and go to Import Resources > Files. Click on Browse, then go to Computer > C:/ > Windows > Fonts. Select the font "arial.tff", and import it.

Text Panel

To render text to a basic panel, we need to set up our TextPanel.

self.panel = luster.display.TextPanel("Arial", 300,300)
self:addChild(self.panel)

This creates a new TextPanel and adds it to the stage.

self.panel:renderText("Here is the text.", {0,0, 300, 300}, luster.Color(1,1,1))
self.panel.position=luster.Vector2(150,300)

The above code renders the code with the arguments of a string, a table, and a color. The string is the text that you want to print, and the table is indicates the x and y of how much of the panel the text will fill, and the next two are the width and height. The last argument is the color, pure white.

The position line adjusts the x and y position of the panel on the stage.

Creating Text on a Cube

We need to create a renderer that will render our text to a texture that can be applied to a cube. The code below does just this.

local renderer=luster.display.TextRenderer("Arial")

This code calls the createTexture method which will set parameters for the texture we will render. The first two arguments refer to the resolution of the finished texture. You want these numbers to be a multiple of two. The third parameter is a boolean that states if you want Luster to automatically create a mipmap for you.

A mipmap will create smaller versions of your texture so that if the object goes off into the distance, there aren't artifacts generated. For our example, we don't need mipmapping.

renderer:createTexture(256,256,false)
renderer:renderText("Here's more text", {0,0,300,300},luster.Color(1,1,1))

The second line actually renders the text to the texture using the same parameters as the TextPanel render.

Next, as mentioned in previous demos, we have to make a cube and put in some mouse controls to rotate it. Then, when applying a material to the cube, we change the line

textureUnit.texture=self.player.texture

to this

textureUnit.texture=renderer.texture

We'll also want to edit the scale and location of the cube to make sure it displays properly.

self.cube.scale = 0.03
self.cube.position=luster.Vector3(2,0,-10)

When we run our program, we'll have a cube with text and a text panel.