Modul 9: antarmuka grafis (GUI) dalam...
Transcript of Modul 9: antarmuka grafis (GUI) dalam...
Modul 9 -Antarmuka grafis dalam window
1
Modul 9:antarmuka grafis (GUI)
dalam window
Setelah mengikuti mata kuliah inimahasiswa dapat membuat
program antarmuka grafis (GUI) sederhana dalam lingkungan window
Modul 9 -Antarmuka grafis dalam window
2
Pengantar :
Dalam modul ini akan diuraikan beberapatopik bahasan yaitu :
1. Kendali mouse untuk windows2. Pengertian antar muka grafis
(Graphical User Interface =GUI)3. Mengendalikan componen GUI :
Button, Label, TextEdit, TextArea
Modul 9 -Antarmuka grafis dalam window
3
1. Kendali mouse dengan interface MouseListener
Untuk mengendalikan mouse dapat digunakan interface MouseListener, MouseMoveListener dan MouseWheelListenerKetiga interface tersebut memiliki metod-metod yang berparameterkan MouseEvent yang memungkinkan kita mengatahuievent apa yang kita lakukan pada mouseStruktur class dari MouseEvent adalah sbb
Modul 9 -Antarmuka grafis dalam window
4
class MouseEvent daninterface MouseListenerVariabel dam method untuk Class MouseEvent
Variabel : int x,y, MOUSE_PRESSED , MOUSE_RELEASED, MOUSE_CLICKED , MOUSE_ENTERED, MOUSE_EXITED ,MOUSE_MOVED, MOUSE_DRAGGED , MOUSE_WHEELMethod : getX(), getY(), getClickCount()
public interface MouseListener extends EventListener {public void mouseClicked(MouseEvent e);public void mousePressed(MouseEvent e);public void mouseReleased(MouseEvent e);public void mouseEntered(MouseEvent e);public void mouseExited(MouseEvent e);
}
Modul 9 -Antarmuka grafis dalam window
5
Membuat efek mouseclick
Efek yang lain dapat diberikan pada metod mousePressed, mouseReleased dan lain-lain
Setelah di klikbeberapa kali tampilanjadi
Modul 9 -Antarmuka grafis dalam window
6
mousePressed() danmouseReleased()
Ketika mouse ditekan kitamenggambar lingkaran danketika mouse dilepas kitamenggambar kotak
Hasil setelah tekanlepas beberapa kali
Modul 9 -Antarmuka grafis dalam window
7
Mouse Gerak dan gulungDisamping aksi penekanan mouse, gerakan mouse dan rodamouse juga disediakan metod yang dapat diimplementasi jikaevent tersebut terjadiMetod tersebut ada dlam interface MouseMotionLisetener danMouseWheelListener, sbb :
MENUNGGU AKSI MOUSE GERAK:public interface MouseMotionListener extends EventListener {
public void mouseDragged(MouseEvent e);public void mouseMoved(MouseEvent e);
}MENUNGGU AKSI MOUSE GULUNG:
public interface MouseWheelListener extends EventListener {public void mouseWheelMoved(MouseWheelEvent e);
}
Modul 9 -Antarmuka grafis dalam window
8
Memprogram mouse gerak denganMouseMotionListener
Efek gerakan mouse dapat dibuat jauh lebih kompleks dari sekedar mencetakposisinyaEfek dapat didefinisikan dalam gerak mouse atau mouse drag
Hasil ketika mouse dilewatkan di atas frame
Modul 9 -Antarmuka grafis dalam window
9
2. Pengertian GUIGUI = Grafical User Interface adalah teknik pemrograman window dengan menggunakan komponen window sehingga user dapatberinteraksi dengan nyaman dengan windowSeluruh komponen window seperti Menu, Label, Button dll adalahsubclass dari class ComponentTeknis pembuatan GUI adalah sbb :TAHAP MENDEFINISKAN OBJEK :Definisikan objek dari komponen yang akan ditaruh dalam frame padasaat frame dibuat (pada conctsructor frame yang kita definisikan)Letakkan objek dalam frameTAHAP MENDEFINISIKAN AKSI :Tahap ini didefinisikan tergantung dari jenis komponennyaPada komponen tombol aksi didefinisikan dengan caramengimplementasi interface ActionListenerPada komponen lain seperti Choice dll ada cara tersendiri
Modul 9 -Antarmuka grafis dalam window
10
3. Komponen utama GUI : Button, Label, TextField dan TextAreaKomponen Button :
Constructor Button() : mendefinisikan tombol tanpa labelButton(String lbl) : mendefinisikan tombol dengan label lblMethod : setLabel(String lbl) : untuk mengganti label dari tombolgetLabel() : untuk mendapatkan label dari suatu tombol
Tombol ini belum dapatberaksi
Modul 9 -Antarmuka grafis dalam window
11
Contoh : Aksi Tombol 1 (jika tombol diklik pindah)
Posisi mula-mula
Push diklik 4 kali
Hello diklik 4 kali
Modul 9 -Antarmuka grafis dalam window
12
Contoh : Aksi Tombol 2 (jika tombol diklik label-nya berubah)
Jika tombol diklikmaka bilanganrandom 0 s/d 1 dibangkitkanuntuk mengambilkata acak yang dijadikan sbglabel.
Jika katakebetulan“STOP” tomboldiremove.
Jika 10 x klikprogram ditutup
Modul 9 -Antarmuka grafis dalam window
13
Komponen Label Komponen Label :
Constructor Label (String lbl) : mendefinisikan Label dengan label lblMethod : setText(String lbl) : untuk mengganti label dari LabelgetText() : untuk mendapatkan label dari suatu Label
Contoh : akan dibuat program mengendallikan efek tombol untukmembesarkan dan mengecilkan tulisan pada Labelmerubah ukuran label (besar, kecil) diatur dengan efek klik tombol
Mula-mula klik besarkan klik kecilkan
Modul 9 -Antarmuka grafis dalam window
15
TextFieldKomponen TextField :
Constructor TextField (String txt) : mendefinisikan TextField berisi teks txt TextField (int n) : mendefinisikan TextField selebar n kolomMethod : setText(String txt) : untuk mengganti teks pada TextField dg txtgetText() : untuk mendapatkan text dari suatu TextFieldsetEchoChar( char) : menset char yang muncul jika diketikgetEchoChar( ) : mendapatkan char yang muncul
Contoh : akan dibuat program membaca angka bulat dari keyboard danmencari nilai faktorialnyaAngka dibaca dengan TextField tf1, hasil ditampilkan denganTextField tf2
Modul 9 -Antarmuka grafis dalam window
17
TextAreaConstructor :TextArea(cacah baris , cacah kolom)
Method Penting : setText(String s) untuk merubah isi TextAreagetText() untuk mengambil isi TextAreaappend(String s) menambahkan s ke dalam TextAreainsert(String s, int p) insert string s dalam area posisi preplace(String s, int i, int j) replace text s dalam area mulai i s/d jselect(int awal , int akhir) memilih (blok) seleksi textgetSelectedText() mengambil teks terseleksi oleh select()
Modul 9 -Antarmuka grafis dalam window
20
Hasil program
Mula-mula
TulisYOGYA dan klikAppend 4 kali
Isi KITA pada Kata
Dan 6 padaposisi
Klik Insert
Isi Kata dg RUDI
Dan posisi dg 15
Klik Replace
Modul 9 -Antarmuka grafis dalam window
21
Rangkuman
Grafical User Interface (GUI) memfasilitasi programmer untukmerancang antar muka grafisKendali GUI utamanya dilakukan dengan cara implementasiinterface java yang sudah tersediaPengendalian mouse, baik gerakan aksi tekan mouse ataugerak mouse dilakukan dengan mendfinisikan metod dibawahinterface MouseListener dan MouseMotionListenerPengendalian tombol didefinisikan dengan mengimplementasiinterface ActionListener yaitu mendefinisikan metodActionPerformedUntuk menginput teks satu baris digunakan class TextFieldUntuk membaca teks banyak baris digunakan class TetArea
Modul 9 -Antarmuka grafis dalam window
22
Latihan1. Buatlah program dengan komponen antar muka grafis untuk
membaca Panjang dan Lebar suatu empat persegi panjang dengan EditText dan menampilkan Luas dan Keliling. Layout sebagai berikut : Kotak untuk memasukkan Panjang dan Lebar adalah EditText. Tombol HitungLuas dan HitungKell apabila diklik maka pada kotak luas dan kotak keliling akan muncul hasilnya apabila dalam kotakPanjang dan Lebar ada datanya. Bila tombol Clear di klik semua EditText dibersihkan.
Modul 9 -Antarmuka grafis dalam window
23
Latihan2. Buatlah program kamus Inggis-Indonesia dengan
antar muka GUI sebagai berikut
Sekenario:
Jika tombol CARI ditekan maka akan menampikan kata indonesiadari suatu kata inggris yang diinput dikotak KATA INGGRIS, atautulisan TIDAK DITEMUKAN jika kata tersebut tidak ada