modul psb 6 j2me llui

MODUL PSB_6J2ME (Java 2 Micro Edition)

A. Tujuan :1. Memahami event handling level rendah dalam MIDP2. Menggambar dan menampilkan teks, line, Rectangle, Rounded Rectangle, Arc dan Triangle3. Menentukan warna, huruf, dan coretan untuk operasi menggambar menggunakan subclass

canvas

B. Dasar Teori

1. Event Handling Level rendah dalam MIDP

Pada latihan sebelumnya, kita telah membahas tentang bagaimana cara membuat user

interface level tinggi seperti list, form, dan field input. Mereka bersifat user interface level tinggi

dan programmer tidak perlu khawatir tentang menggambar pixel layar atau mengatur posisi teks

pada layar. Semua program telah menetapkan jenis komponen dan label elemen. Sistem tersebut

akan menangani gambar pada layar, scrolling dan layout.

Satu kelemahan ketika hanya menggunakan komponen user interface level tinggi adalah

program tidak memiliki kendali penuh sebuah layar. Ada saat dimana kita ingin menggambar

sebuah garis, gambar beranimasi dan mempunyai kendali untuk mengatur pixel pada layar.

Pada modul ini, kita akan berhadapan langsung dengan layar. Kita akan mempelajari class

Canvas, dimana akan menjadi pendukung dari proses menggambar kita. Kita juga akan

menyelidiki ke dalam class Graphic, dimana memiliki metode untuk menggambar garis, kotak,

sudut, dan teks. Kita juga akan membahas huruf, warna dan gambar.

2. CanvasCanvas adalah subclass dari Displayable. Itu adalah sebuah class abstrak yang harus di-

extend sebelum sebuah aplikasi dapat menggunakan fungsi-fungsi yang ada. Canvas dapat

digabungkan dengan subclass Displayable level tinggi yaitu Screen. Program dapat pindah ke dan

dari Canvas dan Screen.

Canvas menggambarkan metode-metode event handling kosong. Aplikasi harus

mengesampingkan mereka untuk handle event. Class Canvas menggambarkan sebuah metode

abstrak yang disebut paint(). Aplikasi menggunakan class Canvas harus menyediakan sebuah

implementasi untuk metode paint().

Canvas memiliki kemampuan berinteraksi dengan pengguna melalui mekanisme event

handling. Event handling ini dapat berupa antisipasi terhadap key event, game action dan pointer

event. Perangkat komunikasi, telepon seluler ataupun PDA, memiliki resolusi tampilan yang

sangat beragam.

Untuk mengetahui dimensi Canvas terkait dengan tampilan perangkat mobile, disediakan

method getWidth() dan getHeight(). MIDP 2.0 menyediakan fungsionalitas full screen mode.

Tetapi tidak semua perangkat mobile mendukung hal ini. Setting mode ini dapat dilakukan

dengan memanggil setFullScreenMode(boolean).

3. Sistem KoordinatGambar 1 menampilkan sistem koordinat dari Canvas adalah berbasis nol. Koordinat x dan

y dimulai dengan nol. Pojok kiri atas dari Canvas berkoordinat (0,0). Koordinat x bertambah dari

kiri ke kanan. Sedangkan koordinat y bertambah dari atas ke bawah. Metode getWidth() dan

getHeight() mengembalikan nilai lebar dan tinggi berturut-turut.

Gambar 1. Sistem Koordinat

Pojok kanan bawah pada layar memiliki koordinat (getWidth()-1,getWidth()-1). Setiap

perubahan yang terjadi pada ukuran yang diberikan untuk area menggambar pada Canvas

dilaporkan kepada aplikasi oleh metode sizeChanged(). Ukuran yang tersedia pada Canvas

mungkin saja berubah jika ada pergantian antara mode layar full dan normal atau penambahan

dan pengurangan sebuah komponen seperti Command.

Inti dari program ini adalah metode paint(). Set pertama dari pemanggilan metode adalah

membersihkan layar.

g.setColor(255, 255, 255 );g.fillRect(0, 0, getWidth(), getHeight());

Graphics memiliki method-method untuk menggambar dan mengisi bentuk-bentuk yang

sederhana.

Tabel 1. Method untuk menggambar bentuk‐bentuk sederhana

4. Event KeySubclass dari Canvas dapat merespon sebuah event tombol dengan metode-metode sebagai

berikut :

Canvas mendefinisikan kode tombol ini : KEY_NUM0, KEY_NUM1, KEY_NUM2,

KEY_NUM3, KEY_NUM4, KEY_NUM5, KEY_NUM6, KEY_NUM7, KEY_NUM8,

KEY_NUM9, KEY_STAR, and KEY_POUND.

Untuk mendapatkan “String” nama sebuah kunci, gunakan metode getKeyName(int

keyCode).

C. Percobaan

Gambar 2. File Percobaan Latihan 1 - 3

Latihan 1: Menggambar dan menampilkan teks, line, Rectangle, Rounded Rectangle, Arc dan Triangle

Latihan 1 menjelaskan cara menggambar/menampilkan teks, garis, persegi panjang, persegi

panjang bulat, busur, segitiga dalam satu aplikasi kecil. Mengacu pada semua latihan pada

modul sebelumnya, dalam latihan 1 kita masih menerapkan beberapa method dan variabel

dan menggabungkannya ke dalam sintak aplikasi canvas berikut. Di sini kita membuat List

jenis implisit disebut CanvasDrawList dan didefinisikan semua elemen ke dalamnya.

Penggunaan kelas Canvas untuk menarik semua grafik atau gambar yang ditampilkan pada

emulator sebagai berikut:

Gambar 3. Hasil Percobaan Latihan 1

Tampilan gambar di atas dapat dipanggil melalui class canvas dalam aplikasi dengan

sintaks berikut:

class CanvasDraw extends Canvas implements CommandListener

Dalam sintaks ini dapat dilihat bahwa kita menciptakan sebuah kelas yang disebut

CanvasDraw yang meng-extends kelas canvas melalui kata kunci "extends".

Source Code CanvasDrawExample.java

Latihan 2: Menggambar teks dengan class CanvasBoxText

Bahasa pemrograman J2ME Class Canvas pada Latihan 2 digunakan untuk melukis dan

menggambar diagram. Menggunakan class canvas yang sama kita akan menggambar sebuah

kotak di sekitar teks sebagai class MIDlet teks, disebut CanvasBoxText yang meng extends

class canvas yang telah ditetapkan untuk menggambar kotak. Kode berikut menggunakan

metode yang berbeda untuk mendapatkan nilai-nilai sebagai berikut:

o int width = getWidth();

o int height = getHeight();

o g.setColor(255, 0, 0);

o g.fillRect(0, 0, width, height);


o String sandeep = "SANDEEP";

o int w = font.stringWidth(sandeep);

o int h = font.getHeight();

o int x = (width - w) / 2;

o int y = height / 2;

o g.setFont(font);

o g.drawString(sandeep, x, y, Graphics.TOP | Graphics.LEFT);

o g.drawRect(x, y, w, h);

Setelah menjalankan contoh Anda akan mendapatkan output seperti di bawah ini ..

Gambar 4. Hasil Percobaan Latihan 2 BoxTextCanvas

Dalam output Anda dapat dengan mudah mengetahui teks "SANDEEP" yang telah

ditampilkan dalam kotak. Seperti dinyatakan sebelumnya, kita membutuhkan kelas kanvas

untuk menggambar seperti jenis grafis dalam aplikasi J2ME.

J2ME Source Code "BoxTextCanvas.java"

Text Example in J2ME

Latihan 3: Menggambar Arc pada lokasi berbeda

Latihan 1 menjelaskan contoh menggambar Arc (busur), menggambar lengkungan pada

layar. Dalam Latihan 3 akan menunjukkan cara menggambar busur di lokasi yang berbeda.

Metode yang digunakan dalam aplikasi ini adalah sebagai berikut:

o g.setColor(255, 162, 117);

o g.fillRect(0, 0, width, height);


o g.fillArc(0, 0, width/2, height/2, 0, 90);

o g.setStrokeStyle(Graphics.DOTTED);

o g.setColor(0xffff00);

o g.drawRect(0, 0, width/2, height/2);

o g.setStrokeStyle(Graphics.SOLID);


o g.fillArc(width/2, 0, width/2, height/2, 0, -90);



o g.drawRect(width/2, 0, width/2, height/2);

o g.setStrokeStyle(Graphics.SOLID);


o g.fillArc(0, height/2, width, height/2, -90, -180);



o g.drawRect(0, height/2, width, height/2);

Setelah menjalankan contoh Anda akan mendapatkan output seperti di bawah ini ..

Gambar 5. Hasil Percobaan Latihan 3 Arc pada lokasi berbeda

Arc MIDlet Example.

D. Permasalahan

1. Perhatikan perbedaan Latihan 1 dengan Latihan 2 dan 3. “Pada Latihan 1 menerapkan

CommandListener sedangkan Latihan 2, 3 tidak menerapkan”… Jelaskan alasannya!

2. Implementasikan CommandListener pada Latihan 2 dan Latihan 3, serta tambahkan beberapa

elemen displayable screen pada kedua latihan tersebut!.

E. Laporan Resmi

Analisa program anda di atas (Latihan 1 dan Permasalahan) dan buat kesimpulan/komentari

untuk masing-masing konstruktor dan method yang ditampilkan pada Emulator.

modul psb 6 j2me llui

Education