Java5

Pertemuan 5 Halaman 1/1

Bahasa Pemrograman I Graphics Programming

Graphics Programming

Java mempunyai kumpulan class khusus untuk membuat aplikasi berbasis grafik

dan membuat user interfaces. Class-class tersebut di grup ke dalam suatu package java.awt, java.awt.event, java.awt.image, java.awt.datatransfer dan java.applet yang dinamakan Abstract Window Toolkit (AWT).

Class-class pada AWT menyediakan platform-independent, sehingga untuk setiap platform yang berbeda komponent AWT secara otomatis di-map ke komponen spesifik dari platform tersebut. Hirarki AWT Class

Gambar 5.1. Hirarki AWT Class

Component Superclass dari semua AWT User Interfaces class Container Digunakan untuk menampung Component-Component dari AWT. Window merupakan top-level window atau dasar untuk meletakkan Component Frame Merupakan dasar untuk meletakkan Component User Interface pada

aplikasi Java berbentuk grafik Dialog Digunakan untuk membuat window sementara / pop up Window Panel Container yang tidak nampak. digunakan untuk menampung Component

User Interface Applet Subclass dari Panel. Digunakan untuk membuat Applet Graphics Abstract class yang menyediakan fungsi graphics Color Berhubungan dengan warna untuk component Font Digunakan untuk mengambarkan String pada graphics FontMetrics Abstract class yang digunakan untuk mengambil properties dari font yang

digunakan untuk mempergunakan AWT class kita harus melakukan import contoh : import java.awt.*;

Object

AWTEvent

Font

FontMetrics

Color

Graphics

Component

LayoutManager

Container

Button

Label

TextComponent

List

Choice

CheckBox

CheckBoxGroup

Canvas

MenuComponent

ScrollBar

MenuItem

MenuBar

Menu

Panel

Window

Applet

Frame

DialogFileDialog

TextField

TextArea



Contoh component yang diletakkan pada Frame dan Applet dapat dilihat pada Gambar 5.2a dan Gambar 5.2b

Gambar 5.2a Component yang dapat diletakkan pada Frame

Gambar 5.2b Component yang dapat diletakkan pada Applet

Frame Frame merupakan top-level window untuk meletakkan user interface component Beberapa method yang penting dari Frame : Frame(String title) Constructor (dengan judul Frame) Frame() Constructor (tanpa judul Frame dispose() melakukan setResizable(boolean resizable) mengubah flag Frame untuk setting ukuran

resizable bisa berisi (true/false) setTitle(String title) mengubah judul dari Frame Contoh membuat Frame : pada MyFrame.java import java.awt.*; public class MyFrame { public static void main (String [] args) { Frame f = new Frame(“Test Frame”); f.setSize(400,300); f.setVisible(true); } } setSize() dan setVisible() merupakan method yang diturunkan dari class component. setSize() digunakan untuk mengubah besar ukuran component dan setVisible() digunakan untuk mengubah flag suatu component agar tampil/tidak tampil.

Frame Pull Down Menus

User Interface Component (UI)

Panel

Panel

UIPanel

UIPanel

UIPanel

Applet

User InterfaceComponent

PanelUser InterfaceComponent

Panel

User InterfaceComponent

PanelUser InterfaceComponent

Panel



Event Driven Programming Pada pemrograman graphics di Java alur program menggunakan Event Driven yaitu kode program dieksekusi apabila ada suatu Event / kejadian yang dihasilkan oleh object tersebut. Event terjadi apabila ada suatu interaksi dari user terhadap source object seperti, user melakukan click pada button, menggerakkan mouse dan lain-lain. Untuk melihat source object yang menghasilkan event dapat digunakan method getSource() dari event. Hirarki dari AWT Events dapat dilihat pada Gambar 5.3

Gambar 5.3. Hirarki AWT Events

User Action Source Object Event Type Generated Clicked on a button Button ActionEvent Change text TextComponent TextEvent Pressed return on a text field TextField ActionEvent Double-clicked on a list item List ActionEvent Selected or deselected an item with a single click

List ItemEvent

Selected or deselected an item Choice ItemEvent Selected or deselected an item CheckBox ItemEvent Selected a menu item MenuItem ActionEvent Moved the scroll bar Scrollbar AdjustmentEvent Window open, closed, iconified, deiconified, or closing

Window WindowEvent

Component added or remove from container

Container ContainerEvent

Component moved, resized, hidden and shown

Component ComponentEvent

Component gained or lost focus Component FocusEvent Key released or pressed Component KeyEvent Mouse movement Component MouseEvent

Tabel 5.1. Tabel User Action dan Source object beserta Eventnya.

JDK event handling bekerja sebagai berikut :

Gambar 5.4. Event Registration, Listening and Handling

Agar object dapat menerima event yang diberikan suatu source object maka object tersebut harus didaftarkan terlebih dahulu / di-register. dengan method AddXListener()

EventObject AWTEvent

ActionEvent

AdjustmentEvent

ComponentEvent

ItemEvent

TextEvent

ContainerEvent

FocusEvent

InputEvent

PaintEvent

WindowEvent

MouseEvent

KeyEvent

UserAction

Register a listener object

Source Object

Event Object

Listener Object

Event Handler



dimana X merupakan XEvent(Contoh untuk ActionEvent di-register dengan AddActionListener) Daftar tipe dari event, Listener interface dan Listener method dapat dilihat pada Tabel 5.2

Event Class Listener Interface Listener Method (Handlers) ActionEvent ActionListener actionPerformed(ActionEvent e) ItemEvent ItemListener itemStateChanged(ItemEvent e) WindowEvent WindowListener windowClosing(WindowEvent e)

windowOpened(WindowEvent e) windowIconified(WindowEvent e) windowDeiconified(WindowEvent e) windowClosed(WindowEvent e) windowActivated(WindowEvent e) windowDeactivated(WindowEvent e)

ContainerEvent ContainerListener componentAdded(ContainerEvent e) componentRemoved(ContainerEvent e)

ComponentEvent ComponentListener componentMoved(ComponentEvent e) componentHidden(ComponentEvent e) componentResized(ComponentEvent e) componentShown(ComponentEvent e)

FocusEvent FocusListener focusGained(FocusEvent e) focusLost(FocusEvent e)

TextEvent TextListener textValueChanged(TextEvent e) KeyEvent KeyListener keyPressed(KeyEvent e)

keyReleased((KeyEvent e) keyTyped(KeyEvent e)

MouseListener mousePressed(MouseEvent e) mouseReleased(MouseEvent e) mouseEntered(MouseEvent e) mouseExited(MouseEvent e) mouseClicked(MouseEvent e)

MouseEvent

MouseMotionListener mouseDragged(MouseEvent e) mouseMoved(MouseEvent e)

AdjustmentEvent AdjustmentListener adjustmentValueChanged(AdjustmentEvent e) Tabel 5.2. Daftar Event, Listener dan Handlers

Memberikan HandlingTerhadap WindowEvent Pada contoh class MyFrame belum diberikan EventDriven pada Frame sehingga user tidak dapat menutup Frame. Perhatikan contoh berikut : Pada MyFrameWithExitHandling.java import java.awt.*; import java.awt.event.*; public class MyFrameWithExitHandling extends Frame implements WindowListener{ public static void main(String [] args) { MyFrameWithExitHandling f = new MyFrameWithExitHandling(); f.setSize(200,150); f.setVisible(true); } public MyFrameWithExitHandling() { super();

addWindowListener(this); } public MyFrameWithExitHandling(String pTitle) { super(pTitle); setSize(200,150); addWindowListener(this); } public void windowClosed(WindowEvent event) { }



public void windowDeiconified(WindowEvent event) { } public void windowIconified(WindowEvent event) { } public void windowActivated(WindowEvent event) { } public void windowDeactivated(WindowEvent event) { } public void windowOpened(WindowEvent event) { } public void windowClosing(WindowEvent event) { dispose(); System.exit(0); } } MyFrameWithExitHandling melakukan extends Frame dan implements WindowListener. WindowListener interface mempunyai beberapa abstract method (windowActivated(), windowDeactivated(), windowClosed(), windowOpened(), windowClosing(), windowIconified(), windowDeiconified()) untuk melakukan penanganan event. abstract method tersebut harus ada dan di-override agar dapat memberikan respon yang diinginkan. Pada contoh windowClosing() di-override dan diberikan perintah System.exit(0) yaitu perintah untuk menghentikan program. Memberikan Handling Terhadap Mouse Events Untuk memberikan handling terhadap mouse event. Object dapat melakukan implements MouseListener interface. sama seperti WindowListener, pada MouseListener terdapat 4 buah abstract method (mouseClicked(), mouseReleased(), mouseEntered(), mouseExited()) yang harus diimplementasikan. Perhatikan contoh berikut : pada MyFrameWithMouse.java : import java.awt.*; import java.awt.event.*; public class MyFrameWithMouse extends MyFrameWithExitHandling implements MouseListener { private int x,y=0; public static void main(String [] args) { (new MyFrameWithMouse()).setVisible(true); } MyFrameWithMouse() { super(); addMouseListener(this); } public void mousePressed(MouseEvent event) { System.out.println("Mouse Pressed"); System.out.println("Mouse Clicked"); x = event.getX(); y = event.getY(); repaint(); } public void mouseClicked(MouseEvent event) { }



public void mouseEntered(MouseEvent event) { System.out.println("Mouse Entered"); } public void mouseExited(MouseEvent event) { System.out.println("Mouse Exit"); } public void mouseReleased(MouseEvent event) { System.out.println("Mouse Released"); } public void paint(Graphics g) { g.fillRect(x-5,y-5,10,10); } } Memberikan Handling Terhadap ActionEvent Untuk memberikan handling terhadap ActionEvent dilakukan implementasi ActionListener interface. Perhatikan contoh berikut : Pada TestActionEvent.java import java.awt.*; import java.awt.event.*; public class TestActionEvent extends MyFrameWithExitHandling implements ActionListener { private Button btnClose; public static void main(String [] args) { (new TestActionEvent()).setVisible(true); } TestActionEvent() { super(); setLayout(new FlowLayout()); btnClose = new Button("Close"); add(btnClose); btnClose.addActionListener(this); } public void actionPerformed(ActionEvent e) { String ActionCommand = e.getActionCommand(); if(e.getSource() instanceof Button) { if (ActionCommand.equals("Close")) { dispose(); System.exit(0); } } } } pada contoh dibuat suatu object button bernama btnClose. btnClose kemudian diberikan suatu registrasi ActionListener dengan memanggil addActionListener(). Untuk handling dari ActionEvent diimplementasikan abstract method actionPerformed(). getActionCommand() digunakan untuk melihat ActionCommand apa yang dihasilkan (Sama dengan label pada button). Sebelum melakukan penanganan terhadap button lakukan pengujian terlebih dahulu dengan operator instanceof agar source object yang di-handle benar-benar datang dari object button.



Layout Manager Untuk mengatur letak component-component AWT dapat digunakan Layout Manager yang dapat melakukan mapping user interface secara otomatis untuk semua sistem window. Layout Manager terdapat dalam setiap container dan digunakan method setLayout() untuk mengaktifkannya. AWT menyediakan 5 macam Layout Manager yaitu : FlowLayout, GridLayout, , BorderLayout, GridBagLayout, CardLayout. FlowLayout FlowLayout merupakan Layout Manager yang mengatur component secara urutan (sesuai dengan yang ditentukan). FlowLayout mempunyai tiga buah constructor yaitu : public FlowLayout(int align, int hGap, int vGap) align dapat berisi FlowLayout.RIGHT, FlowLayout.LEFT dan FlowLayout.CENTER hGap merupakan jarak horizontal antar component dan vGap merupakan jarak vertikal antar component public FlowLayout(int align) memiliki default gap 5 pixels. public FlowLayout() memiliki default gap 5 pixels dan align FlowLayout.CENTER Contoh : Pada ShowFlowLayout.java import java.awt.*; import java.awt.event.*; public class ShowFlowLayout extends MyFrameWithExitHandling{ public static void main(String [] args) { (new ShowFlowLayout()).setVisible(true); } ShowFlowLayout() { super(); setLayout(new FlowLayout(FlowLayout.CENTER,10,10)); for(int i=1;i<=10;i++) { add(new Button("Button "+i)); } } } GridLayout GridLayout merupakan LayoutManager yang mengatur component dalam bentuk grid atau matriks. GridLayout mempunyai constructor : public GridLayout(int rows, int columns) mengatur GridLayout dengan jumlah baris(row) dan kolom(columns) yang ditentukan public GridLayout(int rows, int columns, int hGap, int vGap) mengatur GridLayout dengan jumlah baris(row), kolom(Columns), horizontal gap dan vertikal gap yang ditentukan. Contoh : Pada ShowGridLayout.java import java.awt.*; import java.awt.event.*;



public class ShowGridLayout extends MyFrameWithExitHandling { public static void main(String [] args) { (new ShowGridLayout()).setVisible(true); } ShowGridLayout() { super(); setLayout(new GridLayout(2,2,5,5)); for(int i=1;i<=10;i++) { add(new Button("Button "+i)); } } } BorderLayout BorderLayout mengatur window menjadi 5 area yaitu “east”,”west”,”center”, “north” dan “south”. BorderLayout mempunyai constructor : public BorderLayout(int hGap, int vGap) mengatur BorderLayout dengan horizontal dan vertikal gap yang ditentukan. public BorderLayout() method add() yang digunakan untuk BorderLayout berbeda dengan method add() pada FlowLayout dan GridLayout. Perhatikan contoh berikut : Pada ShowBorderLayout.java import java.awt.*; public class ShowBorderLayout extends MyFrameWithExitHandling { public static void main(String [] args) { (new ShowBorderLayout()).setVisible(true); } ShowBorderLayout() { super(); setLayout(new BorderLayout(5,10)); add("East",new Button("East")); add("West",new Button("West")); add("North",new Button("North")); add("South",new Button("South")); add("Center",new Button("Center")); } } Panel Panel merupakan container yang dapat menampung component lain didalamnya. Panel mempunyai constructor Panel(); untuk menambah component pada panel digunakan method add() Panel p = new Panel(); p.add(new Button(“Close”)); untuk menaruh panel pada Frame digunakan : f.add(p); Perhatikan contoh berikut : Pada TestPanels.java import java.awt.*; import java.awt.event.*;



public class TestPanels extends MyFrameWithExitHandling implements ActionListener { private TextField tfNum; private Button [] btnNum = new Button[10]; public TestPanels() { setTitle("Test Panels"); setLayout(new BorderLayout(20,20)); Panel p1 = new Panel(); p1.setLayout(new GridLayout(3,4,3,3)); for(int i=0;i<btnNum.length;i++) { p1.add(btnNum[i] = new Button(""+i)); btnNum[i].addActionListener(this); } tfNum = new TextField(); add("Center",p1); add("North",tfNum); } public void actionPerformed(ActionEvent e) { String actionCommand = e.getActionCommand(); if(e.getSource() instanceof Button) tfNum.setText(actionCommand); } public static void main(String [] args) { TestPanels testPanels = new TestPanels(); testPanels.setSize(200,250); testPanels.setVisible(true); } } Canvas Merupakan UI Component yang dapat digunakan untuk menggambar graphics dan menerima interaksi dari user. untuk membuat canvas digunakan constructor canvas() Canvas c = new Canvas(); c.setSize(50,50); c.setBackground(Color.blue); add(c); Perhatikan contoh berikut : import java.awt.*; import java.awt.event.*; public class CanvasDemo extends MyFrameWithExitHandling { private MyCanvas c; public static void main(String [] args) { CanvasDemo f = new CanvasDemo(); f.setSize(300,200); f.setVisible(true); } public CanvasDemo() { setTitle("Canvas Demo"); c = new MyCanvas("Welcome to Java"); c.setBackground(Color.yellow); c.setForeground(Color.black); setLayout(new BorderLayout(10,10)); add("Center",c); }



class MyCanvas extends Canvas implements MouseMotionListener { private String message; private int x = 10; private int y = 10; public MyCanvas(String s) { message =s; this.addMouseMotionListener(this); repaint(); } public void paint(Graphics g) { g.drawString(message,x,y); } public void mouseMoved(MouseEvent e) { } public void mouseDragged(MouseEvent e) { x = e.getX(); y = e.getY(); repaint(); } } } pada contoh diatas dibuat suatu inner class MyCanvas yang melakukan implements MouseMotionListener interface. Color Class Color class merupakan class yang digunakan untuk melakukan setting warna pada component AWT. Syntax Color : Color c = new Color(r,g,b); dimana r,g,b merupakan bilangan antara 0-255 Contoh : Canvas myCanvas = new Canvas(); Color c = new Color(128,100,100); myCanvas.setBackground(c); Pada Color class juga terdapat 13 konstanta standard : black, blue, cyan, darkGray, gray, green, lightGray, magenta, orange, pink, red, white, yellow) contoh penggunaan : Canvas myCanvas = new Canvas(); myCanvas.setBackground(Color.yellow); Method repaint(), update() dan paint() Pada pemrograman graphics ada 3 method yang menyebabkan graphics tampil yaitu : public void repaint() Method ini digunakan untuk melakukan penggambaran ulang. (Jangan melakukan override pada method repaint()); public void update(Graphics g) Method ini digunakan untuk melakukan pembersihan area graphics kemudian menggambar ulang. Method update() dapat dioverride. public void paint(Graphics g) Method ini selalu dipanggil oleh java apabila suatu component akan ditampilkan atau ditampilkan ulang. Method ini dipanggil oleh method update() ataupun method repaint().



dalam melakukan penggambaran ulang sebaiknya method yang dipanggil adalah method repaint() bukan method paint() ataupun update(). Graphics Class Dibawah ini merupakan class-class yang digunakan untuk membuat bentuk geometri pada graphics class. Font dan FontMetrics class Font digunakan untuk melakukan setting huruf/tulisan. Syntaks Font : Font myFont = new Font(name,style,size) name : TimesRoman, Courier, Helvetica, Symbol dan Dialog Style : Font.PLAIN, Font.BOLD, Font.ITALIC (sytle dapat dikombinasi dengan menambahkan style seperti Font.BOLD+Font.ITALIC) size : besar dari font. FontMetrics digunakan untuk menghitung besar panjang dan lebar suatu string. FontMetrics dihitung berdasarkan attribute berikut :

Leading : besar jarak antara baris text Ascent : tinggi character dari baseline ke atas Descent : jarak dari baseline ke bawah Height : jarak total dari leading,ascent dan descent

By Untuk mengambil FontMetrics object dapat digunakan : g.getFontMetrics(Font f); atau g.getFontMetrics() //mengambil default font selain itu dapat digunakan method : public int getAscent(); public int getDescent(); public int getLeading(); public int getHeight(); public int stringWidth(String str); Contoh : Pada TestFontMetrics.java import java.awt.*; import java.awt.event.*; public class TestFontMetrics extends MyFrameWithExitHandling { public static void main(String [] args) { TestFontMetrics f = new TestFontMetrics(); f.setSize(300,200); f.setVisible(true); } public TestFontMetrics() { setTitle(“Test Font Metrics”); } public void paint(Graphics g) { String message = “Welcome to Java”; Font f = new Font(“Helvetica”,Font.Bold,20); g.setFont(f);

Descent

Ascent Baseline

Leading



FontMetrics fm = g.getFontMetrics(f); int w = fm.stringWidth(message); int h = fm.getAscent(); int x = (getSize().width-w)/2; int y = (getSize().height+h)/2; g.drawString(message,x,y); } } Drawing Lines Method : drawLine(x1,y1,x2,y2); dimana x1,y1 adalah titik awal garis dan x2, y2 adalah titik akhir garis Contoh : Pada DrawLines.java import java.awt.*; class DrawLines extends MyFrameWithExitHandling { public static void main(String [] args) { DrawLines f = new DrawLines(); f.setSize(300,200); f.setVisible(true); } public DrawLines() { setTitle("Draw Lines"); } public void paint(Graphics g) { for(int x=0;x<=300;x+=10) g.drawLine(x,0,x,200); } } Drawing Rectangle Method : drawRect(x,y,w,h); Mengambar kotak dengan titik awal x,y ,besar w dan panjang h fillRect(x,y,w,h); Menggambar kotak yang dapat diisi warna dengan titik awal x,y ,besar w dan panjang h drawRoundRect(x,y,w,h,aw,ah); Menggambar kotak dengan sudut bundar dengan titik awal x,y, besar w, panjang h, dan besar sudut aw dan panjang sudut ah fillRoundRect(x,y,w,h,aw,ah); Menggambar kotak dapat diisi warna dengan sudut bundar dengan titik awal x,y, besar w, panjang h, dan besar sudut aw dan panjang sudut ah draw3DRect(x,y,w,h, raised); Mengambar kotak 3D dengan titik awal x,y ,besar w, panjang h dan flag raised (true/false) fill3DRect(x,y,w,h, raised); Mengambar kotak 3D yang dapat berisi warna dengan titik awal x,y ,besar w, panjang h dan flag raised (true/false) Contoh : import java.awt.*; class DrawRects extends MyFrameWithExitHandling { public static void main(String [] args) { DrawRects f = new DrawRects(); f.setSize(300,250);



f.setVisible(true); } public DrawRects() { setTitle("Draw Rectangular"); } public void paint(Graphics g) { g.drawRect(30,30,100,100); g.drawRoundRect(140,30,100,100,60,30); g.setColor(Color.gray); g.fill3DRect(30,140,100,100,true); } } Drawing Ovals drawOval(x,y,w,h); fillOval(x,y,w,h); Contoh : import java.awt.*; class DrawOvals extends MyFrameWithExitHandling { public static void main(String [] args) { DrawOvals f = new DrawOvals(); f.setSize(300,250); f.setVisible(true); } public DrawOvals() { setTitle("Draw Ovals"); } public void paint(Graphics g) { g.drawOval(30,30,100,60); g.drawOval(130,30,60,60); g.setColor(Color.gray); g.fillOval(10,130,100,60); } } Drawing Arcs drawArc(x,y,w,h,angle1,angle2); fillArc(x,y,w,h,angle1,angle2); Contoh : import java.awt.*; class DrawArcs extends MyFrameWithExitHandling { public static void main(String [] args) { DrawArcs f = new DrawArcs(); f.setSize(250,300); f.setVisible(true); } public DrawArcs() { setTitle("Draw Arcs"); } public void paint(Graphics g) { g.drawArc(10,30,100,60,20,120); g.setColor(Color.gray); g.fillArc(10,150,100,60,120,300); } }



Drawing Polygon drawPolygon(x,y,n); fillPolygon(x,y,n); Contoh : import java.awt.*; class DrawAPolygon extends MyFrameWithExitHandling { public static void main(String [] args) { DrawAPolygon f = new DrawRects(); f.setSize(200,250); f.setVisible(true); } public DrawAPolygon() { setTitle("Draw Polygon"); } public void paint(Graphics g) { Polygon p = new Polygon(); p.addPoint(10,30); p.addPoint(60,45); p.addPoint(35,55); p.addPoint(90,85); g.drawPolygon(p); } }

Java5

Technology

Transcript of Java5