Tutorial 7: Midlet and GameConvas 1


Overview on this Tutorial:

1. The first GUI program using Midlet (FirstTextBox.java)

2. Mutilple displays (TextBoxMidlet.java)

3. The "HelloWorld" program using GameConvas (HelloMidlet1.java)


The first GUI program using Midlet (FirstTextBox.java):

1. To demostrate some basic programming technique, we have written Midlet program as if writing "Console" program before. Now we focus on the Midlet program using graphical user interface (GUI).

2. We desmostrate a very simple GUI program by a "TextBox" and an exit "Command".

3. A "TextBox" is constructed as follows:

TextBox(String title, String text, int maxSize, int constraints)

4. In our example:

TextBox textBox = new TextBox("First Text Box Midlet", "This is my first text box!", 256, TextField.ANY);

5. A textbox is one of the class which can be displayed, so it is one of the subclass of the class Displayable.

6. To display an object of "Displayable" class, we should have to get the current "Display" object, and set the current display.

7. In our example:

midletDisplay = Display.getDisplay(this);

midletDisplay.setCurrent(textBox);

8. Note that "mideletDisplay" is an object of "Display" and "textBox" is an object of "TextBox" which is a subclass of "Displayable".

9. We may add some command buttons into an "displayable" object.

10. We use "Command" class for constructing command buttons. A "Command" is constructed as follows:

Command(String label, int commandType, int priority)

11. In our example:

cmdExit = new Command("Exit", Command.EXIT, 1);

12. To add the command button into the displayable object, we have to use the "addCommand" function.

13. In our example:

textBox.addCommand(cmdExit);

14. But this is not enought, when using press the command, the program have to "listen" this "event" and handle it.

15. To do so, we should have a class that implements "CommandListener" interface.

16. To set the listener for the command, we have to use the function "setCommandListener".

17. In our example:

textBox.setCommandListener(this);

18. Then we have to implement the function commandAction() for handling the event.


Mutilple displays (TextBoxMidlet.java):

1. In this example, we have 3 different TextBoxes: "t1", "t2" and "t3".

2. In this example, we have 4 command buttions: "prn", "one", "two" and "three".

3. When user presses the command buttons "one", "two" and "three", we display the TextBoxes "t1", "t2" and "t3" respectively.

4. When user presses the command button "prn", we print out the text in the current displaying TextBox to the Console.

5. To get the current displaying object, we can use the function "getCurrent()".

6. The "commandType" of the command button specifies the type of command button which affect the position of the button. For example, for the "phone" in the Emulator, the "Exit" button is placed in the left button.

7. When there are too many command buttons, they will form a list and ordered by the piority.

8. You can see a "try and catch boxes" in the programme which is related to execption handling.

9. As we don't have time to discuss execption handling, you may always place the code which may have execption in the "try box" and you may leave in blank in the "catch box".


The "HelloWorld" program using GameConvas (HelloMidlet1.java):

1. There are actually two direct subclasses of Displayable class: "Screen" and "Canvas".

2. There are four subclasses of "Screen": "Alert", "Form", "List", "TextBox".

3. We have just discussed "TextBox", and you may try the other threes if you want.

4. However, the most flexible "displayable" class is "Canvas"/"GameCanvas".

5. "GameConvas" is a subclass of "Canvas", but they are just difference in a few ways.

6. We usually have to use a flexible "displayable" class to make games.

7. By its name, you may already know that "GameConvas" is the suitable class to make games.

8. In the paint() function of "GameConvas", you can get an object of the class "Graphics".

9. We can use the object of the "Graphics" to fill in colours and to draw some text, geometric objects (including rectangules, traingles, lines, etc.) and images, etc.

10. In the example, we draw the text "Hello,World!" by the function "drawString()".

11. Functions "getWidth()" and "getHeight()" gives us the width and the height of the screen in pixel.

12. The position of "drawString()" is specify by the x-coordinate, the y-coordinate of the anchor point. Therefore, the function takes 4 parameters:

drawString(String str, int x, int y, int anchor)

13. Note the x and y coorinate system used in Java is as follows:

-------->x
|
|
|
|
v
y

14. Note that the range of x is from 0 to the width of the screen, where the range of y is from 0 to the height of the screen.

15. As the string have certain size(dimension), we should define the position of the anchor point.

16. You have to use the bitwise OR to set the anchor point, such as:

g.TOP | g.HCENTER

17. You also see the function "fillRect()" in the program. The function takes 4 parameters:

fillRect(int x, int y, int width, int height)

18. The x-coordinate and y-coordinate of the "fillRect()" function specify the position of the top-left corner of the rectangle.

 

Question:

Could you add an "Exit" Command to the "HelloWorld" program?

Solution: HelloMidlet2.java.