Hello World Tutorial

Goals

Hello World Example
  • understand the basic structure of a MT4j application
  • demonstrate the use of a scene and the MTTextArea component.

Tutorial

A MT4j application always constists of one or more so called 'scenes'. Each scene has its own canvas and thus its own scene graph containing the scenes components. For the Hello World application we will use only a single scene. The best way to create your scenes is to extend the AbstractScene class which provides the base functionality for a scene.

public class HelloWorldScene extends AbstractScene {


The constructor of the scene takes the MTApplication and the scene's name as a parameter. The name can be used to identify and retrieve a scene from the MTApplication.

 public HelloWorldScene(MTApplication mtApplication, String name) {
                super(mtApplication, name);


We use the constructor to create and initialize the components we will use in this scene. In case of the hello world example, we will have to create an instance of the MTTextArea class which is used to display the text. But first, we define a few settings for the scene.
Now, we set the color which is used to clear the scene's canvas before every new frame is drawn.

         this.setClearColor(new MTColor(146, 150, 188, 255));


Because we have no mouse cursor which indicates exactly where the cursor is positioned we create and register a global input processor with this scene. The CursorTracer is a global input processor which recieves all cursor input and adds a circle to our canvas at the cursor's position so we can actually see where we touch.

         this.registerGlobalInputProcessor(new CursorTracer(mtApplication, this));


Now it's time to finally create our Hello World text using the MTTextArea component. The text area takes a MTApplication instance and the font to use with text as an argument. Fonts are loaded using the FontManager singleton class. For the font, we have to specify the name of the font file, the size and the color. The font has to be located in the ./data subdirectory. If a True Type Font (*.ttf) is specified, a vector font is created.

         MTTextArea textArea = new MTTextArea(mtApplication,                                
                              FontManager.getInstance().createFont(mtApplication, "arial.ttf", 
                                50,                               //Font size
                                new MTColor(255, 255, 255, 255),   //Font fill color
                                new MTColor(255, 255, 255, 255))); //Font outline color


Next, we set a few settings for the text area. The text area is actually a rectangle containing the text. As we only want to show the text, we set NoFill and NoStroke to true, which results in only the text being drawn, without the outer text area rectangle.

         textArea.setNoFill(true);
                textArea.setNoStroke(true);


Now we set "Hello World" as the text to display in the text area. The text area is now ready to be displayed. To display a component, it has to be added to the canvas of a scene or to a component which has already been added to the canvas. In this case, we add the text area directly to the canvas component.

         textArea.setText("Hello World!");
                this.getCanvas().addChild(textArea);


Finally, we set the text area's position in our virtual world to be at the center of the screen.

 
                textArea.setPositionGlobal(new Vector3D(mtApplication.width/2f, mtApplication.height/2f));
}


Every scene has to implement the init() and shutDown() methods. The init() method is invoked when a scene change takes place. The method is called right before the scene which is changed to becomes the currently active scene. It can be used to initialize a few settings or to register a keyboard listener for example. The shutDown() method is called on the currently active scene when a scene change to another scene occurs.
Since we dont have anything to initialize here, we can leave them blank.

 
        public void init() {
        }
 
        
        public void shutDown() {
        }
}


This concludes the definiton of our scene.

Now we only have to create a MTApplication, add the scene we created, and run the application. Thus, we create a separate class extending the MTApplication class where we place the main method as the entry point for our application. In this main method we call the static method initialize() which amongst other things reads the settings from the Settings.txt file and creates an instance of MTApplication with the given settings. After this initialization, the startUp() method is invoked automatically which we use to create our scene and add it to the application. The first added scene automatically becomes the currently active scene and thus is is drawn and recieves input.

public class StartHelloWorld extends MTApplication {
        public static void main(String[] args) {
                initialize();
        }
 
        
        public void startUp() {
                addScene(new HelloWorldScene(this, "Hello World Scene"));
        }
}

Powered by MediaWiki contact