MIDP GUI Development: Alert, List, Form, TextBox

33
MIDP GUI Development: Alert, List, Form, TextBox Jussi Pohjolainen Tampere University of Applied Sciences

description

 

Transcript of MIDP GUI Development: Alert, List, Form, TextBox

Page 1: MIDP GUI Development: Alert, List, Form, TextBox

MIDP  GUI  Development:    Alert,  List,  Form,  TextBox  

Jussi  Pohjolainen  Tampere  University  of  Applied  Sciences  

Page 2: MIDP GUI Development: Alert, List, Form, TextBox

Displayable  Class  Hierarchy  

javax.microedi-on.lcdui   javax.microedi-on.lcdui.game  

Displayable  

Alert   List   Form   TextBox  

Screen  

Canvas   GameCanvas  

Page 3: MIDP GUI Development: Alert, List, Form, TextBox

TextBox  

•  To  get  the  user  input  

•  TextBox a = new TextBox(String title, String text, int maxSize, int constraints)

Page 4: MIDP GUI Development: Alert, List, Form, TextBox

Types  and  Flags  

•  Types  –  TextField.ANY –  TextField.NUMERIC –  TextField.DECIMAL –  TextField.PHONENUMBER –  TextField.EMAILADDR –  TextField.URL

•  Flags  –  TextField.PASSWORD

–  TextField.UNEDITABLE

–  TextField.NON_PREDICTIVE

–  TextField.INITIAL_CAPS_WORD

–  TextField. INITIAL_CAPS_SENTENCE

Page 5: MIDP GUI Development: Alert, List, Form, TextBox

TextBox  Usage  

TextBox textbox =

new TextBox("Sähköposti",

"",

64,

TextField.EMAILADDR |

TextField.PASSWORD);

Page 6: MIDP GUI Development: Alert, List, Form, TextBox

Displayable  Class  Hierarchy  

javax.microedi-on.lcdui   javax.microedi-on.lcdui.game  

Displayable  

Alert   List   Form   TextBox  

Screen  

Canvas   GameCanvas  

Page 7: MIDP GUI Development: Alert, List, Form, TextBox

Alerts  

•  There  are  two  types  of  alerts  – Timed  Alert  •  Displayed  certain  amount  of  Ime  

– Modal  Alert  •  Demands  user  confirmaIon  

Modal  Alert  

Page 8: MIDP GUI Development: Alert, List, Form, TextBox

Alert  -­‐  class  

•  Constructor  –  public Alert(String title, String alertText, Image alertImage, AlertType alerttype);!

•  Methods  – setTimeOut(...)!– setTimeOut(Alert.Forever)!– addCommand(...)!

•  AlertTypes  – ALARM, CONFIRMATION, ERROR, INFO, WARNING!

Page 9: MIDP GUI Development: Alert, List, Form, TextBox

Displayable  Class  Hierarchy  

javax.microedi-on.lcdui   javax.microedi-on.lcdui.game  

Displayable  

Alert   List   Form   TextBox  

Screen  

Canvas   GameCanvas  

Page 10: MIDP GUI Development: Alert, List, Form, TextBox

EXCLUSIVE,  MULTIPLE  and  IMPLICIT  

Page 11: MIDP GUI Development: Alert, List, Form, TextBox

ConstrucIng  Lists  

•  When  you  create  a  list,  you  define  list's  

–  type  (EXCLUSIVE,  MULTIPLE,  IMPLICIT)  

–  Itle  –  string  elements  and  images  (voluntary)  

•  API:  –  public List(String title, int type):

–  public List(String title, int type, String [] stringelements, Image[] imageElements);

•  Scrolling  is  automaIcally  available  

•  It  is  possibly  to  add  elements  to  the  list  with  append-method.  

Page 12: MIDP GUI Development: Alert, List, Form, TextBox

List  Example  1  public class MyList extends MIDlet{ private List mList; public MyList() { mList = new List(”Wanna Buy?”, Choice.MULTIPLE);

mList.append(“Herring”, null); mList.append(“Goose Liver”, null); mList.append(“Jelly”, null);

} public void startApp() { Display.getDisplay(this).setCurrent(mList); } public void destroyApp(boolean unconditional) {} public void pauseApp() {} }

Page 13: MIDP GUI Development: Alert, List, Form, TextBox

List  Example  2  

public MyList() {

String [] elements = {"hyytelöä", "kananmaksaa", "ituja"};

mLista = new List("Haluatko ostaa?", Choice.MULTIPLE, elements, null);

}

Page 14: MIDP GUI Development: Alert, List, Form, TextBox

Adding  and  Removing  List  elements  

•  It  is  possible  to  add  and  remove  list  elements  •  The  elements  are  accessible  by  index  (0...n)  •  Replacing  a  element:  set(...)    •  Adding  element:  append(...)    •  Adding  element  to  a  certain  place:  insert(...) •  Finding  element:  String getString(int n) •  Removing  element:  void delete(int n)

Page 15: MIDP GUI Development: Alert, List, Form, TextBox

MIDP  2.0  List  

•  How  do  you  treat  the  elements,  if  they  don't  fit  into  mobile  device's  screen?  – setPolicy(...);  •  Choice.TEXT_WRAP_ON,  Choice.TEXT_WRAP_OFF,  Choice.TEXT_WRAP_DEFAULT  

•  Changing  the  font:  – setFont(...)  

Page 16: MIDP GUI Development: Alert, List, Form, TextBox

List  SelecIon  

•  How  to  find  out  what  element  user  selected?  –  public boolean isSelected(int i)!–  public int getSelectedIndex()!–  public void setSelectedIndex(int i, boolean s)!

•  See  ListExample.java  

Page 17: MIDP GUI Development: Alert, List, Form, TextBox

Displayable  Class  Hierarchy  

javax.microedi-on.lcdui   javax.microedi-on.lcdui.game  

Displayable  

Alert   List   Form   TextBox  

Screen  

Canvas   GameCanvas  

Page 18: MIDP GUI Development: Alert, List, Form, TextBox

Intro  to  Form  

•  Form  is  a  GUI-­‐component  that  can  hold  other  GUI-­‐components    

•  These  othe  GUI-­‐components  are  called  items.  

•  If  there  are  many  items,  the  form  will  provide  scrolling  mechanism.  

•  Constructors:  –  public Form(String title)!–  public Form(String title, Item[] items)!

Page 19: MIDP GUI Development: Alert, List, Form, TextBox

Handling  Items  

•  Adding  Items  to  the  Form:  –  Form a = new Form(“otsikko”);!–  a.append(Item item);!–  a.append(String str);!–  a.append(Image image);!

•  Every  item  has  an  index:  –  a.set(int index, Item item)!–  a.insert(int index, Item item)!–  a.delete(int index)!

•  Other  methods:  –  int size();!–  Item get(int index)!

Page 20: MIDP GUI Development: Alert, List, Form, TextBox

Simple  Example  

mForm = new Form("Otsikko");

mForm.append("moi");

mForm.append("hei");

mForm.append("tere");

Page 21: MIDP GUI Development: Alert, List, Form, TextBox

Using  Items  

•  There  are  many  items.  •  javax.microedition.lcdui.Item:!– ChoiceGroup!– CustomItem // We will look this..!– DateField!– Gauge!– ImageItem // .. and this later!– Spacer!– StringItem!– TextField!

Page 22: MIDP GUI Development: Alert, List, Form, TextBox

Item  Layout  

•  Every  Form  item  can  have  a  layout:  –  LAYOUT_LEFT!–  LAYOUT_RIGHT!–  LAYOUT_CENTER!–  ...!

•  See  API!

Page 23: MIDP GUI Development: Alert, List, Form, TextBox

Using  Item  Layout  StringItem layoutLeft = new StringItem("Layout: ", "LEFT");

layoutLeft.setLayout(Item.LAYOUT_LEFT);

StringItem layoutCenter = new StringItem("Layout: ", "CENTER");

layoutCenter.setLayout(Item.LAYOUT_CENTER);

StringItem layoutRight = new StringItem("Layout: ", "RIGHT");

layoutRight.setLayout(Item.LAYOUT_RIGHT);

mForm.append(layoutLeft);

mForm.append(layoutCenter);

mForm.append(layoutRight);

Page 24: MIDP GUI Development: Alert, List, Form, TextBox

StringItem  

•  Represents  a  simple  “Label”

Form form = new Form("Title"); StringItem st = new StringItem("Label: "; "Value"); form.append(stringItem);

Page 25: MIDP GUI Development: Alert, List, Form, TextBox

Item:  Spacer  

•  Spacer  provides  empty  space  in  the  form.  – Spacer empty = new Spacer(100,50); !

Page 26: MIDP GUI Development: Alert, List, Form, TextBox

Item:  TextField  

•  TextField:  –  public TextField(String label, String text, int maxSize, int constraints)!

•  Constraints  (same  as  in  TextBox)  –  ANY, NUMERIC, DECIMAL, PHONENUMBER, EMAILADDR, URL!

–  PASSWORD, SENSITIVE; UNEDITABLE...!

Page 27: MIDP GUI Development: Alert, List, Form, TextBox

Item:  DateField  

•  Date  and  Time  input.  –  public DateField(String label, int mode)!–  public DateField(String label, int mode, TimeZone timezone)!

•  mode  – DATE, TIME, DATE_TIME!

•  Get  and  Set-­‐methods:  – public Date getDate()!– public void setDate()!

Page 28: MIDP GUI Development: Alert, List, Form, TextBox

DateField  Images  

Page 29: MIDP GUI Development: Alert, List, Form, TextBox

Item:  Gauge  

•  Gauge  presents  integer  in  a  graphical  form.  –  public Gauge(String label, boolean interactive, int maxValue, int initialValue)

•  By  using  parameter  interacIve  it  is  possible  to  define  can  the  user  modify  the  gauge.  

•  IniIalValue  can  also  be:  •  CONTINUOUS_IDLE !•  INCREMENTAL_IDLE !•  CONTINUOUS_RUNNING !•  INCREMENTAL_UPDATING !

Page 30: MIDP GUI Development: Alert, List, Form, TextBox

Gauge  Images  

Gauge kake1 = new Gauge("Editoitava", true, 100, 0);

Gauge kake2 = new Gauge("Ei-editoitava", false, 100, 50);

Gauge kake3 = new Gauge("INCREMENTAL_UPDATING", false, Gauge.INDEFINITE, Gauge.INCREMENTAL_UPDATING); Gauge kake6 = new Gauge("CONTINUOUS_RUNNING", false, Gauge.INDEFINITE, Gauge.CONTINUOUS_RUNNING);

Page 31: MIDP GUI Development: Alert, List, Form, TextBox

Item:  ChoiceGroup  

•  Like  List  – public ChoiceGroup(String label, int choiceType, String [] elements, Image[] imageElements)!

•  Choicetype  – EXCLUSIVE!– MULTIPLE!– MIDP 2.0: POPUP!

Page 32: MIDP GUI Development: Alert, List, Form, TextBox

ChoiceGroup  Images  

String [] lista = {"suomi", "ruotsi"};

ChoiceGroup choicegroup = new ChoiceGroup("Valitse maa", Choice.POPUP, lista, null);

Page 33: MIDP GUI Development: Alert, List, Form, TextBox

Items  and  Event  Handling  

•  Instead  of  using  CommandListener  you  now  use  ItemStateListener.  

•  Set  the  event  source  to  form  and  the  listener  has  to  implement  ItemStateListener  interface.  

•  The  interface  has  only  one  method:  – itemStateChanged(Item item)!

•  Example