1. Java- LWUIT
N Amanquah

2. Lab work
Build an application that does the following: Make use of netbeans:
Fetch data from the user (the user’s preferences)
Send it by sms to another number.
Store the data you have collected in a record store so that it can be retrieved the next time the user runs the program.
One menu item should allow the user to enter the values afresh, or to fetch the saved values.

3. LWUIT LightWeight User Interface Toolkit (LWUIT) [loo-it]
Cf Limited Capability Device User Interface (LCDUI) API
Swing inspired
provide a consistent, compelling look and feel
Supports cool screen transitions eg fade, flip, slide, also cube
Themes for look and feel
Supported on >=MIDP 2.0 devices

4. Lwuit class hierarchy Resource editor for visual design
Add Lwuit.jar to resources for the project

5. Hello world import javax.microedition.midlet.*;
import com.sun.lwuit.*; //note the imports
import com.sun.lwuit.events.*;
public class Midlet extends MIDlet implements ActionListener { //not CommandListener
Display.init(this); //init the display
Form f = new Form("Hello, LWUIT!");
f.show();
Command exitCommand = new Command("Exit");
f.addCommand(exitCommand);
f.setCommandListener(this); }
public void pauseApp() {}
public void destroyApp(boolean unconditional) {}
public void actionPerformed(ActionEvent ae) { //not commandAction
notifyDestroyed();

6. Always call the init method. It instantiates LWUITImplementation

7. Forms To add elements to forms: f.addComponent(formElement);
ButtonGroup is used to manage groups of exclusive radio buttons
Layouts like in swing: border, flow,
Note that textFields do not have captions as in LCDUI

8. Labels and buttons Label l = new Label(image);
l.setAlignment(Component.CENTER);
l.setText(“The Caption");
l.setTextPosition(Component.BOTTOM);
Button b=new Button(“Caption")
//behaves like swing.
“Button” is not “Command”,
Commands make menus
Buttons show up as buttons, are clickable

9. Radio buttons & check boxes
Form f = new Form("More Buttons");
RadioButton rb;
ButtonGroup group = new ButtonGroup();
rb = new RadioButton(“radio1");
group.add(rb);
f.addComponent(rb);
rb = new RadioButton(“radio2");
//for check box:
CheckBox cb;
cb = new CheckBox(“chk bx1");
f.addComponent(cb); …

10. Lists & combo boxes Use a list model List list = new List();
list.addItem("item1");
list.addItem("item2");
f.addComponent(list);
ComboBox comboBox = new ComboBox(list.getModel());
f.addComponent(comboBox);

11. Other components TextArea Calendar TabbedPane
MediaComponent –to display rich media content

12. Layouts Layouts include: BorderLayout FlowLayout BoxLayout GridLayout
GroupLayout
f.setLayout(new BoxLayout(BoxLayout.Y_AXIS));
f.addComponent(BorderLayout.WEST, c)

13. Containers Dialogs: c. addComponent(new Button(“aButton"));
Container c = new Container(new BoxLayout(BoxLayout.X_AXIS));
//add stuff:
c. addComponent(new Button(“aButton"));
Dialogs:
new Dialog().show("Please confirm", “The message ", "OK", "Cancel"))
Many show methods
Is modal (generally)
Usually returns true if OK button pressed. (Check version of fxn called in API)

14. Transitions Incoming & outgoing
f.setTransitionOutAnimator( Transition)
f.setTransitionInAnimator( Transition)
Transition createSlide(int type, boolean forward, int duration) \
also: Transition createFade()
3-D animations possible on devices that have Mobile 3D Graphics API. Eg createFlyIn, createCube , createRotation Eg
f.setTransitionOutAnimator(CommonTransitions.createSlide(CommonTransitions.SLIDE_HORIZONTAL, false, 1000));
//false= left to right transition
//1000= num of milliseconds for transiton
f.setTransitionOutAnimator(CommonTransitions.createFade(1000));

15. Events Implement ActionListener
Pass instance of ActionListener to the objects addActionListener() method
Eg btn.addActionListenter(this)
Provide a body for
public void actionPerformed(ActionEvent ae)
Determine which object created event by calling
ae.getCommand() //within the actionPerformed fxn
Within events, it is useful to call f.layoutContainer() on the form to make it repaint any adjustments made to elements of a form

16. Events
Display class in LWUIT manages a single main thread (Event Dispatch Thread)
Implement one callback/listener interfaces, register it with LWUIT to listen to all events
Most use actionListener
Others include
DataChangedListener -when a ListModel changes. for a list or combo box.
SelectionListener -when the current selection of a ListModel changes.
FocusListener -when a component gains or loses focus.
StyleListener -when changes in a component's style occur

17. Event listener eg //creating a listener
private class StudentListActionListener implements ActionListener {
public void actionPerformed(ActionEvent evt) {
//selectedStudent = (Student) studentList.getSelectedItem();
if (evt.getSource().equals(studentList)) {
displayStudent();
} else if (evt.getSource().equals(newButton)) {
selectedStudent = null;
newDob = 0;
} else if (evt.getSource().equals(removeButton)) {
if (new Dialog().show("Please confirm", "OK to remove " + selectedStudent, "OK", "Cancel")) {
StudentDao.removeStudent(selectedStudent);
displayStudents(); }
//code to add the listener to the widgets
StudentListActionListener listActionListener = new StudentListActionListener();
newButton.addActionListener(listActionListener);
removeButton.addActionListener(listActionListener);
studentList.addActionListener(listActionListener);

18. Logging The Log class and static p methods permits writing to the log,
eg Log.p(“Message to log”);
Four log levels: Debug, Info, Error, and Warning.
Call Log.showLog() to display a form with log

19. Lists: LWUIT vs LCDUI Lists LCDUI List are Strings and images,
adding a collection of records to the list for display is difficult
difficult to associate the selected choice to element in the collection
A LWUIT can handle an array or Vector of Objects
To get selected object, call on the getSelectedItem()

20. Lists Eg a: LCDUI list: List list = new List("list", Choice.IMPLICIT);
list.setCommandListener(this);
Vector students = StudentDao.getStudents();
for (int i = 0; i < students.size(); i++) {
list.append(students.elementAt(i).toString(), null); }
b: LWUIT list:
List list = new List(students);
Ref:

21. Styles and Themes Styles for individual components
Get an individual element’s style eg
Style s= lbl.getStyle()
Set styles eg
s.setBgTransparency(0);
S. setBgColor (0xff00ff)
See style object in API

22. Eg: Set style of each element
Display.init(this);
Form form = new Form("Test Style");
TextArea text = new TextArea("Test of style");
Style textStyle = text.getStyle();
textStyle.setBgSelectionColor(0xffffff);
textStyle.setFgSelectionColor(0x000000);
textStyle.setFont(Font.createSystemFont(Font.FACE_MONOSPACE, Font.STYLE_UNDERLINED, Font.SIZE_SMALL));
Button b = new Button("Test Button");
Style buttonStyle = b.getStyle();
buttonStyle.setBgColor(0x3333ff);
buttonStyle.setFgColor(0xffff33);
buttonStyle.setFont(Font.createSystemFont(Font.FACE_PROPORTIONAL, Font.STYLE_ITALIC + Font.STYLE_BOLD, Font.SIZE_LARGE));
form.addComponent(text);
form.addComponent(b);
form.show();
//other methods include: lbl.getStyle().setBgTransparency(0);

23. Themes To load a theme: Themes for look and feel of app
Use the Resource Editor to create a theme. Save as .res
Look in the utils folder for the resource editor
To load a theme:
Do call Display.init() first!
try {     Resources res = Resources.open(“/res/aTheme.res”);     UIManager.getInstance().setThemeProps(res.getTheme(“Test Theme”));      } catch (java.io.IOException ioe) {     ioe.printStackTrace(); }

24. Other J2ME UI frameworks
Examples include:
Apime
J2MEPolish
J4ME
kUIx
MWT
Synclast etc etc

25. Lab
Build a hello world application with LWUIT and transfer it to a phone.
Re-create the DVLA project using LWUIT.
Note that all events will remain the same.
Add as much pizzazz to your application

26. References http://www.devx.com/wireless/Article/38461/1954