Step 1:
Launch Your NetBeans Application
Locate your NetBeans Integrated Development Environment (IDE) and double-click (or right-click it and click on
Open) to launch/open the application.
 |
| An image of how the NetBeans IDE looks like. |
Step 2:
Create A New Project
a. Locate and click on the
File menu item on the menu bar of the NetBeans IDE.
b. Click on
New Project from the drop down menu that appears in order to open the '
New Project Wizard'.
c.
Choose Project: Within the
New Project Wizard, from the
Categories option (on the left of the Wizard), select
Java ME (i.e. Micro Edition).
After that, select
Mobile Application from the
Projects Pane (which is on the right of the Wizard) as is shown in the figure below.
d.
Name And Location: After this, click on the '
Next >' button to move on to the next stage where you can specify the name and location of your project.
Uncheck the Create Hello MIDlet (this is just a default mobile application that might interfere with what you are about to do)
as is depicted in the figure below
and click on the Next button to proceed.
e.
Default Platform Selection: Choose a
default Emulator Platform for all your mobile applications and select the type of
Mobile Device (emulator) you will want to use in dipslaying the mobile applications for this particular project, on your Computer.
f. Device Configuration and Device Profile: Select CLDC-1.1 ( i.e. Connected Limited Device Configuration) and MIDP-2.1 (i.e. Mobile Information Device Profile) in order to have the best and/or all of the resources for your project (as is shown below). Click on the Next button to proceed.
g. Mobile Configurations Selection: Expand the 'Configuraton templates provided by installed CDLC platforms' node. After that, expand the 'Java(TM) Platform Micro Edition SDK 3.0' node and select the type of template you want for your mobile applications (as is shown in the figure below). Click on the Finish button when you are done.
Step 3:
Add A New File
a. Locate and click on the
File menu item on the menu bar of the NetBeans IDE.
b. Click on
New File from the drop down menu that appears in order to open the '
New File Wizard'.
c.
Choose Project: Within the
New File Wizard, select the name of your newly created project (i.e. if it is not already selected).From the
Categories option (on the left of the Wizard), select
MIDP.
After that, select
MIDlet from the '
File Types' Pane (which is on the right of the Wizard) as is shown in the figure below. Click next to proceed.
d.
Name And Location: At the next stage, specify the name of your
MIDlet and
MIDlet Class(which could be the same as that of the MIDlet). For the sake of this tutorial, I shall name this
MIDlet and
MIDlet Class,
simpleInterestApp,
as is depicted in the figure below
. Click on the
Finish button to launch the
Code Editor where you can begin with the coding.
Step 4:
Start Coding
Within the Code Editor, you realise that the following codes are presented to you by default:
Line 1: import javax.microedition.midlet.*;
Line 2: /**
Line 3: * @author Mr. Bryte (this is just the username of the machine you are working with)
Line 4: */
Line 5: public class simpleInterestApp
extends MIDlet {
Line 6:
public void startApp() {
Line 7: }
Line 8:
Line 9:
public void pauseApp() {
Line 10: }
Line 11:
Line 12:
public void destroyApp(
boolean unconditional) {
Line 13: }
Line 14: }
a.
Line 1: After Line 1 of the codes above:
Import another package for the
User Interface as illustrated below:
import javax.microedition.lcdui.*;
/*lcdui (liquid crystal display-user interface)
The
star (*) at the end is synonymous to the word,
All. Thus, we are importing all the components
of the
lcdui class.
*/
b.
Line 5: Add the following codes to Line 5 of the codes above (i.e. after MIDlet):
implements CommandListener
//The CommandListener helps the application to listen to the commands of the user (i.e. whenever a
//button is clicked). In mobile applications, buttons are called commands.
After doing that, Line 5 should look somewhat like the codes below:
public class simpleInterestApp
extends MIDlet
implements CommandListener {
c.
After Line 5: Declare the scope of the components to be used:
Add the codes below, after
Line 5.
//Declaring the
private scope of the
Display to be used (remember lcd?) with name,
myDisplay
private Display myDisplay;
//Declaring the
private scope of the
TextFields to be used with names,
txtPrincipal, txtTime, etc
private TextField txtPrincipal;
private TextField txtTime;
private TextField txtRate;
private TextField txtSimpleInterst;
//Declaring the
private scope of the
Form with name,
myForm
private Form myForm;
//Declaring the
private scope of the
Commands to be used with names,
cmdOk and
cmdExit
private Command cmdOk;
private Command cmdExit;
d.
Create a construct of the simpleInterestApp
class:
Right after the declarations above, you'll have to create a construct of the class you are working with (as shown below).
public simpleInterestApp( )
{
}
e.
Set the properties of the controls within the construct above:
At this stage, you then
set the properties of the controls whose scope you have just declared. This is done within the
simpleInterestApp( ) construct. Your code should look like the ones below:
public simpleInterestApp()
{
//Creating a new instance of all the controls and setting their properties
myDisplay = Display.getDisplay(
this);
//myForm= new Form("This represents the Title of the form");
myForm=
new Form(
"Simple Interest Calculation");
// txtPrincipal= new TextField("This represents the Label of the TextField:","The default value of the
//TextField",The size of this TextField, The type of data the TextField can hold; DECIMAL is the
//type for all numeric values);
txtPrincipal=
new TextField(
"Principal:",
"",50,TextField.
DECIMAL);
txtTime=
new TextField(
"Time:",
"",50,TextField.
DECIMAL);
txtRate=
new TextField(
"Rate:",
"",50,TextField.
DECIMAL);
txtSimpleInterst=
new TextField(
"Simple Interest:",
"",50,TextField.
UNEDITABLE);
//cmdExit=new Command("The Text property of the Command (button)",Command.EXIT,the position of the command within the menu item or on the screen);
cmdExit=
new Command(
"Exit",Command.
EXIT,1);
cmdOk=
new Command(
"Ok",Command.
OK,2);
//Adding the controls to the form
myForm.addCommand(
cmdOk);
myForm.addCommand(
cmdExit);
myForm.append(
txtTime);
myForm.append(
txtPrincipal);
myForm.append(
txtRate);
myForm.append(
txtSimpleInterst);
//Setting the Form to listen to the commands of the user. Thus, the button clicks.
myForm.setCommandListener(
this);
}
f.
Line 6: Initialise the application
Type the codes below after
Line 6.
myDisplay.setCurrent(
myForm);
Thus, the below codes:
public void startApp() {
myDisplay.setCurrent(
myForm);
}
g.
After Line 13: Activate the Commands (buttons)
At this stage, we will write what the buttons (commands) will do when they are clicked (or fired).
Add the following codes, after Line 13:
public void commandAction(Command c,Displayable d)
{
if(c==
cmdExit)
{
destroyApp(
false);
notifyDestroyed();
}
else if(c==
cmdOk)
{
//Declaring the respective variables
int time,principal,rate,simpleInterest;
//Converting the values in the
Time,Principal,and Rate TextFields to
integer and assigning them to the
//time,principal, and rate variables respectively
time=Integer.parseInt(
txtTime.getString());
principal= Integer.parseInt(
txtPrincipal.getString());
rate= Integer.parseInt(
txtRate.getString());
simpleInterest=(principal*time*rate)/100;
//Converting the value in the
simpleInterest variable to
String and assigning it to the
// SimpleInterest TextField
txtSimpleInterst.setString(String.valueOf(simpleInterest));
}
}
Step 5:
Run the application
When you are done typing the codes above, simply
press F6 to launch the application.
The application should look somewhat like the image below:
Step 6:
Changing the look of your application
a. Locate and click on the
Run menu item on the menu bar of the NetBeans IDE.
b. Click on
Set Project Configuration from the drop down menu that appears.After that, click on
Customize from the cascaded menu that will appear.
c.
Choose a template
Navigate the dialog box that appears (as it is in
Step 2g) and choose
DefaultFxTouchPhone1 (or any template of your choice). Click on
Ok when you are done (please do not make any other changes unless you know exactly what you are doing) and run the application again. Your application should look somewhat now like the image below:
Step 7:
Happy Coding
Hope this post was helpful to you? Please leave your comments (suggestions/recommendations/questions/contributions) below. Thank you.
