IV-1
BAB IV
PERANCANGAN
Pada Bab IV ini akan dijelaskan perancangan aplikasi pengiriman pesan teks ber-markup via Short Message Service (SMS).
4.1 Subsistem Pengirim Pesan (Sender)
Dari hasil analisis pada Bab III, didapatkan kelas-kelas yang menyusun subsistem aplikasi pengirim pesan (sender) adalah MessageEditor, MarkupCreator, MessageCompressor, DestNumberForm, dan MessageSender. Tabel IV-1 menunjukkan deskripsi untuk masing-masing kelas.
Tabel IV-1 Rancangan Kelas Aplikasi Pengirim Pesan
No Nama Kelas Deskripsi
1 MessageEditor Kelas yang berfungsi menyediakan tempat bagi pengguna menulis pesan teks dengan berbagai style yang mungkin 2 MarkupCreator Kelas yang membagkitkan tag-tag yang merepresentasikan
style teks yang dimaksud oleh pengguna
3 MessageCompressor Kelas yang bertanggung jawab melakukan kompresi terhadap pesan teks yang akan dikirim
4 DestNumberForm Kelas form untuk memasukkan nomor tujuan penerima pesan teks
5 MessageSender Kelas yang bertanggung jawab melakukan pengiriman pesan
4.1.1 Kelas MessageEditor
Kelas MessageEditor berfungsi menyediakan tempat bagi pengguna untuk menulis pesan teks dengan berbagai style yang mungkin. Pada implementasinya, kelas MessageEditor merupakan turunan kelas Canvas pada MIDP 2.0 Java 2 Micro Edition. Oleh karena itu, kelas MessageEditor akan melakukan override metode-metode dari kelas Canvas diantaranya adalah keyPressed(), keyReleased(), paint(), dan repaint(). MessageEditor menyimpan string pesan yang akan dikirim oleh MessageSender. MessageEditor memiliki sebuah kursor untuk menunjukkan posisi dimana pengguna menuliskan teks.
MessageEditor menyimpan current information dari pesan teks yang ditulis oleh pengguna. Current information tersebut meliputi:
1. Posisi kursor
2. Jenis font yang sedang digunakan 3. Ukuran font yang sedang digunakan 4. Style yang sedang digunakan
5. Warna yang sedang digunakan
6. Current character yaitu karakter yang terakhir kali ditulis dalam MessageEditor
Current information tersebut akan dikirim kepada MarkupCreator untuk membangkitkan tag-tag markup yang sesuai.
4.1.2 Kelas MarkupCreator
Kelas MarkupCreator berfungsi untuk menyisipkan tag-tag pada pesan teks yang ditulis pada MessageEditor. Ketika pengguna memilih suatu atribut tertentu untuk pesan teks (baik berupa font face, font size, font color, maupun font style), MarkupCreator akan menyisipkan tag yang sesuai pada pesan teks yang akan dikirim.
4.1.3 Kelas MessageCompressor
Kelas MessageCompressor bertanggung jawab melakukan kompresi terhadap pesan teks yang akan dikirim. Kelas MessageCompressor memiliki metode compressMessage() yang berisi algoritma kompresi teks. MessageCompressor mendapat input string dari MessageEditor dan akan menghasilkan pesan teks yang telah terkompresi. Output dari kompresi ini akan dikirim oleh MessageSender.
4.1.4 Kelas DestNumberForm
Kelas DestNumberForm merupakan kelas turunan dari kelas Form yang dibuat untuk memasukkan nomor tujuan pengiriman pesan teks. Kelas ini akan memiliki atribut
phoneNumber dan akan memiliki metode getPhoneNumber(). Nomor tujuan pengiriman
pesan teks yang terdapat pada kelas ini akan digunakan oleh MessageSender untuk melakukan pengiriman pesan.
4.1.5 Kelas MessageSender
Kelas MessageSender bertanggung jawab melakukan pengiriman pesan. MessageSender memiliki metode send(). Pesan yang dikirim oleh MessageSender merupakan binary
message. Pesan dikirim melalui port tertentu sehingga MessageSender memiliki sebuah
atribut mPort.
4.2 Subsistem Penerima Pesan (Receiver)
Dari hasil analisis pada Bab III, didapatkan kelas-kelas yang menyusun aplikasi penerima pesan (receiver) adalah MessageReceiver, MessageDecompressor, dan MessageViewer. Tabel IV-2 menunjukkan rancangan subsistem Penerima Pesan.
Tabel IV-2 Rancangan Kelas Aplikasi Penerima Pesan
No Nama Kelas Deskripsi
1 MessageReceiver Kelas yang bertanggung jawab terhadap penerimaan pesan yang masuk ke handset
2 MessageDecompressor Kelas yang bertanggung jawab melakukan dekompresi pesan sehingga diperoleh pesan seperti semula
3 MessageViewer Kelas yang bertanggung jawab membaca dan menampilkan pesan teks sebagaimana yang dikirimkan oleh pengirim pesan
4.2.1 Kelas MessageReceiver
Kelas MessageReceiver bertanggung jawab menerima pesan yang masuk ke handset. Pesan yang diterima merupakan pesan teks. Pesan teks yang diterima akan diberikan kepada MessagetDecompressor untuk dilakukan dekompresi.
4.2.2 Kelas MessageDecompressor
Kelas MessageDecompressor bertanggung jawab melakukan dekompresi terhadap pesan teks yang diterima oleh MessageReceiver. MessageDecompressor memiliki metode
decompressMessage() untuk melakukan dekompresi pesan teks yang diperoleh dari
MessageReceiver. Hasil dekompresi akan diberikan kepada MessageViewer untuk ditampilkan kepada pengguna.
4.2.3 Kelas MessageViewer
Kelas MessageViewer bertanggung jawab membaca pesan teks, menerjemahkan markup, lalu menampilkan pesan teks sebagaimana yang dikirim oleh pengirim pesan. Sama halnya dengan MessageEditor, MessageViewer ini merupakan turunan kelas Canvas yang telah disediakan oleh MIDP 2.0 Java 2 Micro Edition. Oleh karena itu, kelas
MessageViewer akan melakukan override terhadap metode-metode yang dimiliki Canvas diantaranya paint()dan repaint().
4.3 Kelas-kelas List
Pada aplikasi pengiriman pesan teks ber-markup via SMS ini terdapat beberapa kelas yang merupakan turunan kelas List pada J2ME. Kelas-kelas List tersebut digunakan untuk menyimpan dan menampilkan variasi-variasi huruf yang akan dipilih oleh pengguna.
Tabel IV-3 Tabel Kelas List
No Nama Kelas Deskripsi
1 MenuList Kelas List menu messaging yang terdiri dari write message
dan inbox
2 MessageList List pesan yang masuk pada inbox aplikasi
3 StyleList List berbagai style huruf yang didukung oleh aplikasi
4 SizeList List berbagai ukuran huruf yang didukung oleh aplikasi 5 FaceList List berbagai tipe font yang didukung oleh aplikasi 6 ColorList List berbagai warna huruf yang didukung oleh aplikasi 7 SmileyList List smiley yang dapat ditambahkan pada pesan
4.4 Kelas Messenger
Kelas MIDlet pada aplikasi pengiriman pesan teks format ber-markup ini adalah kelas Messenger. Messenger merupakan kelas utama dari aplikasi pengiriman pesan teks
ber-markup via SMS. Karena kelas ini merupakan kelas turunan dari kelas MIDlet maka
kelas ini melakukan override terhadap metode-metode startApp(), pauseApp(), serta
destroyApp(). Diagram kelas perancangan untuk aplikasi pengiriman pesan teks
ber-markup via SMS ditampilkan pada Gambar IV-1.
4.5 Kelas RecordStore
Kelas RecordSore merupakan kelas yang digunakan untuk melakukan penyimpanan data persisten pada platform J2ME. Pada aplikasi pengiriman pesan teks ber-markup ini, kelas RecordStore digunakan untuk menyimpan pesan teks yang masuk pada inbox aplikasi. Data yang disimpan pada RecordStore dalam hal ini adalah pesan teks dan alamat pengirim pesan teks tersebut.
MenuList parent cmSelect cmCancel commandAction() MessageCompressor modelIn compressMessage() copyStream() MessageSender adr port messageConnection send() DestNumberForm phoneNumber getPhoneNumber() MarkupCreator tagBold tagItalic tagUnderlined tagFontFace tagFontSize tagFontColor tagFontStyle insertTag() MessageReceiver senderAddress messageConnection receive() MessageViewer message cmForward readMessage() paint() repaint() commandAction() MessageDecompressor modelOut decompressMessage() copyStream() MessageList parent cmSelect cmCancel commandAction() StyleList parent cmSelect cmCancel commandAction() SizeList parent cmSelect cmCancel commandAction() FaceList parent cmSelect cmCancel commandAction() ColorList parent cmSelect cmCancel commandAction() MessageEditor currentChar currentFace currentStyle currentColor currentSize message curX curY cursor cmNext cmFace cmSize cmStyle cmColor MessageEditor() keyPressed() paint() repaint() commandAction() SmileyList parent cmSelect cmCancel commandAction() Messenger mEditor mReceiver mDecompressor mViewer display port Messenger() startApp() pauseApp() destroyApp() RecordStore
Gambar IV-1 Diagram Kelas Perancangan
4.6 Rancangan Antarmuka
Rancangan antarmuka berikut ini terbagi atas rancangan antarmuka subsistem pengirim pesan dan rancangan antarmuka subsistem penerima pesan. Rancangan antarmuka subsistem pengirim pesan meliputi rancangan antarmuka message editor serta antarmuka terkait dengan menu-menu yang terdapat pada message editor. Menu-menu yang terdapat dalam message editor meliputi menu untuk memasukkan nomor tujuan pesan dan menu untuk melakukan mengubah setting huruf. Rancangan antarmuka penerima pesan sebatas rancangan bagaimana pesan ditampilkan.
4.6.1 Rancangan Antarmuka Aplikasi Pengirim (Sender)
Ketika user membuka aplikasi pengirim pesan (sender), aplikasi akan menampilkan
message editor dimana user dapat menulis pesan teks dengan variasi huruf yang
diinginkan. Pada tampilan ini terdapat menu untuk lanjut pada pengiriman pesan (next), menentukan warna huruf (font color), menentukan style huruf (font style), menentukan jenis huruf (font face), serta menentukan ukuran huruf (font size), serta menu keluar (exit)
dari program. Rancangan antarmuka aplikasi pengirim (sender) dapat dilihat pada Gambar IV-2 dan Gambar IV-3.
Gambar IV-2 Rancangan Antarmuka Message Editor
Pada ujung kanan atas ditampilkan informasi mengenai jumlah karakter pada pesan yang telah ditulis tersebut. Pada ujung kiri atas ditampilkan kursor yang menandakan tempat dituliskannya huruf.
Seperti yang terlihat pada Gambar IV-2, pada saat pengguna menulis pesan pada message
editor, pengguna dapat memilih menu sesuai kebutuhan. Pilihan Next akan berakibat
layar menampilkan halaman untuk memasukkan nomor tujuan pesan dikirim seperti terlihat pada Gambar IV-3.
Gambar IV-3 Rancangan Form Input Nomor Tujuan
Pada bagian bawah form terdapat menu Option yang berisi dua buah alternatif yaitu menu Add From Contact dan menu Send. Menu Add From Contact adalah menu yang otomatis dihasilkan ketika membuat input teks yang bertipe phone number. Menu Send akan memanggil metode sendMessage() pada kelas MessageSender.
Pilihan Font Color akan mengakibatkan layar menampilkan list warna yang mungkin. Rancangan list warna huruf dapat dilihat pada Gambar IV-4.
Gambar IV-4 Rancangan List Warna Huruf
Pilihan Font Style, Font Face, serta Font Size akan memiliki tampilan yang sama dengan tampilan antarmuka pilihan Font Color.
Pada saat layar menampilkan list warna huruf, list style huruf, list jenis huruf, serta list ukuran huruf, jika pengguna menekan menu OK maka layar akan kembali menampilkan
message editor.
4.6.2 Rancangan Antarmuka Subsistem Penerima (Receiver)
Aplikasi penerima (receiver) akan menampilkan pesan yang diterima. Berikut ini Rancangan tampilan pesan yang diterima ditunjukkan oleh Gambar IV-5.
