Transcript 2 – MIDP High-Level User Interface

Marsel Willem Aipassa, S. Kom.
MIDP High-Level User
Interface
Pemrograman Aplikasi Mobile
Pengenalan IDE
IDE yang digunakan adalah Netbeans
6.7 dan Netbeans Mobility Pack
IDE adalah sebuah lingkungan
pemrograman (programming
environment) yang memiliki GUI
builder, text atau code editor,
compiler dan/atau interpreter dan
debugger.
Netbeans Mobility Pack memiliki
device emulator yang dpat membuat
kita melihat program kita pada device
yang sesugguhnya
Marsel Willem Aipassa, S. Kom.
MIDP User Interface
Display
Displayable
Title
Command
CommandListener
Ticker
Screen
Item
Display adalah inti dari MIDP UI
Instance dari Display didapatkan menggunakan method
static Display.getDisplay()
3
Marsel Willem Aipassa, S. Kom.
MIDP User Interface
Display
Displayable
Title
Command
CommandListener
Ticker
Screen
Item
Displayable adalah interface yang dapat ditampilkan di
Display
Hanya ada satu Displayable yang dapat ditampilkan pada
suatu waktu
Sebuah Displayable ditampilkan ke Display dengan
pemanggilan method setCurrent () yang berasal dari
instance Display
Method setCurrent() harus dipanggil pada saat memulai
aplikasi
4
Marsel Willem Aipassa, S. Kom.
MIDP User Interface
Display
Displayable
Title
Command
CommandListener
Ticker
Screen
Item
Title merupakan atribut dari Displayable, menunjukan
judul dari Displayable tersebut
Posisi dan tampilan dari title ditentukan oleh perangkat
dimana aplikasi berjalan.
5
Marsel Willem Aipassa, S. Kom.
MIDP User Interface
Display
Displayable
Title
Command
CommandListener
Ticker
Screen
Item
Command merupakan pengganti menu bar
Objek Command berisi informasi tentang action yang
akan dikerjakan tapi tidak berisikan kode/perintah yang
harus dieksekusi
Konstruktor Command
New Command(“OK”, Command.OK, 1);
Tipe Command : Command.OK, Command.BACK,
Command.CANCEL, Command.EXIT, Command.HELP,
Command.ITEM, Command.SCREEN, Command.STOP
Command dimasukkan ke dalam Displayable dengan
method addCommand() dari Displayable tersebut
6
Marsel Willem Aipassa, S. Kom.
MIDP User Interface
Display
Displayable
Title
Command
CommandListener
Ticker
Screen
Item
CommandListener merupakan interface dengan satu
method:
void commandAction(Command command,
Displayable displayable)
Method CommandAction() akan dipanggil jika suatu
Command dipilih
Variabel command merupakan referensi dari command
yang dipilih dan varibel displayable merupakan referensi
dari displayable mana command tersebut berasal
MIDlet yang ingin menggunakan Command harus
mengimplementasikan kelas CommandListener
7
Marsel Willem Aipassa, S. Kom.
MIDP User Interface
Display
Displayable
Title
Command
CommandListener
Ticker merupakan baris text yang dapat discrolling terusmenerus pada Displayable
Ticker dipasang ke Displayable dengan fungsi setTicker()
Ticker
Screen
Item
8
Marsel Willem Aipassa, S. Kom.
MIDP User Interface
Display
Displayable
Title
Command
CommandListener
Ticker
Screen merupakan kelas abstrak yang digunakan untuk
High-Level UI
Subkelas abstrak dari kelas Screen antra lain Form,
TextBox, List, Alert
Screen
Item
9
Marsel Willem Aipassa, S. Kom.
MIDP User Interface
Display
Displayable
Title
Command
CommandListener
Ticker
Screen
Item merupakan komponan yang diletakkan pada
kontainer (Screen)
Beberapa subkelas item antara lain TextField,
ChoiceGroup, ImageItem & StringItem
Item
10
Marsel Willem Aipassa, S. Kom.
Letak UI
11
Marsel Willem Aipassa, S. Kom.
…
12
Marsel Willem Aipassa, S. Kom.
High-Level User Interface
Alert
List
Form
ChoiceGroup
DateField
StringItem
ImageItem
TextField
Timer & TimerTask
Alert merupakan sebuah Screen yang dapat
menampilkan teks dan gambar
Biasanya dipergunakan untuk menampilkan error,
warning, atau informasi
Konstruktor Alert:
new Alert(String title, String alertText, Image
alertImage, AlertType alertType);
13
Marsel Willem Aipassa, S. Kom.
Contoh..
 Simple MIDlet dengan Alert dan Command
14
Marsel Willem Aipassa, S. Kom.
High-Level User Interface
Alert
List
Form
ChoiceGroup
DateField
StringItem
ImageItem
TextField
Timer & TimerTask
List merupakan subclass dari Screen yang menampilkan
daftar pilihan
Mode pilihan dibagi menjadi tiga tipe : IMPLICIT,
EXCLUSIVE dan MULTIPLE
15
Marsel Willem Aipassa, S. Kom.
Contoh..
 Simple MIDlet dengan List
16
Marsel Willem Aipassa, S. Kom.
High-Level User Interface
Alert
List
Form merupakan subclass dari Screen
Form
Form merupakan continer untuk item sepert TextField,
StringItem, ImageItem, DateField dan ChoiceGroup
ChoiceGroup
DateField
StringItem
ImageItem
TextField
Timer & TimerTask
Item dimasukkan ke dalam Form dengan method
append() dan insert()
17
Marsel Willem Aipassa, S. Kom.
High-Level User Interface
Alert
List
Form
ChoiceGroup merupakan item group dari selectable
choice
ChoiceGroup
Sebuah choice dapat berupa teks, gambar atau keduanya
DateField
StringItem
ImageItem
TextField
Timer & TimerTask
Mode pilihan ChoiceGroup dapat berupa EXCLUSIVE,
MULTIPLE, atau POPUP
Fungsi GetSelectedIndex akan mengembalikan nilai index
dari choice yang dipilih
Fungsi GetSelectedFlags akan mengembalikan array dari
pilihan-pilihan yang dipilih (mode MULTIPLE)
18
Marsel Willem Aipassa, S. Kom.
Contoh..
 Simple MIDlet dengan Form dan ChoiceGroup
19
Marsel Willem Aipassa, S. Kom.
High-Level User Interface
Alert
List
Form
ChoiceGroup
DateField
StringItem
ImageItem
TextField
Timer & TimerTask
Item DateField digunakan sebagai input waktu dan
tanggal dari user
Mode DateField antara lain date entry (mode DATE), time
entry (mode TIME) atau keduanya (mode DATE_TIME)
Untuk mendapatkan inputan digunakan method
getDate()
20
Marsel Willem Aipassa, S. Kom.
Contoh..
 Simple MIDlet dengan DateField
21
Marsel Willem Aipassa, S. Kom.
High-Level User Interface
Alert
List
Form
ChoiceGroup
DateField
StringItem
ImageItem
TextField
Timer & TimerTask
StringItem merupakan item yang terdiri dari label dan
text
StringItem memiliki beberapa mode tampilan antara lain
Item.PLAIN, Item.HYPERLINK ata Item.BUTTON
Jika mode yang digunakan adalah HYPERLINK atau
BUTTON maka default Command dan
ItemCommandListener harus diset
22
Marsel Willem Aipassa, S. Kom.
Contoh..
 Simple MIDlet dengan StringItem
23
Marsel Willem Aipassa, S. Kom.
High-Level User Interface
Alert
List
Form
ChoiceGroup
DateField
StringItem
ImageItem
TextField
Timer & TimerTask
ImageItem merupakan item yang dapat menampung
gambar dan dapat dimaukkan ke dalam kontainer seperti
Form
Konstruktor ImageItem
public ImageItem(String label, Image
image, int layout, String altText, int
appearanceMode)
24
Marsel Willem Aipassa, S. Kom.
Contoh..
 Simple MIDlet dengan ImageItem
25
Marsel Willem Aipassa, S. Kom.
High-Level User Interface
Alert
List
Form
ChoiceGroup
DateField
StringItem
ImageItem
TextField
Timer & TimerTask
TextFied merupakan item dimana user dapat
memasukkan inputan teks
TextField memiliki beberapa constraint (batasan) antara
lain TextField.ANY, TextField.EMAILADDR,
TextField.NUMERIC, TextField.PHONENUMBER,
TextField.URL, TextField.DECIMAL, TextField.PASSWORD
dan lainnya
Constraint dari TextField dapat digabung dengan
menggunakan operator bit-wise OR (|)
26
Marsel Willem Aipassa, S. Kom.
Contoh..
 Simple MIDlet dengan TextField
27
Marsel Willem Aipassa, S. Kom.
High-Level User Interface
Alert
List
Form
ChoiceGroup
DateField
StringItem
ImageItem
TextField
Timer &
TimerTask
Timer dan TimerTask berfungsi untuk melakukan
penjadwalan tugas pada waktu-waktu tertentu
Tugas tersebut dapat dijadwalkan untuk diulang-ulang
sampai interval tertentu
Task dibuat di suatu kelas tersendiri dengan menurunkan
(extend) kelas TimerTask dan mengimplementasikan
method run()
Method run() inilah yang akan dieksekusi berdasarkan
interval yang ada di Timer
Untuk menjadwalkan (eksekusi) suatu tugas digunakan
method schedule() dari kelas Timer
28
Marsel Willem Aipassa, S. Kom.
Contoh..
 Simple MIDlet dengan Timer dan TimerTask
29
Marsel Willem Aipassa, S. Kom.