Presentation Lcdui

  • 972 views
Uploaded on

 

More in: Business , Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
972
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
0
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. High Level User Interface Arief Purnama L.K.
  • 2. MIDlet User Interfaces
    • MIDlets are intended to be portable to a range of devices
    • Ranging from the very small, mainly two-color screens and restricted keypads on pagers and cell phones to the larger (PDA), often multicolor displays
  • 3. User Interface Overview
    • The user interface model for MIDP devices is very simple.
    • A MIDP device is required to display only a single "window" at a time
    • The MIDlet user interface library is implemented in the javax.microedition.lcdui package
      • includes several classes that represent the device's screen and provide the basic top-level windows
  • 4. The Display and Displayable Classes
    • The Display class represents a logical device screen on which a MIDlet can display its user interface.
    • you can obtain a reference to it by using the static getDisplay() method
    • Every screen that a MIDlet needs to display is constructed by mounting user interface components onto a top-level window derived from the abstract class Displayable
  • 5. The Display and Displayable Classes
    • Displayable is not visible to the user until it is associated with the MIDlet's Display object using the Display's setCurrent() method
    • public void setCurrent(Displayable displayable)
  • 6. Top-level user interface classes
  • 7. Canvas
    • The Canvas class is the cornerstone of the low-level GUI API
    • We will discussed this later
  • 8. Screen
    • Screen is the basic class from which the top-level windows of the high-level API are derived
    • Consists of:
      • TextBox
      • List
      • Form
      • Alert
  • 9. TextBox
    • TextBox is a component used to display and modify text
    • Since it is derived from Screen, TextBox occupies the entire screen of the device
    • can accomodate relatively large amounts of text spread over several lines.
  • 10. TextBox
  • 11. TextBox
    • Constructor
      • public TextBox(String title, String text, int maxSize, int constraints)
      • Constraints: TextField.ANY, TextField.NUMERIC, TextField.EMAILADDR, etc
    • Displaying TextBox
      • display = Display.getDisplay(this);
      • display.setCurrent(textBox);
  • 12. List
    • A List contains a series of choices presented in one of three formats
    • These format includes : Multiple, Exclusive, and Implicit
  • 13. List (Exclusive, Multiple, Implicit)
  • 14. List
    • Constructor
      • public List(String title, int type);
      • public List(String title, int type, String[] strings, Image[] images);
      • Type: List.EXCLUSIVE, List.MULTIPLE, List.IMPLICIT
    • Adding element to list
      • public int append(String string, Image image)
    • Displaying List
      • display = Display.getDisplay(this);
      • display.setCurrent(list);
  • 15. Form
    • Form is a subclass of Screen that can be used to construct a user interface from simpler elements such as text fields, strings, and labels.
    • Like TextBox , Form covers the entire screen
    • The elements that you can add to a Form are all derived from the abstract class Item
  • 16. Form
    • Empty form
  • 17. Items That Can Be Added to a Form
    • StringItem An item that allows a text string to be placed in the user interface
    • TextField A single-line input field much like the full-screen TextBox
    • DateField A version of TextField that is specialized for the input of dates; it includes a visual helper that simplifies the process of choosing a date
  • 18. Items That Can Be Added to a Form
    • Gauge A component that can be used to show the progress of an ongoing operation or allow selection of a value from a contiguous range of values
    • ChoiceGroup A component that provides a set of choices that may or may not be mutually exclusive and therefore may operate either as a collection of checkboxes or radio buttons
    • ImageItem A holder that allows graphic images to be placed in the user interface
  • 19. Form
    • Complete Form
  • 20. Form
    • Constructor
      • public Form(String title);
      • public Form(String title, Item[] items);
    • Form has three methods that allow items to be added
      • public void append(Item item);
      • public void append(Image image);
      • public void append(String string);
  • 21. Form Item: StringItem
    • Constructor:
      • StringItem (String label, String text)
    • Can be appended to form:
      • form.append(stringItem)
  • 22. Form Item: TextField
    • Constructor
      • TextField (String label, String text, int maxSize, int constraints)
    • Constraints:
      • The TextField shares the concept of input modes with the TextBox class :
        • ANY, EMAILADDR, NUMERIC, PHONENUMBER, URL
    • Can be appended to form:
      • form.append(textField)
  • 23. Form Item: DateField
    • Constructor:
      • DateField (String label, int mode)
      • label: date field label
      • mode: DATE , DATE_TIME, TIME
    • Can be appended to form:
      • form.append(dateField)
  • 24. Form Item: DateField Screenshots
    • DATE
    • TIME
    • DATE_TIME
  • 25. Form Item: Gauge
    • Gauge(String label, boolean interactive,
    • int maxValue, int initialValue)
      • interactive == true  user can change the value
      • Interactive == false  only system can change the value
    • Can be appended to form:
      • form.append(gauge)
  • 26. Form Item: ChoiceGroup
    • Constructor:
      • ChoiceGroup (String label, int choiceType)
      • ChoiceGroup (String label, int choiceType,
      • String[] stringElements,
      • Image[] imageElements)
      • choiceType: EXCLUSIVE, MULTIPLE, or POPUP
    • Adding element to ChoiceGroup:
      • choiceGroup. append (String stringPart, Image imagePart)
    • Can be appended to form:
      • form.append(choiceGroup)
  • 27. Form Item: ChoiceGroup ScreenShots
    • EXCLUSIVE
    • MULTIPLE
    • POPUP
  • 28. Form Item: ImageItem
    • Constructor
      • ImageItem (String label, Image img, int layout, String altText)
      • layout: LAYOUT_DEFAULT, LAYOUT_LEFT, LAYOUT_RIGHT, LAYOUT_CENTER,
      • LAYOUT_NEWLINE_BEFORE,
      • LAYOUT_NEWLINE_AFTER
      • altText = alternate text string
    • Can be appended to form:
      • form.append(imageItem)
  • 29. Alert
    • Alert is a subclass of Screen that behaves much like a dialog
    • When an Alert is displayed by calling the Display setCurrent( ) method, it covers some or all of the device screen
  • 30. Alert
    • Alert has several attributes that determine its appearance and behavior:
      • Title : An Alert is not required to have a title
      • String : message that the Alert displays to the user
      • Image : optional image
      • Timeout : Specifies how long the Alert is displayed
      • Type : AlertType.ALARM, AlertType.CONFIRMATION,
      • AlertType.ERROR, AlertType.INFO,
      • AlertType.WARNNG
  • 31. Alert
    • Constructor
      • Alert alert = new Alert("Alert Title", "This is an Alert", alertImage, AlertType.ERROR);
    • Set Alert’s timeout
      • setTimeout(int timeOut);
      • Timeout: in milliseconds, or Alert.FOREVER
    • Displaying Alert
      • Display.getDisplay(this).setCurrent(alert);
  • 32. Alert
    • Alert (in seconds and forever)
  • 33. Ticker
    • A high-level API class that displays a scrolling text message on a Screen
    • The ticker is associated with a Screen by calling its setTicker()
    • Constructor
      • Ticker (String str)
    • Can be appended to screen (and it’s subclasses):
      • Ex: form.setTicker(ticker)
  • 34. Ticker ScreenShot
  • 35. Commands
    • Commands are a feature of the Displayable class
    • To use commands, our midlet has to implement CommandListener interface
    • Then, our midlet Class must implement the inherited abstract method: commandAction(Command, Displayable)
  • 36. Commands
    • Constructor
      • public Command(String label, int type,
      • int priority);
      • The label argument supplies the text that will be used to represent the Command in the user interface
      • type and priority arguments are hints that the MIDP implementation can use when deciding where the Command will be placed
  • 37. Command Type Parameter
    • OK : Implies agreement by the user for some operation to be performed.
    • BACK : Replaces the currently displayed screen with the one that preceded it.
    • CANCEL : Abandons an operation before it has been initiated
    • STOP : Stops an operation that is already in progress
    • EXIT : Requests that the MIDlet stop all outstanding operations and terminate
    • HELP : Requests general or context-sensitive help
    • SCREEN : Relates to the function of the current screen (application specific)
  • 38. Commands
    • Adding Commands to the user interface
      • public void addCommand(Command cmd);
    • Responding to user activation of Commands
      • public void setCommandListener(CommandListener l);
    • The commandAction( ) method is called when any Command on the Displayable is activated
  • 39. Command: commandAction() Example
    • public void commandAction(Command c, Displayable d)
    • {
    • if(c == testCommand) //command object
    • {
    • System.out.println(“test command pressed”);
    • }
    • else if( c == backCommand) //command object
    • {
    • System.out.println(“back command pressed”);
    • }
    • }
  • 40.
    • Q & A