Working with Background Image in Nokia LWUIT

Working with Background Image in LWUIT :

Many people like to design their app with good UI ,for that purpose Images specially Background Images play a vital role in UI design.

In this post we clearly explained how to add background image to our LWUIT app with sample coding.

Please refer how to add and Initialise LWUIT in your project here( otherwise you can't use the following code in your project).

After adding LWUIT to your project you should initialise LWUIT project.To initialise LWUIT project use the code given below in the first of startApp() method.

To initialize : 

To initilaize LWUIT 

Display.init(this);

Adding Image to your project:

Before using an image you should add the image into your project.First copy the source image (JPG or PNG format) and now open your Nokia IDE and in the left side under your project name you can notice the "res" folder which should contain the resources like Images for the project.

Now right click on the res folder and paste your image in that folder.

Code to Create Image Object:

To create a image object use the following code

Image a=new Image("/Image_name.jpg");

e.g

Image a=new Image("/success.jpg");

Note: Even you are pasting your image in /res/ folder you should mention as /Image_name in the time of creating Image object.Also the Image should be surrounded by Try/Catch block mandatory.

So the code might resemble like one below

 try {

a=Image.createImage("/success.jpg");

     } 

catch (IOException e)

 {

    // TODO Auto-generated catch block

 }

To add Image to the Form:

To add the created Image to the form we should use the following code 

f1.getStyle().setBgImage(Image_object);

e.g

f1.getStyle().setBgImage(a);

success.jpg

Sample code:

//We used success.jpg image in our project

//Project Name:BGImage

//Class Name: Background_Sample

import java.io.IOException;

import javax.microedition.midlet.MIDlet;

import javax.microedition.midlet.MIDletStateChangeException;

import com.sun.lwuit.Display;

import com.sun.lwuit.Form;

import com.sun.lwuit.Image;

import com.sun.lwuit.Label;

public class Background_Sample extends MIDlet {

public Background_Sample() {

// TODO Auto-generated constructor stub

}

protected void destroyApp(boolean unconditional)

throws MIDletStateChangeException {

// TODO Auto-generated method stub

}

protected void pauseApp() {

// TODO Auto-generated method stub

}

protected void startApp() throws MIDletStateChangeException {

// TODO Auto-generated method stub

//Initialize LWUIT

Display.init(this);

Image a = null;

Label l1;

//Creation of Form

Form f1=new Form("BG Image Sample");

try {

a=Image.createImage("/success.jpg");

} 

                 catch (IOException e)

                 {

                 }

}

f1.getStyle().setBgImage(a);

f1.show();

}

}

The output will resemble the one like below