Become an Series 40 application developer - Part 2
Article Metadata
Code Example
Source file: Media:DayCare.zip
Article
Created: adarsha_saraff
(26 Jul 2012)
Last edited: hamishwillee
(02 Aug 2012)
This article explains how to develop a Java ME ("native") application for Series 40 devices. The article is for absolute beginners, and also for developers who are familiar with Java ME, but want to work on Series 40.
Continuing from Become an Series 40 application developer - Part 1
Contents |
Introduction
You have learnt about Series40 platform and now your are familiar with using NetBeans IDE and Nokia IDE. In here, we are going to develop first application. In this part, we will be developing an application for S40 classic phones with Netbeans IDE with Oracle Java(TM) Micro Edition SDK . The application will run on all S40 devices. We will use Nokia Java SDK 1.1 for Touch and Type Devices on NetBeans IDE and Nokia IDE for full touch devices.
Beginning With Development
The application we are going to develop is called "Day Care". This is an application for Baby Minder. Application allows her to store baby's name, Age and Date and time with the address.
Creating Project
- Create a new JavaME Mobile Application project by pressing "Ctrl+Shift+N" keyboard shortcut.
- Set the Project Name as "DayCare". Check Set as Main Project and uncheck Create Hello MIDlet and Click "Next" button.
- Make sure that Emulator Platform" is set to "CLDC Oracle Java(TM) Platform Micro Edition SDK" and Device to "DefaultCldcPhone1" and Device Configuration to "CLDC-1.1" and Device Profile to "MIDP-2.0" and click "Finish" button.
Adding MIDlet to project
Now we need to add MIDlet to our project to start developing app.
- Create a "New Visual MIDlet" by pressing "Ctrl+N" or "File>New File".
- Set the MIDlet Name as "DayCare" and Package as "Daycare and click "Finish" button to create.
Working with Components in Flow View
Adding Form and List
- Now Drag two Form and one List to Flow ( see 1 in fig.). Select each Form and List added and change"'Title" to "Add" and "View" for Form and "Menu" for List (see 2 in fig.). Then double click on default name and change the "Object Name" equivalent to "Title" (see 3 in fig.).
- Click and Drag to connect from "Started" to "Menu" (see 4 in fig.).
Adding List Element to List
- Add 4 "List Elements" to "Menu", by dragging "List Elements" form "Elements" (see 1 in fig.) into "Menu" List.
- Rename the newly added by changing "String" filed in "Properties" (see 2 in fig.) to "Add", "View", "Help" and "About".
- Connect "Add" and"View" to corresponding Form by dragging a line (see 3 and 4 in fig).
Adding Commands
- Drag "Exit Command" from "Commands" into "Menu" list (see 1 in fig.) and "Back Command" into "add" (see 2 in fig.). Connect to "Menu" list by dragging a connection between "backCommand" and "Menu" list (see 3 in fig.).
- Add existing "backCommand" to "view" form by right clicking on form and select "Add/New" from pop-up menu and select "backCommand" from "Add" category.
Completing the Application Design
- Complete the application design by adding "About" form and "Help" form. Repeat the previously done steps. Now your Flow View should like the one below.
Working with Components in Screen view
Open "Screen View" by clicking on screen button.
add Form
- Open "add Form" by selecting "add" from the drop down list located next to "Analyzer" button.
- Add a "Text Filed" by dragging "Text Filed" from "Items" into form template (see 1 in fig.). Set the Label as "Name" in "Properties" window (see 2 in fig.).
- Again add a "Text Filed" and set the Label as "Age" and Input Constraints to "Numeric" and Maximum Size to "3" (see 2 fig.).
- Add a "Date Field" and set the Label as "Date and Time".
- Add a "Text Field" and set the Label to "Address" and Maximum Size to "100".
Renaming the Object
Open "Navigation" Window.
- Find and Expand add[Form]. Expand Items[Form].
- Right click on the textField. Select "Rename" from pop-up menu and set the name as "nameTxt".
- Repeat the previous step for other object and set name as "ageTxt", "dateTxt" and "addressTxt" respectively.
view Form
- Open "view Form" from the drop down list (see 1 in fig.).
- Add 4 "String Item" into the form template.
- Set the the Label as "Name", "Age", "Date and Time" and "Address" respectively.
- Rename the Objects to "nameStr", "ageStr", "dateStr" and "addressStr" respectively.
About Form
About Form is must to publish on to Store. It should contain the following details. Application Name with exact version and Support email.
- Open "About Form" form the drop down list next to Analyzer button.
- Drag a "String Item" into form template. Set the Label to "DayCare v1.0" and set the Text as "Developed By: <your_name>".
- Drag again a "String Item" into form. Set the Label to "Support" and set the Text as "<your_email_id>".
Help Form
Help Form is must to publish on to Store. Help form should contain, detailed description of application and its usage.
- Open "Help Form" from the drop down list next to Analyzer button.
- Drag a "String Component" into form template. Set the Label to "DayCare" and add some help and usage string in to Text.
Coding the things
We have done designing part. But, we need to add Commands to save the information, to navigate through them and to delete.
- Drag "OK Command" in Flow View to "add Form" and set Label to "Save" and rename it as "saveCommand".
- Drag "OK Command" to "view Form" and set Label to "Next" and rename it as "nextCommand".
- Drag "OK Command" to "view Form" and set Label to Delete and rename it as "deleteCommand".
Saving and reading data
For storing the data in phone, we use Record Store. The schema for our database will be:
| ID | Column 1 | Column 2 | Column 3 | Column 4 |
|---|---|---|---|---|
| - | Name | Age | Date and Time | Address |
- Create an integer variable called "no". This is to keep track of record currently being read.
- Create an object of RecordStore "rs". Record Store is used to save data.
public class DayCare extends MIDlet implements CommandListener {
private boolean midletPaused = false;
int no = 1;
RecordStore rs = null;
Tip: Press Ctrl+Shift+I to fix all import errors.
- Expand Generated Method: commandAction for Displayables and perform the following steps.
- Find the if statement for command == saveCommand and the following program statements bellow "// write pre-action user code here" to add record to record store.
try {
rs = RecordStore.openRecordStore("DayCareDB", true); // argument 1 is the name of record store to be opened. argument 2 specifies that it should create a new record store if it does not exists.
ByteArrayOutputStream out = new ByteArrayOutputStream();
DataOutputStream dout = new DataOutputStream(out);
dout.writeUTF(getNameTxt().getString());
dout.writeInt(Integer.parseInt(getAgeTxt().getString()));
dout.writeUTF(getDateTxt().getDate().toString());
dout.writeUTF(getAddressTxt().getString());
dout.flush();
byte[] b = out.toByteArray();
rs.addRecord(b, 0, b.length); // to add record to record store
rs.closeRecordStore();
dout.close();
out.close();
} catch (Exception ex) {
}
getNameTxt().setString(null);
getAgeTxt().setString(null);
getAddressTxt().setString(null);
switchDisplayable(null, getMenu());
Tip: Press Alt+Shift+F for Format.
- Find the if statement for command == nextCommand and the following program statements bellow "// write pre-action user code here" to read next record from record store.
try {
rs = RecordStore.openRecordStore("DayCareDB", false);
if (no <= rs.getNumRecords()) {
byte[] b = new byte[1000];
ByteArrayInputStream inp = new ByteArrayInputStream(b);
DataInputStream dinp = new DataInputStream(inp);
rs.getRecord(no, b, 0); //to read from record store
getNameStr().setText(dinp.readUTF());
getAgeStr().setText("" + dinp.readInt());
getDatetimeStr().setText(dinp.readUTF());
getAddressStr().setText(dinp.readUTF());
dinp.close();
inp.close();
no ++;
} else {
no = 1;
}
rs.closeRecordStore();
} catch (Exception ex) {
}
- Expand Generated Method: MenuAction and perform the following steps.
- Find the if statement for __selectedString.equals("View") and the following program statements bellow " // write pre-action user code here" to set the "view Form". These statements reads the first record form record store.
try {
rs = RecordStore.openRecordStore("DayCareDB", false);
if (rs.getNumRecords() != 0) {
byte[] b = new byte[1000];
ByteArrayInputStream inp = new ByteArrayInputStream(b);
DataInputStream dinp = new DataInputStream(inp);
rs.getRecord(1, b, 0); //to read record form record store
getNameStr().setText(dinp.readUTF());
getAgeStr().setText("" + dinp.readInt());
getDatetimeStr().setText(dinp.readUTF());
getAddressStr().setText(dinp.readUTF());
dinp.close();
inp.close();
}
rs.closeRecordStore();
} catch (Exception ex) {
}
Running the project
Save the file by pressing Ctrl+S. Click on Clean and Build button (keyboard shortcut Shift+F11). After build completes, click on "Run" button (keyboard shortcut F6) to run.
Testing in RDA devices.
| Snapshot | RDA Device |
|---|---|
 |
Nokia C2-01 |
 |
Nokia C3-00 |
 |
Nokia C3-01 |
 |
Nokia Asha 311 |
Project File
Where to go Next
Java Developer Library
Become an Series 40 application developer - Part 3 (coming soon).
