GUI Design in MIDP

1
GUI Design in MIDP

• Yin-Hsong Hsu
• Oct. 2002

2
Introduction

• AWT and SWING are not supported in MIDP, since
• Limited resources in MIDP
• No mouse
• No Window
• Class hierarchy of GUI in MIDP

3
(No Transcript)
4

• All MIDP GUI classes are in the lcdui package
• import javax.microedition.lcdui.
• Only one Displayable can be displayed, Screen or
  Canvas
• Four kinds of Screen
• Predefined Components List, Alert, and TextBox
• Container Form

5
List

• A list is a screen of choices
• Three types of lists
• Exclusive Choice List enables the user to
  select one and only one element
• Multiple Choice List enables the user to select
  zero or more elements
• Implicit List enables the user to select one
  element and execute an action on it

6

• An example ListTest.java
• Exclusive choice and multiple choice
• Add Commands to catch the conform events

List l new List(List Test, Choice.EXCLUSIVE)
l.append (Item 1, null)
7

• Another example IMPListTest.java
• IMPLICIT List
• Action will be invoked once a choice is selected
• Just have to check whether command is
  List.SELECT_COMMAND

List l new List(List Test, Choice.IMPLICIT) l
.append (Item 1, null)
public void commandAction(Command c, Displayable
s) if (c List.SELECT_COMMAND)
8
Alerts

• An alert is a screen that gives users error
  messages or status information
• AlertType
• Alarm, Confirmation, Error, Info, Warning
• setTimeout(t) set the time for which the Alert
  is to be shown
• An example AlertTest.java

9
TextBox

• Text boxes are editable screens that can display
  one or more lines of text
• Constructor
• TextBox(title, text, maxSize, constraints)
• Constraints
• ANY, EMAIL_ADDR, NUMERIC, PASSWORD, PHONENUMBER,
  URL, CONSTRAINT_MASK

10

• An example TextBoxTest.java
• Methods
• setString(string)
• Insert(string, position)

new TextBox("TextBox??", "initial text", 256,
TextField.ANY)
11
Forms

• A form is a screen that can contain an arbitrary
  mixture of items images, text fields, gauges,
  choice groups, and so on

12
Form Items

• Forms contain one or more items, each of which
  can have a label
• Items
• StringItem, ImageItem, TextField, DateField,
  Guage, ChoiceGroup
• getLabel(), setLabel(label) defined in class Item

13

• StringItem StringItemTest.java
• getText(), setText()

14

• ImageItem provides layout control when Image
  objects are added to a Form or to an Alert
  ImageItemTest.java
• Image Object
• Image.createImage("/icons/Icon.png")
• ImageItem
• ImageItem(label string, image object, layout,
  atlText)
• Item layout
• ImageItem.LAYOUT_DEFAULT, LAYOUT_LEFT,
  LAYOUT_RIGHT, LAYOUT_CENTER, LAYOUT_NEWLINE_BEFORE
  , LAYOUT_NEWLINE_AFTER

15
Exception Handling in Java

• What's an Exception and Why Do I Care?
• Your First Encounter with Java Exceptions
• Java's Catch or Specify Requirement
• Dealing with Exceptions
• Throwing Exceptions

16
What's an Exception and Why Do I Care?

• An exception is an event that occurs during the
  execution of a program that disrupts the normal
  flow of instructions
• Throwing an exception
• Exception handler

17

• Advantages
• Separating Error Handling Code from "Regular"
  Code
• Propagating Errors Up the Call Stack
• Grouping Error Types and Error Differentiation
• Often exceptions fall into categories or groups
• Exception hierarchy

18
method1                 try
                    call method2
                catch (exception)
                    doErrorProcessing
                method2 throws exception
                call method3 method3 throws
exception                 call readFile
19
(No Transcript)
20
Your First Encounter with Java Exceptions

• The InputFile class example
• compile the file and read the errors
• fis new FileInputStream(filename)
• compiler errors
•  Exception  java.io.FileNotFoundException must be
  caugth, or it must be declared in throw clause of
  this method
• Except handling
• catch it
• handling the exception

21
Java's Catch or Specify Requirement

• Catch
• A method can catch an exception by providing an
  exception handler for that type of exception
• Specify
• If a method chooses not to catch an exception,
  the method must specify that it can throw that
  exception

22

• Checked exceptions
• run-time exception - is not checked by compilers
• checked exception - checked by compilers
• Exceptions that can be thrown within the scope of
  the method
• exceptions that are thrown directly by the method
  with Java's throw statement, and
• exceptions that are thrown indirectly by the
  method through calls to other methods

23
Catching and Handling Exceptions

• Specifying the exceptions thrown by a method
• the try block
• the catch block(s)
• the finally block

try             . . . catch (SomeThrowable
variable)             Java statements catch
( . . . )             . . . finally

24
Specifying the Exceptions Thrown by a Method

• Specifying the exceptions thrown but not catched
  by a method in method declaration
•   Public void writeList() throws IOException,
  ArrayIndexOutOfBoundsException
• The exception will then be handled by the caller

25
Throwing Exceptions

• The throw statement
•   throw someThrowableObject
• The Throwable class and its subclasses
• Errors, Exception, RuntimeException
• One can create his own exception classes

26

• ChoiceGroup a group of selectable elements
  intended to be placed within a Form
  ChoiceGroupTest.java
• ChoiceGroup
• new ChoiceGroup("ChoiceGroupTest",
  Choice.EXCLUSIVE)
• Only EXCLUSIVE and MULTIPLE are allowed
  ChoiceGroupTest2.java
• new ChoiceGroup("ChoiceGroupTest",
  Choice.MULTIPLE)

27

• TextField
• Similar to previous TextBox
• Gauge a bar graph display of a value intended
  for use in a form GaugeTest.java
• Constructor
• Gauge(label, interactive, maxValue, initValue)
• Methods
• setValue()
• getValue(value)

28

• DateField an editable component for presenting
  date and time information that may be placed into
  a Form DateFieldTest.java
• Constructor
• DateField(label, mode, timeZone)
• Mode DateField.DATE, DateField.TIME, and
  DateField.DATE_TIME
• Date is different in MIDP and J2ME
• Date.toString() in MIDP output a digit string
  instead of time string

29
public void itemStateChanged(Item item)
Calendar c Calendar.getInstance()
DateField tmp (DateField) item Date d
tmp.getDate() f.append("out "
d.getTime()) c.setTime(d)
f.append("real" c.toString())
30

• Tiker - a piece of text that runs continuously
  across the display TickerTest.java
• Ticker can be add to any Screen except Canvas
• f.setTicker(ticker) -- f is a form
• f.getTicker().setString(new string)
• Method
• setString(string), getString()

31
Canvas

• The Canvas class is a base class for writing
  applications that need to handle low-level events
  and to issue graphics calls for drawing to the
  display
• The Canvas extends from Displayable
• Only one Displayable can be displayed, Screen or
  Canvas

32
Event Delivery in Canvas

• paint(Graphics g)
• showNotify()
• hideNotify()
• keyPressed()
• keyRepeated()
• keyReleased()
• pointerPressed()
• pointerDragged()
• pointerReleased()
• the CommandListener's commandAction() method

33
Other Methods of Canvas

• getHeight(), getWidth()
• getGameAction(keyCode)
• getKeyCode(gameAction)
• repaint()
• hasPointerEvents()
• hasPointerMotionEvents()
• hasRepeatedEvents()
• isDoubleBuffered()

34
Graphics

• For drawing graphics in Canvas
• Setting methods
• setColor, setFont(), setGrayScale(),
  setStrokeStyle(), translate()
• Drawing methods
• drawChar(), drawChars(), drawString(),
  drawSubString(), drawLine(), drawRect(),
  drawArc(), drawRoundRect(), fillArc(),
  fillRect(), fillRoundRect(), drawImage()

35
Using Canvas

• Define your own Canvas class by extending from
  class Canvas
• Override paint() for drawing graphics
• Override event handling methods to handle low
  level events
• Use your own Canvas as previous Displayable
  classes
• Instantiate your own Canvas object and set it to
  the display

36
Checking Size of Canvas

• Methods
• getHeight(), getWidth()
• An example
• SizeCanvas.java
• SizeMIDlet.java
• Two class in a MIDlet suite, but only one MIDlet
• drawString(string, x, y, anchor)
• Anchor
• (LEFT, HCENTER, RIGHT) ((TOP, BASELINE, BOTTOM)

37
Coordination Systems of Canvas

• Methods
• translate(x, y) translate origin to (x, y)
• getTranslateX(), getTranslateY()
• An Example
• OrigTransCanvas.java
• OrigTransMIDlet.java

int step width/5 for(int i1 ilt5 i)
g.fillRect(0, 0, step, step)
g.translate(step, step)
38
Navigating Picture Using Coordinate Translation

• An example
• NavigateCanvas.java
• NavigateMIDlet.java
• this
• Image, drawImage()
• repaint()

g.translate(newX, newY) g.drawImage(image, 0, 0,
g.TOP g.LEFT)
if (s nc c leftCmd)
nc.setppingXY(stepX, 0) nc.repaint() else
if (s nc c rightCmd)
nc.setppingXY(-stepX, 0) nc.repaint()
39
Colors

• Methods for setting color
• setColor(r, g, b), setColor(rgb),
  setGrayScale(value)
• Methods for getting color
• getRedComponent(), getGreenComponent(),
  getBlueComponent(), getColor(), getGrayScale()
• Methods for query color information
• isColor(), numColors()

40

• Setting background color
• g.setGrayScale(255)
• g.fillRect(0, 0, width-1, height-1)
• Setting foreground color
• g.setGrayScale(0)
• g.drawRect(0, 0, 50, 50)
• StrokeStyle
• setStrokeStyle(style)
• Graphics.SOLID or Graphics.DOTTED

41
Drawing Shapes

• Drawing methods
• drawLine(), drawRect(), drawArc(),
  drawRoundRect(), fillArc(), fillRect(),
  fillRoundRect()
• An example
• BarCanvas.java, BarMIDlet.java

g.setColor(0xFFFFFF) g.fillRect(0, 0, width-1,
height-1)
42
Low Level Events

• Show events
• showNotify(), hideNotify(), paint(), repaint(),
  serviceRepaints()
• Key events
• keyPressed(), keyRepeated(), keyReleased(),
  hasRepeated()
• KeyCode
• KEY_NUM0, KEY_NUM1, , KEY_NUM9, KEY_POUND,
  KEY_STAR
• Method getKeyName(keyCode) returns a string

43

• Game action events
• getGameAction(keyCode), getKeyCode(gameAction)
• gameAction
• UP, DOWN, LEFT, RIGHT, FIRE,
• GAME_A, GAME_B, GAME_C, GAME_D
• An example
• GameActionCanvas.java, GameActionMIDlet.java
• protected methods

44

• Pointer events
• Usually used with touch-sensitive screen
• Methods
• hasPointerEvents(), hasPointerMotionEvents(),
  pointerPressed(), pointerReleased(),
  pointerDragged()

45
Handling Large Image

• Use GameAction to navigate the large image
• An example
• NavigateCanvas2.java NavigateMIDlet2.java

46
protected void keyPressed(int keyCode) int
gameAction getGameAction(keyCode)
switch(gameAction) case UP steppingXY(0,
stepY) break case DOWN steppingXY(0,
-stepY) break case LEFT steppingXY(stepX,
0) break case RIGHT steppingXY(-stepX,
0) break repaint()