07 - J2ME Graphic User interface: Page 5 of 6

ImageItem Class

This class allows us to include images in our forms. This image won’t be editable, so the user won’t be able to change it. It has two constructors:

ImageItem (String label, Image image, int layout, String alternativeText)

ImageItem (String label, Image image, int layout, String alternativeText, int appearance)

  • The layout indicates the position of the image in the screen: LAYOUT_LEFT, LAYOUT_RIGHT, LAYOUT_CENTER, LAYOUT_DEFAULT, LAYOUT_NEWLINE_AFTER and LAYOUT_NEWLINE_BEFORE.
  • The alternativeText specifies an alternative text that is going to be displayed when the image exceeds the display capacity.
package my.demo;
import java.io.IOException;
import javax.microedition.lcdui.Command;
import javax.microedition.lcdui.CommandListener;
import javax.microedition.lcdui.Display;
import javax.microedition.lcdui.Displayable;
import javax.microedition.lcdui.Form;
import javax.microedition.lcdui.Image;
import javax.microedition.lcdui.ImageItem;
import javax.microedition.midlet.MIDlet;
import javax.microedition.midlet.MIDletStateChangeException;
public class HelloWorld extends MIDlet implements CommandListener {
    private Display myDisplay;
    private Form  myForm= new Form("Form");
    private Command exitCommand = new Command("Exit", Command.EXIT,1);
    private Image myImage ;
    private ImageItem myImageItem;
    public HelloWorld() {
        myDisplay = Display.getDisplay(this);
        try {
            myImage = Image.createImage("JavaMe.png");
        } catch (IOException e) {
            e.printStackTrace();
        }
        myImageItem = new ImageItem("MyLabel", myImage, ImageItem.LAYOUT_CENTER, "MyImage");
        myForm.append(myImageItem);
        myForm.addCommand(exitCommand);
        myForm.setCommandListener(this);
    }
    protected void destroyApp(boolean arg0) throws MIDletStateChangeException {
        notifyDestroyed();
    }
    protected void pauseApp() {
    }
    protected void startApp() throws MIDletStateChangeException {
        myDisplay.setCurrent(myForm);
    }
    public void commandAction(Command c, Displayable d) {
        if (c==exitCommand) {
                try {
                    destroyApp(false);
                } catch (MIDletStateChangeException e) {
                    e.printStackTrace();
                }            
        }
    }
}

When executing this MIDlet, our initial screen will show something like this:

          

Note: For this midlet I had a copy of the JavaMe.png file in the res folder of our project.

TextField Class

This class allows us to include a text field that the user can interact with and change the edit the text. This class is similar to the TextBox we saw earlier.

TextField (String label, String text, int size, int restrictions)

package my.demo;
import javax.microedition.lcdui.Command;
import javax.microedition.lcdui.CommandListener;
import javax.microedition.lcdui.Display;
import javax.microedition.lcdui.Displayable;
import javax.microedition.lcdui.Form;
import javax.microedition.lcdui.TextField;
import javax.microedition.midlet.MIDlet;
import javax.microedition.midlet.MIDletStateChangeException;
public class HelloWorld extends MIDlet implements CommandListener {
    private Display myDisplay;
    private Form  myForm= new Form("Form");
    private Command exitCommand = new Command("Exit", Command.EXIT,1);
    private TextField myTextField;
    public HelloWorld() {
        myDisplay = Display.getDisplay(this);
        myTextField = new TextField ("Label", "Text", 50, TextField.ANY);
        myForm.append(myTextField);
        myForm.addCommand(exitCommand);
        myForm.setCommandListener(this);
    }
    protected void destroyApp(boolean arg0) throws MIDletStateChangeException {
        notifyDestroyed();
    }
    protected void pauseApp() {
    }
    protected void startApp() throws MIDletStateChangeException {
        myDisplay.setCurrent(myForm);
    }
    public void commandAction(Command c, Displayable d) {
        if (c==exitCommand) {
                try {
                    destroyApp(false);
                } catch (MIDletStateChangeException e) {
                    e.printStackTrace();
                }            
        }
    }
}

When executing this MIDlet, our initial screen will show something like this:

          

Like us on Facebook