ABSTRACT WINDOWING TOOLKIT SWING PEMBAHASAN Abstract Windowing Toolkit
ABSTRACT WINDOWING TOOLKIT & SWING
PEMBAHASAN � Abstract Windowing Toolkit (AWT) vs. Swing � Komponen GUI pada AWT � Dasar Class Window � Graphics � Komponen AWT lanjut
PEMBAHASAN � Layout Manager � � � Flow. Layout Manager Border. Layout Manager Grid. Layout Manager Panel dan Tampilan kompleks Swing GUI Components � � � Pengaturan Top-Level Containers Sebuah contoh JFrame Sebuah contoh JOption. Pane
ABSTRACT WINDOWING TOOLKIT (AWT) VS. SWING � Persamaan : � Tools yang disediakan Java untuk membangun aplikasi GUI � Menyediakan komponen GUI yang dapat digunakan dalam membuat aplikasi Java dan Applet � Java Foundation Classes (JFCs) � Bagian penting dari Java SDK � Sekumpulan API yang menyederhanakan pembuatan aplikasi Java GUI � Terdiri dari lima APIs utama � AWT � Swing � Java 2 D � Accessibility � Drag and Drop
ABSTRACT WINDOWING TOOLKIT (AWT) VS. SWING � AWT � Beberapa komponen AWT menggunakan native code � Platform-dependent � Memastikan elemen Look and Feel dari aplikasi pada mesin yang berbeda dapat dibandingkan � Swing � Ditulis menggunakan Java seluruhnya � Platform-independent � Memastikan aplikasi yang dibangun pada platform yang berbeda akan memiliki tampilan yang sama � Dibangun dengan beberapa API yang mengimplementasikan beberapa bagian AWT �Dapat digunakan bersama AWT
� AWT GUI COMPONENTS: DASAR CLASS WINDOW Komponen GUI seperti buttons dan text fields diletakkan pada container.
AWT GUI COMPONENTS: METHOD DARI CLASS WINDOW CLASS � Mengatur ukuran window : void set. Size(int width, int height) void set. Size(Dimension d) � Dimension d memiliki width dan height seperti pada fields � Sebuah window secara default statusnya adalah not visible. Atur visibility window : void set. Visible(boolean b) � jika b bernilai true, window akan ditampilkan (diset menjadi visible)
AWT GUI COMPONENTS: DASAR CLASS WINDOW � Object Frame digunakan pada saat mendesain aplikasi berbasis GUI: 1 import java. awt. *; 2 /* Mencoba tombol pada Frame */ 3 public class Sample. Frame extends Frame { 4 public static void main(String args[]) { 5 Sample. Frame sf = new Sample. Frame(); 6 sf. set. Size(100, 100); //coba dihilangkan 7 sf. set. Visible(true); //coba dihilangkan 8 } 9 }
AWT GUI COMPONENTS: GRAPHICS �Methods pada class Graphics (abstract) : �Konstruktor class Color :
AWT GUI COMPONENTS: CONTOH GRAPHICS 1 2 3 4 5 6 7 8 9 10 11 12 13 import java. awt. *; public class Graphic. Panel extends Panel { Graphic. Panel() { set. Background(Color. black); } public void paint(Graphics g) { g. set. Color(new Color(0, 255, 0)); //hijau g. set. Font(new Font("Helvetica", Font. PLAIN, 16)); g. draw. String("Hello GUI World!", 30, 100); g. set. Color(new Color(1. 0 f, 0, 0)); //merah g. fill. Rect(30, 100, 150, 10); } //bersambung. . .
AWT GUI COMPONENTS: CONTOH GRAPHICS /* perlu menggunakan Panel dalam Frame */ public static void main(String args[]) { Frame f = new Frame("Testing Graphics Panel"); Graphic. Panel gp = new Graphic. Panel(); f. add(gp); f. set. Size(600, 300); f. set. Visible(true); } 14 15 16 17 18 19 20 21 22 }
KOMPONEN AWT LANJUT �AWT controls �Komponen yang mengijinkan user untuk berinteraksi dengan aplikasi GUI �Merupakan subclass-subclass dari class komponen lain
KOMPONEN AWT LANJUT: CONTOH 1 2 3 4 5 6 7 8 9 10 11 12 13 14 import java. awt. *; class Frame. WControls extends Frame { public static void main(String args[]) { Frame. WControls fwc = new Frame. WControls(); fwc. set. Layout(new Flow. Layout()); fwc. set. Size(600, 600); fwc. add(new Button("Test Me!")); fwc. add(new Label("Labe")); fwc. add(new Text. Field()); Checkbox. Group cbg = new Checkbox. Group(); fwc. add(new Checkbox("chk 1", cbg, true)); fwc. add(new Checkbox("chk 2", cbg, false)); fwc. add(new Checkbox("chk 3", cbg, false)); //bersambung. . .
KOMPONEN AWT LANJUT: CONTOH List list = new List(3, false); list. add("MTV"); list. add("V"); fwc. add(list); Choice chooser = new Choice(); chooser. add("Avril"); chooser. add("Monica"); chooser. add("Britney"); fwc. add(chooser); fwc. add(new Scrollbar()); fwc. set. Visible(true); 15 16 17 18 19 20 21 22 23 24 25 } 26 27 }
LAYOUT MANAGERS �Definisi : �Menentukan posisi dan ukuran komponen dalam container �Mengatur layout komponen dalam container �Beberapa layout managers dalam Java �Flow. Layout �Border. Layout �Grid. Bag. Layout
LAYOUT MANAGERS: METHOD � Mengatur layout manager: void set. Layout(Layout. Manager mgr) � Dapat berupa null, tidak menggunakan layout manager � Jika tidak ada layout manager yang digunakan, posisikan tiap elemen secara manual public void set. Bounds(int x, int y, int width, int height) � Method dari class Component � Lebih sulit dan melelahkan jika menggunakan banyak object Component � Perlu menggunakan method ini tiap object dipanggil
LAYOUT MANAGERS: FLOWLAYOUT MANAGER �Default manager untuk class Panel dan subclass-subclass - nya �Class Applet adalah subclass dari Panel �Memposisikan komponen dari kiri ke kanan dan atas ke bawah, dimulai dari sudut kiri atas : �Menggunakan text editor
�Memiliki LAYOUT MANAGERS: FLOWLAYOUT MANAGER 3 konstruktor:
LAYOUT MANAGERS: FLOWLAYOUT MANAGER �Gap : �Memberikan jarak antar komponen �Diukur dengan satuan pixel �Kemungkinan alignment: Flow. Layout. LEFT Flow. Layout. CENTER Flow. Layout. RIGHT
LAYOUT MANAGERS: FLOWLAYOUT MANAGER 1 2 3 4 5 6 7 8 9 10 11 12 import java. awt. *; class Flow. Layout. Demo extends Frame { public static void main(String args[]) { Flow. Layout. Demo fld = new Flow. Layout. Demo(); fld. set. Layout(new Flow. Layout(Flow. Layout. RIGHT, 10)); fld. add(new Button("ONE")); fld. add(new Button("TWO")); fld. add(new Button("THREE")); fld. set. Size(100, 100); fld. set. Visible(true); } }
LAYOUT MANAGERS: FLOWLAYOUT MANAGER �Contoh output:
LAYOUT MANAGERS: BORDERLAYOUT MANAGER � Default layout untuk object Window dan subclass-suclass-nya � Termasuk Frame dan Dialog � Membagi object Container menjadi lima bagian dimana object Component digunakan � North - membentang horizontal � South - membentang horizontal � East - teratur vertikal � West - teratur vertikal � Center - teratur dalam dua arah
LAYOUT MANAGERS: BORDERLAYOUT MANAGER �Memiliki dua konstruktor �Parameters hgap dan vgap menunjukkan jarak antar komponen dalam container
LAYOUT MANAGERS: BORDERLAYOUT MANAGER � Menambahkan komponen pada area tertentu : � Gunakan method add dan berikan dua argumen : �Komponen yang akan ditambahkan �Area tempat komponen akan diletakkan � � Hanya satu komponen dapat diletakkan dalam satu area Area yang diperbolehkan: � Border. Layout. NORTH � Border. Layout. SOUTH � Border. Layout. EAST � Border. Layout. WEST � Border. Layout. CENTER
LAYOUT MANAGERS: BORDERLAYOUT MANAGER 1 2 3 4 5 6 7 8 9 10 11 12 13 14 import java. awt. *; class Border. Layout. Demo extends Frame { public static void main(String args[]) { Border. Layout. Demo bld = new Border. Layout. Demo(); bld. set. Layout(new Border. Layout(10, 10)); bld. add(new Button("NORTH"), Border. Layout. NORTH); bld. add(new Button("SOUTH"), Border. Layout. SOUTH); bld. add(new Button("EAST"), Border. Layout. EAST); bld. add(new Button("WEST"), Border. Layout. WEST); bld. add(new Button("CENTER"), Border. Layout. CENTER); bld. set. Size(200, 200); bld. set. Visible(true); } }
�Contoh LAYOUT MANAGERS: BORDERLAYOUT MANAGER output: Setelah diatur ulang :
LAYOUT MANAGERS: GRIDLAYOUT MANAGER �Serupa dengan Flow. Layout �Memposisikan komponen dari kiri ke kanan dan atas ke bawah �Dimulai dari sudut kiri atas �Memisahkan container menjadi baris dan kolom �Area memiliki ukuran yang sama �Tidak mempedulikan ukuran sebenarnya dari komponen
LAYOUT MANAGERS: GRIDLAYOUT MANAGER �Memiliki Konstruktor sebagai berikut:
LAYOUT MANAGERS: GRIDLAYOUT MANAGER 1 2 3 4 5 6 7 8 9 10 11 12 13 14 import java. awt. *; class Grid. Layout. Demo extends Frame { public static void main(String args[]) { Grid. Layout. Demo gld = new Grid. Layout. Demo(); gld. set. Layout(new Grid. Layout(2, 3, 4, 4)); gld. add(new Button("ONE")); gld. add(new Button("TWO")); gld. add(new Button("THREE")); gld. add(new Button("FOUR")); gld. add(new Button("FIVE")); gld. set. Size(200, 200); gld. set. Visible(true); } }
LAYOUT MANAGERS: GRIDLAYOUT MANAGER �Contoh output: Setelah pengaturan ulang:
PANEL DAN TAMPILAN KOMPLEKS � Tampilan kompleks � Dapat mengkombinsaikan layout manager yang berbeda � Menggunakan Panel dalam satu waktu � Perlu diingat : � Panel adalah sebuah Container sekaligus Component � Dapat memasukkan Components ke dalam Panel � Dapat menambahkan Panel dalam sebuah Container
Panel dan Tampilan Kompleks 1 2 3 4 5 6 7 8 9 10 11 12 13 import java. awt. *; class Complex. Layout extends Frame { public static void main(String args[]) { Complex. Layout cl = new Complex. Layout(); Panel panel. North = new Panel(); Panel panel. Center = new Panel(); Panel panel. South = new Panel(); /* North Panel */ //Panels menggunakan Flow. Layout sebagai default panel. North. add(new Button("ONE")); panel. North. add(new Button("TWO")); panel. North. add(new Button("THREE")); //bersambung. . .
Panel dan Tampilan Kompleks 14 15 16 17 18 19 20 21 22 23 24 25 26 27 /* Center Panel */ panel. Center. set. Layout(new Grid. Layout(4, 4)); panel. Center. add(new Text. Field("1 st")); panel. Center. add(new Text. Field("2 nd")); panel. Center. add(new Text. Field("3 rd")); panel. Center. add(new Text. Field("4 th")); /* South Panel */ panel. South. set. Layout(new Border. Layout()); panel. South. add(new Checkbox("Choose me!"), Border. Layout. CENTER); panel. South. add(new Checkbox("I'm here!"), Border. Layout. EAST); panel. South. add(new Checkbox("Pick me!"), Border. Layout. WEST); //bersambung. . .
Panel dan Tampilan Kompleks /* memasukkan. Panels dalam container Frame */ 29 //Frame menggunakan Border. Layout secara default 30 cl. add(panel. North, Border. Layout. NORTH); 31 cl. add(panel. Center, Border. Layout. CENTER); 32 cl. add(panel. South, Border. Layout. SOUTH); 33 cl. set. Size(300, 300); 34 cl. set. Visible(true); 35 } 36 } 28
Panel dan Tampilan Kompleks �Contoh output:
KOMPONEN SWING GUI �Teletak pada package javax. swing �Seluruhnya ditulis dalam Java �Memiliki Look and Feel yang sama meskipun dijalankan pada platform yang berbeda �Menyediakan menarik �Color chooser komponen yang lebih
KOMPONEN SWING GUI �Nama dari komponen Swing GUI hampir menyerupai AWT �Nama dari komponen AWT namun diawali dengan J �Contoh: �AWT: Button class �Pada komponen Swing : JButton class
KOMPONEN SWING GUI
KOMPONEN SWING GUI
SWING: PENGATURAN TOP-LEVEL CONTAINER � Top-level containers dalam Swing umumnya tidak cocok dengan AWT � Dalam hal menambahkan komponen dalam container � Menambahkan sebuah komponen dalam container: � Menggunakan content pane dari container �Gunakan method get. Content. Pane � Menambahkan �Masih komponen dalam content pane menggunakan method add
SWING: CONTOH JFRAME 1 2 3 4 5 6 7 8 9 10 11 12 13 import javax. swing. *; import java. awt. *; class Swing. Demo { JFrame frame; JPanel panel; JText. Field text. Field; JButton button; Container content. Pane; public static void main(String args[]) { Swing. Demo sd = new Swing. Demo(); sd. launch. Frame(); } //bersambung. . .
SWING: CONTOH JFRAME void launch. Frame() { /* inisialisasi */ frame = new JFrame("My First Swing Application"); panel = new JPanel(); text. Field = new JText. Field("Default text"); button = new JButton("Click me!"); content. Pane = frame. get. Content. Pane(); //menambahkan komponen pada panel-Flow. Layout panel. add(text. Field); panel. add(button); /* menambahkan komponen pada content. Pane */ content. Pane. add(panel, Border. Layout. CENTER); frame. pack(); //Ukuran frame berdasar komponen frame. set. Visible(true); } 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 }
SWING: CONTOH JFRAME � Package java. awt tetap di-import � Layout Manager yang digunakan terletak pada package ini � Memberikan judul Frame dan membungkus komponen dalam Frame dapat digunakan pula pada Frame AWT � Konvensi Pemrograman : � Deklarasikan komponen sebagai field : � Sebuah method launch. Frame terdifinisi: �Inisialisasi dan menambahkan components � Tidak lagi hanya meng-extend class Frame � Kelebihan : teratur dan lebih mudah untuk menambahkan kode event handling
SWING: CONTOH JFRAME �Contoh output:
SWING: CONTOH JOPTIONPANE 1 2 3 4 5 6 7 8 9 10 11 12 13 14 import javax. swing. *; class JOption. Pane. Demo { JOption. Pane option. Pane; void launch. Frame() { option. Pane = new JOption. Pane(); String name = option. Pane. show. Input. Dialog( "Hi, what's your name? "); option. Pane. show. Message. Dialog(null, "Nice to meet you, " + name + ". ", "Greeting. . . ", option. Pane. PLAIN_MESSAGE); System. exit(0); } public static void main(String args[]) { new JOption. Pane. Demo(). launch. Frame(); } }
SWING: CONTOH JFRAME �Contoh output:
KESIMPULAN � Abstract Windowing Toolkit (AWT) vs. Swing � Persamaan � Perbedaan � Komponen AWT GUI � Class Window Dasar �Component, Container, Window, Frame, Panel � Graphics �Methods � Komponen �Label, dan class Color AWT Lanjut Text. Field, Text. Area, Button, Checkbox. Group, Choice, List, Scrollbar
KESIMPULAN � Layout Managers � Flow. Layout Manager � Border. Layout Manager � Grid. Layout Manager � Membuat Tampilan Kompleks � Komponen Swing GUI � Mengatur Top-Level Containers �Gunakan method get. Content. Pane �Gunakan method add � JFrame, JOption. Pane
- Slides: 48