modul grafkom 2012

BAB I PENDAHULUAN

1.1. Bahasa Pemrograman Java Java memiliki dua fasilitas untuk pemrograman GUI: AWT dan Swing. Versi awal Java memberikan dukungan grafik yang terbatas. Hanya fitur-fitur grafik minimal yang telah dimasukkan dalam JDK 1.x. Dukungan Antarmuka Grafis (GUI) dan fitur untuk menggambar grafis telah disediakan dalam paket Abstract Window Toolkit (AWT). Komponen GUI dalam AWT sangat berat dimapkan ke dalam komponen native sistem operasi. Disamping sekumpulan fiturnya yang sederhana untuk membuat elemen-elemen GUI, AWT memberikan kemampuan untuk mengatur atribut rendering, seperti menggambar dengan warna dan menggambar grafik sederhana, misalnya garis, persegipanjang, dan oval. Juga ada beberapa dukungan untuk gambar (image). Tetapi, fitur-fitur ini terbatas. Contohnya, tidak ada cara untuk mengatur tebal dari garis yang digambar. Karena keterbatasannya, Java versi awal tidak menyediakan dukungan yang cukup untuk pemrograman grafika komputer modern. Paket Swing adalah desain ulang pemrograman GUI termasuk API dalam platform Java 2. Kebanyakan komponen Swing tidak berat tidak diimplementasikan sebagai komponen asal. Dukungan grafis dalam Java 2 juga lebih ditingkatkan lagi.

Listing 1.1 menunjukkan program GUI Java sederhana menggunakan AWT. import java.awt.*; import java.awt.event.*;

public class AWTDemo extends Frame implements ActionListener{ int x = 100; int y = 100;

public static void main(String[] args) { Frame frame = new AWTDemo(); frame.setSize(640, 480); frame.setVisible(true); }

public AWTDemo() { setTitle("AWT Demo"); // create menu MenuBar mb = new MenuBar(); setMenuBar(mb); Menu menu = new Menu("File");

1

mb.add(menu); MenuItem mi = new MenuItem("Exit"); mi.addActionListener(this); menu.add(mi); // end program when window is closed WindowListener l = new WindowAdapter() { public void windowClosing(WindowEvent ev) { System.exit(0); } }; this.addWindowListener(l); // mouse event handler MouseListener mouseListener = new MouseAdapter() { public void mouseClicked(MouseEvent ev) { x = ev.getX(); y = ev.getY(); repaint(); } }; addMouseListener(mouseListener); }

public void paint(Graphics g) { g.drawOval(x-50, y-50, 100, 100); }

public void actionPerformed(ActionEvent ev) { String command = ev.getActionCommand(); if ("Exit".equals(command)) { System.exit(0); } } }

Ketik kode Java di atas, kemudian compile dan jalankan. Apa yang dihasilkan oleh program tersebut?

Program tersebut adalah sebuah aplkasi GUI menggunakan AWT. Program itu mempunyai sebuah jendela (window)

2

utama dengan sebuah menu dan sebuah lingkaran. Menunya hanya berisi sebuah item, Exit, yang digunakan untuk menutup jendela (window) ketika dipilih. Penggambaran grafik merespon hasil klik mouse dengan menggambar objek pada lokasi mouse ketika di-klik. Kelas AWTDemo didefinisikan menjadi sebuah subkelas Frame (Bingkai). Kelas tersebut mendefinisikan windows (jendela) program utama. Menu dalam frame (bingkai) dibuat dengan objek dari Kelas MenuBar, Menu, dan MenuItem. Kelas AWTDemo mengimplementasikan interface ActionListener untuk memproses ActionEvent yang dibangkitkan oleh pilihan menu. Method actionPerformed yang didefinisikan dalam interface adalah kendali (handler) untuk kejadian (event). Ketika item menu Exit dipilih, program keluar dengan memanggil method System.exit(0). Dua pengendali kejadian (event handler) lainnya didefinisikan dalam konstruktor kelas AWTDemo. Sebuah WindowListener didefinisikan sebagai sebuah kelas anonim dari WindowAdapter. Kelas ini akan menjalankan method windowClosing untuk menghentikan program ketika menerima kejadian (event) penutupan (closing) untuk jendela (window). Listener lainnya adalah sebuah MouseListener, diturunkan dari kelas MouseAdapter. Methode mouseClicked digunakan untuk menangani kejadian klik-mouse (event mouse-click). Dalam method mouseClicked, lokasi mouse-nya disimpan kedalam variabel x dan y, dan sebuah panggilan terhadap method repaint dibuat untuk penggambaran kembali dan memindahkan objek ke lokasi yang baru. Method paint menggambar sebuah lingkaran beradius 50 dengan method drawOval dalam objek Graphics. Titik tengah lingkaran ditentukan dengan variabel x dan y. Method utama (main method) membuat dan menampilkan sebuah instance AWTDemo. Bingkainya (frame) ditentukan dengan ukuran 640 x 480.

Java 2D Platform Java memberikan sekumpulan API (application programming interface) yang komprehensif. Java API mencakup pekerjaan dan aplikasi yang luas: I/O file, grafika, multimedia, database, jaringan, keamanan, dan sebagainya. Java 2 membawa kemajuan yang signifikan dalam kemampuan grafik dengan memperkenalkan Swing dan API Java 2D dan 3D. API yang didesain dengan baik memberikan dukungan komprehensif untuk grafika komputer. Bersamasama dengan keuntungan unik yang dapat diperoleh dari bahasa pemrograman Java, mereka telah mengkombinasikan Java dengan Java 2D dan 3D; sebuah pilihan yang sangat baik untuk pemrograman grafika dan belajar grafika komputer. Di bawah ini sebuah contoh yang mendemonstrasikan fitur grafika Java 2D. Kode dalam demo ini menggunakan kemampuan Java 2D seperti, transparansi, pewarnaan gradien, transformasi, dan pemilihan jenis huruf yang tidak tersedia dalam Java AWT. Untuk mencoba kemampuan Java 2D di komputer Anda lakukan tahapan-tahapan berikut: 1. 2. 3. 4. Ketika listing kode berikut. Compile listing kode yang sudah Anda ketikkan Jalankan file dari hasil peng-compile-an tersebut. Tampilan apa yang dihasilkan oleh program tersebut?

3

Kode Java 2.1 Demo2D.java/* Demo kemampuan Java 2D Gunakan perintah: javac Demo2D, untuk meng-compile file ini Kemudian jalankan file hasil peng-compile-an dengan perintah java Demo2D */

import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.font.*; import java.awt.geom.*;

public class Demo2D extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Java 2D Demo"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new Demo2D(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); }

public void init() { JPanel panel = new Panel2D(); getContentPane().add(panel); } }

class Panel2D extends JPanel{ public Panel2D() { setPreferredSize(new Dimension(500, 400)); setBackground(Color.white); }

public void paintComponent(Graphics g) {

4

super.paintComponent(g); Graphics2D g2 = (Graphics2D)g;

// draw an ellipse Shape ellipse = new Ellipse2D.Double(150, 100, 200, 200); GradientPaint paint = new GradientPaint(100,100, Color.white, 400, 400, Color.gray); g2.setPaint(paint); g2.fill(ellipse);

// set transparency AlphaComposite ac = AlphaComposite.getInstance(AlphaComposite.SRC_OVER, 0.4f); g2.setComposite(ac); g2.setColor(Color.blue);

// draw transparent text Font font = new Font("Serif", Font.BOLD, 120); g2.setFont(font); g2.drawString("Java", 120, 200);

// get outline of text glyph FontRenderContext frc = g2.getFontRenderContext(); GlyphVector gv = font.createGlyphVector(frc, "2D"); Shape glyph = gv.getOutline(150,300);

// draw rotated glyph g2.rotate(Math.PI/6, 200, 300); g2.fill(glyph); } }

Nama kelas komponen Swing secara khusus mempunyai awalan J. Kelas Panel2D extends kelas JPanel dan overrides method paintComponent. Parameter Grafik dalam method adalah cast to Graphics2D untuk mengambil manfaat fungsi yang dikembangkan dalam Java 2D. Sebuah lingkaran digambar dengan warna gradien yang merubah warnanya berdasarkan lokasi. Kemudian composite rule diatur untuk mencapai derajat transparansi. Huruf glyph untuk string text 2D diambil dan garis tepinya (outline) digunakan sebagai bentuk geometri. Bentuk string 2D diputar 30 derajat (p/6).

5

Program Java sering dapat ditulis sebagai applet atau aplikasi. Program di atas sebuah contoh program dual purpose. Kelas Demo2D adalah subkelas dari JApplet dan dapat dijalankan sebagai applet. Tetapi, dalam program ini juga terdapat method utama (main method) sehingga juga dapat dijalankan sebagai aplikasi. Method utama (main method) membuat sebuah instance Jframe dan menambah sebuah instance Demo2D ke bingkai (frame). Hasil dari program aplikasi dan aplet hampir mirip.

6

BAB 2 DASAR-DASAR GRAFIK 2D

2.1 MENGGAMBAR OBJEK GEOMETRIS SEDERHANAJava 2D API menyediakan beberapa kelas yang mendefinisikan objek geometris umum seperti titik, garis, kurva, dan persegipanjang. Kelas geometri ini adalah bagian dari paket java.awt.geom. Tabel 2.1. Kelas Geometri No Objek Kelas

Subkelas Line2D.Double Line2D.Float Rectangle2D.Double Rectangle2D.Float

Format g2.draw(new Line2D.Double(x1, y1, x2, y2)); g2.draw(new Rectangle2D.Double(x, y, rectwidth, rectheight)); g2.draw(new Ellipse2D.Double(x, y, rectwidth, rectheight)); g2.draw(new Arc2D.Double(x, y, rectwidth, rectheight, 90, 135, Arc2D.OPEN)); g2.draw(new QuadCurve2D.Double(x 1, y1, ctrlx, ctrly, x2, y2));

Contoh g2.drawLine(100,100 ,200,200); g2.draw(new Rectangle2D.Double( 50, 25, 100, 50)); g2.draw(new Ellipse2D.Double(20 0,50,100,50)); g2.draw(new Arc2D.Double(200, 125, 100, 50, 90, 135, Arc2D.OPEN)); g2.draw(new QuadCurve2D.Doubl e(100,250,175,175,30 0,250));

1

Garis

Line2D

2

Persegipanjang

Rectangle2D

3

Ellips

Ellipse2D

Ellipse2D.Double Ellipse2D.Float

4

Busur

Arc2D

Arc2D.Double Arc2D.Float QuadCurve2D.Dou ble QuadCurve2D.Floa t

5

Kurva kuadrat

QuadCurve2D

6

Kurva kubik

CubicCurve2D

CubicCurve2D.Doubl g2.draw(new e CubicCurve2D.Double( CubicCurve2D.Float 50,300,150, 200,200,400,300,300));

g2.draw(c.setCurve(x 1, y1, ctrlx1, ctrly1, ctrlx2, ctrly2, x2, y2));

Catatan: Kelas Arc2D mendefinisikan 3 (tiga) tipe busur, ditunjukkan dengan konstanta yang menyertai dalam

kelas ini: OPEN, PIE, dan CHORD. Berikut adalah contoh penerapan kelas geometris dalam sebuah program Java. Listing 2.1 KelasGeometri.java import java.awt.*; import java.awt.event.*; 7

import javax.swing.*; import java.awt.font.*; import java.awt.geom.*; public class KelasGeometri extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Kelas Geometri"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new KelasGeometri(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); } public void init() { JPanel panel = new Panel2D(); getContentPane().add(panel); } } class Panel2D extends JPanel{ public Panel2D() { setPreferredSize(new Dimension(500, 400)); setBackground(Color.white); } public void paintComponent(Graphics g) { super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; //gambar garis; g2.drawLine(100,100,200,200); //gambar persegipanjang g2.draw(new Rectangle2D.Double(50, 25, 100, 50)); //gambar elips 8

g2.draw(new Ellipse2D.Double(200,50,100,50)); //gambar busur g2.draw(new Arc2D.Double(200, 125, 100, 50, 90, 135, Arc2D.OPEN)); //gambar kurva kuadrat g2.draw(new QuadCurve2D.Double(100,250,175,175,300,250)); //gambar kurva kubik g2.draw(new CubicCurve2D.Double(50,300,150, 200,200,400,300,300)); } } Latihan: Ketiklah kode program diatas. Kemudian compile dan jalankan. Apa yang dihasilkan oleh program tersebut? Jelaskan! 2.2 GEOMETRI BIDANG KONSTRUKTIFSatu cara untuk membuat bentuk lebih kompleks adalah dengan mengkombinasikan beberapa bentuk sebelumnya (objek geometri). Cara ini dikenal sebagai geometri area konstruktif (constructive area geometry). Kelas Area didesain untuk menghasilkan geometri area konstruktif. Empat operasi yang didukung adalah: union, interseksi, pertidaksamaan, pertidaksamaan geometris. Operasi ini dilakukan pada wilayah dua bidang, menghasilkan bidang baru. Objek Area dapat dibangun dari semua objek Shape menggunakan konstruktor berikut:: void add(Area a) void intersect(Area a) void subtract(Area a) void exclusiveOr(Area a) Listing berikut menunjukkan sebuah program yang mendemonstrasikan efek dari empat operasi geometri area konstruktif. Dua bentuk dikombinasikan menggunakan empat operasi untuk menghasilkan empat bentuk baru.

Listing 2.2 AddArea.java import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.geom.*; public class AddArea extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Constructive Area Geometry");

9

frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new AddArea(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); } public void init() { JPanel panel = new AreaPanel(); getContentPane().add(panel); } } class AreaPanel extends JPanel { public AreaPanel() { setPreferredSize(new Dimension(760, 400)); } public void paintComponent(Graphics g) { Graphics2D g2 = (Graphics2D)g; //lingkaran pertama. Shape s1 = new Ellipse2D.Double(0, 0, 100, 100); //lingkaran kedua. Shape s2 = new Ellipse2D.Double(60, 0, 100, 100); //area geometri pertama. Area a1 = new Area(s1); //area geometri kedua. Area a2 = new Area(s2); //geser posisi kedua kedua lingkaran dengan x=20 y=50. g2.translate(20, 50); //penentuan ketebalan dan warna garis. BasicStroke bsThickLine = new BasicStroke(5.0f); g2.setStroke(bsThickLine); g2.setPaint(Color.blue); //gambar lingkaran pertama. g2.draw(s1); //gambar lingkaran kedua. g2.draw(s2); //operasi "add".

10

a2.add(a1); //penentuan warna untuk mengisi hasil operasi "add". g2.setPaint(Color.green); //pewarnaan area hasil operasi "add". g2.fill(a2); } }

Listing 2.3 IntersectArea.java import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.geom.*; public class IntersectArea extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Geometri Bidang Konstruktif"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new IntersectArea(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); } public void init() { JPanel panel = new AreaPanel(); getContentPane().add(panel); } } class AreaPanel extends JPanel { public AreaPanel() { setPreferredSize(new Dimension(760, 400)); } public void paintComponent(Graphics g) { Graphics2D g2 = (Graphics2D)g; //lingkaran pertama Shape s1 = new Ellipse2D.Double(0, 0, 100, 100);

11

//lingkaran kedua Shape s2 = new Ellipse2D.Double(60, 0, 100, 100); //area geometri pertama Area a2 = new Area(s2); //pindah posisi kedua kedua lingkaran dengan x=20 y=50 g2.translate(20, 50); //gambar lingkaran pertama g2.draw(s1); //gambar lingkaran kedua g2.draw(s2); //area geometri kedua Area a1 = new Area(s1); //operasi "intersect" a1.intersect(a2); //penentuan ketebalan dan warna garis BasicStroke bsThickLine = new BasicStroke(5.0f); g2.setStroke(bsThickLine); g2.setPaint(Color.blue); //gambar bidang hasil operasi "intersect" g2.draw(a1); //penentuan warna untuk mengisi bidang hasil operasi "intersect". g2.setPaint(Color.green); //pewarnaan bidang hasil operasi "intersect". g2.fill(a1); } }

Listing 2.4 Subtract.Area.java import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.geom.*; public class SubtractArea extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Geometri Bidang Konstruktif"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

12

JApplet applet = new SubtractArea(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); } public void init() { JPanel panel = new AreaPanel(); getContentPane().add(panel); } } class AreaPanel extends JPanel { public AreaPanel() { setPreferredSize(new Dimension(760, 400)); } public void paintComponent(Graphics g) { Graphics2D g2 = (Graphics2D)g; //lingkaran pertama Shape s1 = new Ellipse2D.Double(0, 0, 100, 100); //lingkaran kedua Shape s2 = new Ellipse2D.Double(60, 0, 100, 100); //area geometri pertama Area a2 = new Area(s2); //pindah posisi kedua kedua lingkaran dengan x=20 y=50 g2.translate(20, 50); //gambar lingkaran pertama g2.draw(s1); //gambar lingkaran kedua g2.draw(s2); //area geometri kedua Area a1 = new Area(s1); //operasi "subtract" a1.subtract(a2); //penentuan ketebalan dan warna garis BasicStroke bsThickLine = new BasicStroke(5.0f); g2.setStroke(bsThickLine); g2.setPaint(Color.blue);

13

//gambar bidang hasil operasi "subtract" g2.draw(a1); //penentuan warna untuk mengisi bidang hasil operasi "subtract". g2.setPaint(Color.green); //pewarnaan bidang hasil operasi "subtract". g2.fill(a1); } }

Listing 2.5 exclusiveOrArea.java import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.geom.*; public class ExclusiveOrArea extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Geometri Bidang Konstruktif"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new ExclusiveOrArea(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); } public void init() { JPanel panel = new AreaPanel(); getContentPane().add(panel); } } class AreaPanel extends JPanel { public AreaPanel() { setPreferredSize(new Dimension(760, 400)); } public void paintComponent(Graphics g) { Graphics2D g2 = (Graphics2D)g; //lingkaran pertama

14

Shape s1 = new Ellipse2D.Double(0, 0, 100, 100); //lingkaran kedua Shape s2 = new Ellipse2D.Double(60, 0, 100, 100); //area geometri pertama Area a2 = new Area(s2); //pindah posisi kedua kedua lingkaran dengan x=20 y=50 g2.translate(20, 50); //gambar lingkaran pertama g2.draw(s1); //gambar lingkaran kedua g2.draw(s2); //area geometri kedua Area a1 = new Area(s1); //operasi "exclusiveOr" a1.exclusiveOr(a2); //penentuan ketebalan dan warna garis BasicStroke bsThickLine = new BasicStroke(5.0f); g2.setStroke(bsThickLine); g2.setPaint(Color.blue); //gambar bidang hasil operasi "exclusiveOr" g2.draw(a1); //penentuan warna untuk mengisi bidang hasil operasi "exclusiveOr". g2.setPaint(Color.green); //pewarnaan bidang hasil operasi "exclusiveOr". g2.fill(a1); } } Latihan ketik masing-masing listing program tersebut di atas. Kemudian compile dan jalankan. Catatan: Supaya hanya menampilkan bidang hasil operasi add, intersect, subtract, dan, dan exclusiveOr, hilangkan instruksi (baris program): //gambar lingkaran pertama g2.draw(s1); //gambar lingkaran kedua g2.draw(s2); pada masing-masing listing program.

15

2.1 MENGGAMBAR OBJEK GEOMETRIS SEDERHANA Anda telah belajar bagaimana menggambar bentuk-bentuk geometri yang terdapat dalam paket java.awt.geom. Untuk membuat objek geometri yang lebih kompleks, misalnya poligon, segitiga, atau bintang, Anda bisa menggunakan kelas lain dari paket java.awt.geom, yaitu GenaralPath. GeneralPath dimulai dari titik asal, misalnya (0,0). Untuk membuat objek dengan kelas GeneralPath, panggil dengan new GeneralPath() kemudian tambahkan segmen ke bentuk yang akan dibuat dengan menggunakan method-method berikut: moveTo(float x, float y) Memindahkan titik path sekarang ke titik path yang diinginkan. lineTo(float x, float y) menambahkan segmen garis ke path sekarang quadTo(float x, float y) menambahkan segmen kurva kuadrat ke path sekarang curveTo(float x, float y) menambahkan segmen kurva kubik ke path sekarang closePath() - menutup path.Contoh berikut menjelaskan bagaimana menggambar sebuah polyline menggunakan GeneralPath:

Listing 2.1 KelasGeneralPath.java import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.font.*; import java.awt.geom.*; public class KelasGeneralPath extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Kelas GeneraPath"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new KelasGeneralPath(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); } public void init() { 16

JPanel panel = new Panel2D(); getContentPane().add(panel); } } class Panel2D extends JPanel{ public Panel2D() { setPreferredSize(new Dimension(500, 400)); setBackground(Color.white); } public void paintComponent(Graphics g) { super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; GeneralPath gp = new GeneralPath(); //Mulai dari sudut depan-bawah mobil. gp.moveTo(60,120); //bagian bodi bawah-depan gp.lineTo(80,120); //roda depan gp.quadTo(90,140,100,120); //bagian bodi bawah-tengah gp.lineTo(160,120); //roda belakang gp.quadTo(170,140,180,120); //bagian bodi bawah-belakang gp.lineTo(200,120); //bagian belakang mobil gp.curveTo(195,100,200,80,160,80); //atap gp.lineTo(110,80); //kaca depan gp.lineTo(90,100); //bagian hidung mobil 17

gp.lineTo(60,100); //bagian depan mobil gp.lineTo(60,120); //menggambar mobil g2.draw(gp); } } Latihan Ketiklah kode program diatas. Kemudian compile dan jalankan. Menurut Anda gambar apa yang dihasilkan oleh program tersebut? Jelaskan!Tugas Projek Tahap II Lengkapilah program yang sudah Anda buat sebelumnya dengan menu yang digunakan untuk pengaturan garis pada objek geometri yang terpilih untuk ditampilkan. Lihat screenshot berikut:

Gambar 3.1 Menu (objek) persegipanjang dan (tipe garis) putus-putus terpilih

18

Gambar 3.1 Menu (objek) elips dan (tipe garis) tebal terpilih

Keterangan: 1. 2. Tampilan di atas hanya merupakan contoh saja. Dalam tahap II (kedua) program ditambah kemampuan untuk menentukan tipe garis (stroke) yang digunakan

untuk menampilkan objek geometri saja. 3. Silahkan membuat program menurut kreativitas masing-masing, misalnya: Untuk membuat menu tipe garis yang akan ditampilkan bisa diganti menggunakan radioButton. Ditambah TextField yang digunakan untuk menentukan ketebalan garis. 1. 2. Dan lain-lain. Penambahan menu tipe garis diharapkan dapat diselesaikan dalam satu minggu, supaya tidak terbebani

pada tahapan projek berikutnya.

19

BAB 3 MODEL GARISAnda telah mempelajari bagaimana membuat objek geometri sederhana dan bentuk-bentuk kompleks lainnya. Dalam modul berikutnya akan dibahas tentang pengaturan tipe-tipe garis pada grafik. Materi yang dipelajari meliputi pemilihan model garis/outline (stroking) yang diterapkan dalam pembuatan objek geometri.

1.1 TIPE-TIPE GARISJava 2D menyertakan interface Stroke untuk menampilkan tipe-tipe garis. Implementasi interface stroke yang nyata adalah dengan menggunakan kelas BasicStroke. Kelas BasicStroke menyediakan pengaturan untuk lebar, bentuk akhir garis, bentuk gabungan antar garis, dan garis putus-putus. Konstruktor dari BasicStroke adalah sebagai berikut: BasicStroke() BasicStroke(float width) BasicStroke(float width, int cap, int join) BasicStroke(float width, int cap, int join, float miterlimit) BasicStroke(float width, int cap, int join, float miterlimit, float[] dash, float dashphase) Parameter width mendefinisikan lebar dari garis yang digambar. Parameter cap mengatur bentuk akhir garis dan dapat menggunakan nilai: CAP_BUTT CAP_ROUND CAP_SQUARE Parameter join mendefinisikan bentuk penggabungan dua garis dengan nilai: JOIN_BEVEL JOIN_MITER JOIN_ROUND miterlimit mengatur batasan untuk untuk JOIN_MITER untuk menanggulangi bentuk gabungan dua garis yang sangat panjang ketika sudut antara kedua garis kecil.

Array dash mendefinisikan pola garis putus-putus dengan mengatur panjang segment ON/OF. Dasphase mendefinisikan bentuk titik awal dalam pola garis putus-putus.

Graphics2D mempunyai method berikut untuk menentukan model garis sekarang: void setStroke(Stroke s)

Listing berikut mempertunjukkan efek grafik yang menggambar garis dengan tipe garis (stroke) yang berbeda-beda.

20

Listing 3.1. TestStroke1.java import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.font.*; import java.awt.geom.*; public class TestStroke1 extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Test Stroke-1"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new TestStroke1(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); } public void init() { JPanel panel = new Panel2D(); getContentPane().add(panel); } }


public void paintComponent(Graphics g) { super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; //menggambar sebuah garis dengan ketebalan 3 (piksel) BasicStroke bsGarisTebal = new BasicStroke(3.0f); g2.setStroke(bsGarisTebal); g2.drawLine(30,50,30,250);

21

//array untuk mendiskkripsikan pola garis putus-putus. float[] dashPattern;

//offset dimana pola garis putus-putus harus mulai. float dashPhase = 0.0f;

//pola garis putus-putus. dashPattern = new float[10]; dashPattern[0] = 4.0f; dashPattern[1] = 5.0f; dashPattern[2] = 8.0f; dashPattern[3] = 5.0f; dashPattern[4] = 12.0f; dashPattern[5] = 5.0f; dashPattern[6] = 16.0f; dashPattern[7] = 5.0f; dashPattern[8] = 20.0f; dashPattern[9] = 5.0f;

//pendefinisian dari BasicStroke yang akan digunakan. BasicStroke bsBerpola = new BasicStroke(3.0f, BasicStroke.CAP_BUTT, BasicStroke.JOIN_BEVEL,2.0f, dashPattern, dashPhase); g2.setStroke(bsBerpola);

//Menggambar sebuah garis dengan pola putus-putus. g2.drawLine(60,50,60,250);

//sebuah pola putus-putus yang sederhana dengan panjang garis(dash) 20 dan //lebar jarak 10. dashPattern = new float[2]; dashPattern[0] = 20; dashPattern[1] = 10; //Pendefinisian BasicStroke yang akan digunakan. BasicStroke bsDashed = new BasicStroke(3.0f,BasicStroke.CAP_BUTT, BasicStroke.JOIN_BEVEL,2.0f, dashPattern,dashPhase);

22

g2.setStroke(bsDashed);

//menggambar sebuah garis (vertikal) dengan pola yang telah //didefinisikan sebelumnya. g2.drawLine(120,50,120,250);

//menggambar sebuah garis (diagonal) dengan pola yang //telah didefinisikan sebelumnya. g2.drawLine(150,50,350,250);

//Menggunakan pola garis putus-putus yang sama seperti sebelumnya, //tetapi dengan offset 10 dashPhase = 10.0f; //Pendefinisain BasicStroke yang akan digunakan. BasicStroke bsDashedShifted = new BasicStroke(3.0f,BasicStroke.CAP_BUTT, BasicStroke.JOIN_BEVEL,2.0f, dashPattern,dashPhase); //menggambar sebuah garis (vertikal) dengan pola putus-putus yang telah //didefinisikan sebelumnya. g2.setStroke(bsDashedShifted); g2.drawLine(90,50,90,250); } }

Latihan: Ketiklah kode program diatas. Kemudian tersebut? Jelaskan! Jawab: ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________ compile dan jalankan. Apa yang dihasilkan oleh program

Berikut adalah contoh penerapan kelas BasicStroke dalam sebuah program yang digunakan untuk menggambar objek geometri sederhana. 23

Listing 3.2. TestStrokeGeom.java import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.font.*; import java.awt.geom.*; public class TestStrokeGeom extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Test Stroke-2"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new TestStrokeGeom(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); } public void init() { JPanel panel = new Panel2D(); getContentPane().add(panel); } }

class Panel2D extends JPanel{ public Panel2D() { setPreferredSize(new Dimension(500, 400)); setBackground(Color.white); } public void paintComponent(Graphics g) { super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; //menggambar sebuah garis dengan ketebalan 3 (piksel) BasicStroke bsGarisTebal = new BasicStroke(3.0f); g2.setStroke(bsGarisTebal); g2.drawLine(30,50,30,250); //array untuk mendiskkripsikan pola garis putus-putus. float[] dashPattern;

24

//offset dimana pola garis putus-putus harus mulai. float dashPhase = 0.0f; //pola garis putus-putus. dashPattern = new float[10]; dashPattern[0] = 4.0f; dashPattern[1] = 5.0f; dashPattern[2] = 8.0f; dashPattern[3] = 5.0f; dashPattern[4] = 12.0f; dashPattern[5] = 5.0f; dashPattern[6] = 16.0f; dashPattern[7] = 5.0f; dashPattern[8] = 20.0f; dashPattern[9] = 5.0f;

//pendefinisian dari BasicStroke yang akan digunakan. BasicStroke bsBerpola = new BasicStroke(3.0f, BasicStroke.CAP_BUTT, BasicStroke.JOIN_BEVEL,2.0f, dashPattern, dashPhase); g2.setStroke(bsBerpola); //Menggambar sebuah garis dengan pola putus-putus yang telah didefinisikan //sebelumnya g2.drawLine(100,100,200,200); //sebuah pola putus-putus yang sederhana dengan panjang garis(dash) 20 dan //lebar jarak antar garis 10. dashPattern = new float[2]; dashPattern[0] = 20; dashPattern[1] = 10; //pendefinisian BasicStroke yang akan digunakan. BasicStroke bsGarisPutusPutus = new BasicStroke(3.0f,BasicStroke.CAP_BUTT, BasicStroke.JOIN_BEVEL,2.0f, dashPattern,dashPhase); g2.setStroke(bsGarisPutusPutus); //menggambar persegipanjang dengan pola garis putus-putus yang telah //didefinisikan sebelumnya. g2.draw(new Rectangle2D.Double(50, 25, 100, 50)); //menggambar elips dengan pola garis putus-putus

25

//sama seperti sebelumnya g2.draw(new Ellipse2D.Double(200,50,100,50)); //menggambar busur dengan pola garis putus-putus //sama seperti sebelumnya. g2.draw(new Arc2D.Double(200, 125, 100, 50, 90, 135, Arc2D.OPEN)); //gambar kurva kuadrat dengan pola garis putus-putus //sama seperti sebelumnya. g2.draw(new QuadCurve2D.Double(100,250,175,175,300,250)); //gambar kurva kubik g2.draw(new CubicCurve2D.Double(50,300,150, 200,200,400,300,300)); } }


Listing 3.3 mempertunjukkan efek grafik yang menggambar dengan pengaturan tipe garis (stroke) yang berbeda-beda.

Listing 3.3 TestStroke.java import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.geom.*;

public class TestStroke extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Test Strokes"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new TestStroke();

26

applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); }

public void init() { JPanel panel = new StrokePanel(); getContentPane().add(panel); } }

class StrokePanel extends JPanel { public StrokePanel() { setPreferredSize(new Dimension(700, 400)); setBackground(Color.white); }

public void paintComponent(Graphics g) { super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; GeneralPath path = new GeneralPath(GeneralPath.WIND_EVEN_ODD);

//menggambar objek bebas path.moveTo(0,120); path.lineTo(80,0); path.lineTo(160,120);

//mengatur bentuk gabungan dua garis dengan: //tebal = 20 //bentuk akhir garis = CAP_BUTT //bentuk gabungan = JOIN_BEVEL Stroke stroke = new BasicStroke(20, BasicStroke.CAP_BUTT, BasicStroke.JOIN_BEVEL); g2.setStroke(stroke); g2.translate(50,50); g2.draw(path);

27

g2.drawString("JOIN_BEVEL",100,0); g2.drawString("CAP_BUTT", 40, 120);

//mengatur bentuk gabungan dua garis dengan: //tebal = 20 //bentuk akhir garis = CAP_ROUND //bentuk gabungan = JOIN_MITTER stroke = new BasicStroke(20, BasicStroke.CAP_ROUND, BasicStroke.JOIN_MITER); g2.setStroke(stroke); g2.translate(200,0); g2.draw(path); g2.drawString("JOIN_MITER",100,0); g2.drawString("CAP_ROUND", 40, 120);

//mengatur bentuk gabungan dua garis dengan: //tebal = 20 //bentuk akhir garis = CAP_SQUARE //bentuk gabungan = JOIN_ROUND stroke = new BasicStroke(20, BasicStroke.CAP_SQUARE, BasicStroke.JOIN_ROUND); g2.setStroke(stroke); g2.translate(200,0); g2.draw(path); g2.drawString("JOIN_ROUND",100,0); g2.drawString("CAP_SQUARE", 40, 120);

//menggambar garis putus-putus //pola garis float[] dashArray = {60,20,20,40}; //bentuk awal float dashPhase = 0; //mengatur model garis dengan: //mengatur bentuk gabungan dua garis dengan: //tebal = 10 //bentuk akhir garis = CAP_BUTT //bentuk gabungan = JOIN_BEVEL

28

stroke = new BasicStroke(10, BasicStroke.CAP_BUTT, BasicStroke.JOIN_BEVEL, 0, dashArray, dashPhase); g2.setStroke(stroke); g2.translate(-400,200); g2.drawLine(100, 50, 550, 50); g2.drawString("dash=60 20 20 40", 250, 10); g2.drawString("phase=0", 0, 50); dashPhase = 20;

//mengatur model garis dengan: //mengatur bentuk gabungan dua garis dengan: //tebal = 10 //bentuk akhir garis = CAP_BUTT //bentuk gabungan = JOIN_BEVEL stroke = new BasicStroke(10, BasicStroke.CAP_BUTT, BasicStroke.JOIN_BEVEL, 0, dashArray, dashPhase); g2.setStroke(stroke); g2.translate(0,50); g2.drawLine(100, 50, 550, 50); g2.drawString("phase=20", 0, 50); } }


29

Tugas Projek Tahap II Lengkapilah program yang sudah Anda buat sebelumnya dengan menu yang digunakan untuk pengaturan garis pada objek geometri yang terpilih untuk ditampilkan. Lihat screenshot berikut:

Gambar 3.1 Menu (objek) persegipanjang dan (tipe garis) putus-putus terpilih

30

Gambar 3.1 Menu (objek) elips dan (tipe garis) tebal terpilih

Keterangan: 1. 2. Tampilan di atas hanya merupakan contoh saja. Dalam tahap II (kedua) program ditambah kemampuan untuk menentukan tipe garis (stroke) yang digunakan

untuk menampilkan objek geometri saja. 3. Silahkan membuat program menurut kreativitas masing-masing, misalnya: Untuk membuat menu tipe garis yang akan ditampilkan bisa diganti menggunakan radioButton. Ditambah TextField yang digunakan untuk menentukan ketebalan garis. 1. 2. Dan lain-lain. Penambahan menu tipe garis diharapkan dapat diselesaikan dalam satu minggu, supaya tidak terbebani

pada tahapan projek berikutnya.

31

BAB 4 PEWARNAANAnda telah mempelajari bagaimana membuat objek geometri sederhana dan bentuk-bentuk kompleks lainnya serta cara menentukan tipe-tipe garis (stroke) pada grafik. Dalam modul berikutnya akan dibahas tentang cara menambahkan beberapa warna. Materi yang dipelajari meliputi pengisian warna (filling) yang diterapkan dalam pembuatan objek geometri.

4.1 WARNA Ketika objek geometri dibangun, objek tersebut dapat digambar dengan method fill(Shape) atau draw(Shape) dalam Graphics2D. Untuk menentukan warna yang diganakan untuk menggambar objek, method dari kelas Graphics berikut bisa digunakan:

void setColor(Color c)

Objek Color mendefinisikan sebuah warna. Kelas Color secara default menggunakan rentang warna RGB, sebagai rentang warna standard. Warna yang terdiri dari Merah (Red), Hijau(Green), Biru(Blue) dan komponen Alfa (Alpha). Komponen alpha mendefinisikan tingkat transparansi warna tersebut. Kelas Color mendefinisikan nilai warna konstanta(constant) berikut::

32

black blue cyan darkGray gray green lightGray magenta orange pink red white yellow

Nama tersebut tidak mengikuti konvensi(convention) penamaan Java, yang mengatur bahwa konstanta harus dalam huruf kapital. Sejak JDK 1.4, Anda bisa juga menggunakan konstanta baru: BLACK, BLUE, CYAN,

DARK_GRAY, GREEN, LIGHT_GRAY, MAGENTA, ORANGE, PINK, RED, WHITE, and YELLOW.Warna lain dengan mudah dapat dibangun menggunakan satu dari banyak konstruktor kelas Color. Anda bisa langsung menentukan(specify) nilai RGB menggunakan konstruktor berikut:

Color(int r, int g, int b); Color(int rgb); Color(float r, float g, float b);

Versi pertama untuk menentukan ketiga komponen warna menggunakan nilai int dengan rentang 0-255. Versi kedua mirip dengan yang pertama, tetapi ketiga nilainya dijadikan di-paket-kan dalam satu nilai int. Versi ketiga menggunakan nilai float di rentang 0.0 1.0 untuk mendefinisikan komponen warnanya. Konstruktor lain dari kelas Color mengijikan spesifikasi ruang warna.

Color(ColorSpace colorSpace, float[] components, float alpha);

Berikut adalah potongan program untuk menggambar tiga bujursangkar dengan warna berbeda:

public void paintComponent(Graphics g) {

33

g.setColor(Color.red); g.draw(new Rectangle(0, 0, 100, 100)); g.setColor(new Color(0, 255, 128)); g.draw(new Rectangle(100, 0, 100, 100)); g.setColor(new Color(0.5f, 0.0f, 1.0f)); g.draw(new Rectangle(200, 0, 100, 100)); }

Berikut listing lengkap dari program di atas. Listing tersebut menunjukkan sebuah program yang mendemonstrasikan gambar sebuah objek geometris dengan warna garis yang berbeda-beda.

Listing 4.1 TestStrokeGeom.java import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.font.*; import java.awt.geom.*; public class TestStrokeGeom extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Test Stroke-2"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new TestStrokeGeom(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); } public void init() { JPanel panel = new Panel2D(); getContentPane().add(panel); } } class Panel2D extends JPanel{ public Panel2D() { setPreferredSize(new Dimension(500, 400)); setBackground(Color.white);

34

} public void paintComponent(Graphics g) { super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; g2.setColor(Color.red); g2.draw(new Rectangle(0, 0, 100, 100)); g2.setColor(new Color(0, 255, 128)); g2.draw(new Rectangle(100, 0, 100, 100)); g2.setColor(new Color(0.5f, 0.0f, 1.0f)); g2.draw(new Rectangle(200, 0, 100, 100)); } }


Berikut listing lengkap dari program yang mendemonstrasikan gambar sebuah objek geometris dengan warna garis yang berbeda dengan warna area bidang-nya.

Listing 4.1 SegiPanjangWarna.java import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.font.*; import java.awt.geom.*;

public class SegiPanjangWarna extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Persegi Panjang Warna");

35

frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new SegiPanjangWarna(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); }



public void paintComponent(Graphics g) { super.paintComponent(g);

Graphics2D g2 = (Graphics2D)g;

//gambar persegipanjang. Rectangle2D.Double persegipanjang = new Rectangle2D.Double(300,100,100,50); g2.setColor(Color.GREEN); g2.fill(persegipanjang); g2.setColor(Color.blue); g2.setStroke(new BasicStroke(3.0f)); g2.draw(persegipanjang); } } Latihan: Ketiklah kode program diatas. Kemudian tersebut? Jelaskan! compile dan jalankan. Apa yang dihasilkan oleh program

36

Jawab: ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________

4.1 KELAS GradientPaint Kelas GradientPaint mendefinsikan jenis warna dengan warna yang bermacam-macam. Warna gradien ditetapkan oleh dua poin dan dua warna. Ketika lokasi warna berpindah dari poin pertama ke poin kedua, warna berubah secara berangsur-angsur pula dari warna yang pertama ke yang warna yang kedua. Warna gradien dapat siklis (cyclic) atau tidak siklis (acyclic). Warna gradien siklis berulang dengan pola yang sama secara periodik. Untuk membuat warna gradien tidak siklis (acyclic), konstruktor berikut dapat digunakan: GradientPaint(float x1, float y1, Color c1, float x2, float y2, Color c2); Untuk membuat warna gradien siklis (cyclic), dapat digunakan konstruktor berikut: GradientPaint(float x1, float y1, Color c1, float x2, float y2, Color c2, boolean);

Berikut adalah contoh penerapan kelas GradientPaint dalam sebuah program Java.Listing 4.2 SegipanjangWarnaGradient.java import java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.font.*; import java.awt.geom.*;

public class SegiPanjangWarnaGradient extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Persegipanjang warna-gradien"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new SegiPanjangWarnaGradient(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); }

37



public void paintComponent(Graphics g) { super.paintComponent(g);

Graphics2D g2 = (Graphics2D)g;

//gambar persegipanjang. Rectangle2D.Double persegipanjang = new Rectangle2D.Double(300,100,100,50); //membuat warna gradien tidak siklis (acyclic). GradientPaint warnaGradien = new GradientPaint(300, 50, Color.green, 350, 50, Color.yellow); g2.setPaint(warnaGradien); g2.fill(persegipanjang); g2.setColor(Color.blue); g2.setStroke(new BasicStroke(3.0f)); g2.draw(persegipanjang);

//gambar persegipanjang. Rectangle2D.Double persegipanjang2 = new Rectangle2D.Double(100,200, 200,50); //membuat warna gradien siklis (cyclic). GradientPaint warnaGradien2 = new GradientPaint(125,100,Color.green, 150,100,Color.yellow,true); g2.setPaint(warnaGradien2); g2.fill(persegipanjang2);

38

g2.setColor(Color.blue); g2.setStroke(new BasicStroke(3.0f)); g2.draw(persegipanjang2);

} }


Berikut contoh penerapan kelas GradientPaint lainnya dalam sebuah program Java.

Listing 4.3 SegiPanjangWarnaGradient1.javaimport java.awt.*; import java.awt.event.*; import javax.swing.*; import java.awt.font.*; import java.awt.geom.*;

public class SegiPanjangWarnaGradient1 extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Outline Gradien"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new SegiPanjangWarnaGradient1(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true);

39

} public void init() { JPanel panel = new Panel2D(); getContentPane().add(panel); } } class Panel2D extends JPanel{ public Panel2D() { setPreferredSize(new Dimension(500, 400)); setBackground(Color.white); } public void paintComponent(Graphics g) { super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; //gambar persegipanjang. Rectangle2D.Double persegipanjang2 = new Rectangle2D.Double(100,200, 200,50); //membuat warna gradien asiklis (acyclic). GradientPaint warnaGradien2 = new GradientPaint(125,100,Color.blue, 175,100,Color.darkGray,false); g2.setStroke(new BasicStroke(10.0f)); g2.setPaint(warnaGradien2); g2.draw(persegipanjang2); } }


Tugas Projek

40

Tahap III Lengkapilah program yang sudah Anda buat sebelumnya dengan menu yang digunakan untuk pengaturan warna garis pada objek geometri yang terpilih untuk ditampilkan. Lihat screenshot berikut:

Gambar 3.1 Menu (objek) persegipanjang, (tipe garis) tebal, gradien (warna) terpilih

Gambar 3.1 Menu (objek) lingkaran, (tipe garis) tebal, solid (warna) terpilih

Keterangan:

41

1. 2.

Tampilan di atas hanya merupakan contoh saja. Dalam tahap III (ketiga) program ditambah kemampuan untuk pewarnaan yang digunakan untuk

menampilkan objek geometri saja. 3. Silahkan membuat program menurut kreativitas masing-masing, misalnya: Ditambah menu pilihan warna menggunakan radioButton. Ditambah TextField yang digunakan untuk menentukan ketebalan garis. Dll 1. Penambahan menu warna diharapkan dapat diselesaikan dalam satu minggu, supaya tidak terbebani pada untuk menentukan warna (merah, kuning, hijau, dll)

tahapan projek berikutnya.

BAB 5 TEKS DAN FONTDalam grafika komputer, teks manggambarkan tipe khusus dari objek geometri. Serangkaian teks secara terpadu digambarkan dengan sederet karakter dengan pola pengkodean standar, seperti ASCII dan Unicode. Penggambaran bentuk yang sebenarnya dari karakter ditentukan oleh font standar. Geometri yang menggambarkan bentuk karakter ini dikenal sebagai glyph. Font merupakan kumpulan dari glyph untuk seluruh abjad. Java 2D menawarkan kumpulan font dan fitur manipulasi yang banyak. Yang paling tinggi tingkat penggunaannya adalah pembuatan objek Font dan memanggil metode setFont dan drawString dalam Graphics2D. Objek font dapat dibuat dengan konstruktor berikut:

Font(String name, int style, int size)

Nama parameter menentukan nama font atau nama font yang logis. Sebuah font diidentifikasi dengan nama font (juga disebut dengan nama font), seperti "Times New Roman." Font yang tersedia di lingkungan tergantung pada platform. Java juga mendukung font logis untuk meningkatkan portabilitas. Sebuah font logis dipetakan ke font fisik pada sistem tertentu. Misalnya, font logis "SansSerif" dipetakan ke "Arial" di sistem Windows. Lima keluarga font logis yang selalu didukung di Jawa.

42

Serif SanSerif Monospaced Dialog DialogInput

Parameter style adalah digunakan untuk memilih bentuk font. Tiga bit didefinisikan dalam huruf, dan mereka dapat dikombinasikan dengan bitwise ATAU "|" operator:

PLAIN ITALIC BOLD

Parameter ukuran digunakan untuk menentukan poin ukuran font. Objek Font dapat dipilih dalam objek Graphics2D dengan method:

void setFont(Font font)

Font akan menyebabkan efek panggilan subsequent ke method selanjutnya untuk membentuk teks: Void drawString(String s, int x, int y) void drawString(String s, float x, float y)

Selain menerapkan font yang ada di sistem, juga memungkinkan untuk mendapatkan font baru dari font yang sudah ada dengan memodifikasi atribut tertentu. Berikut metode di kelas Font untuk menghasilkan font turunan:

Font deriveFont(int style) Font deriveFont(float size) Font deriveFont(int style, float size) Font deriveFont(AffineTransform tx) Font deriveFont(int style, AffineTransform tx) Font deriveFont(Map attributes)

Listing berikut mendemonstrasikan fitur-fitur font:

Listing 5.1 FontFun1.java import java.awt.*;

43

import javax.swing.*; import java.awt.geom.*; import java.awt.font.*; public class FontFun1 extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Fonts"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new FontFun1(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); }

public void init() { JPanel panel = new FontPanel(); getContentPane().add(panel); } }

class FontPanel extends JPanel { public FontPanel() { setPreferredSize(new Dimension(640, 480)); setBackground(Color.white); }

public void paintComponent(Graphics g) { super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; //menentukan nama, bentuk, dan ukuran font Font font = new Font("Serif", Font.BOLD, 75); //transformasi affine AffineTransform tx = new AffineTransform(); tx.shear(0.5, 0); //font turunan hasil modifikasi dengan //transformasi affine

44

g2.setFont(font.deriveFont(tx)); g2.drawString("UIN Malang", 50, 125); } } Latihan: Ketiklah kode program diatas. Kemudian tersebut? Jelaskan! Jawab: ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________ compile dan jalankan. Apa yang dihasilkan oleh program

Java 2D juga menyediakan fungsi-fungsi lanjutan yang berhubungan dengan operasi font. Secara khusus, glyphs karakter dalam font dapat diambil sebagai objek Shape.

GlyphVector createGlyphVector (FontRenderContext frc, String str) FontRenderContext obyek yang mendefinisikan ukuran tertentu yang diperlukan untuk merender font. Hal tersebut dapat diperoleh dari objek shape Graphics2D oleh memanggil metode getFontRender-Context. Setelah objek GlyphVector dibuat, maka obyek Shape sesuai dengan glyphs dapat diperoleh dengan metode GlyphVector berikut:

Shape getOutline () Shape getOutline (float x, float y)

Parameneter x and y menentukan lokasi untuk rendering yang glyphs. Listing berikut mendemonstrasikan teknik glyph

Listing 5.2 FontFun2.java import java.awt.*; import javax.swing.*; import java.awt.geom.*; import java.awt.font.*;

public class FontFun2 extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame();

45

frame.setTitle("Fonts"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new FontFun2(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); }


class FontPanel extends JPanel { public FontPanel() { setPreferredSize(new Dimension(640, 480)); setBackground(Color.white); }

public void paintComponent(Graphics g) { super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; Font font = new Font("Serif", Font.BOLD, 75);

FontRenderContext frc = g2.getFontRenderContext(); GlyphVector gv = font.createGlyphVector(frc, "UIN Malang"); Shape glyph = gv.getOutline(100,100); g2.setStroke(new BasicStroke(3.0f)); g2.rotate(Math.toRadians(45), 100, 100); g2.draw(glyph); g2.setColor(Color.blue); g2.fill(glyph);

} }

46


Listing berikut mendemonstrasikan teknik menampilkan string menggunakan dengan menggunakan modifikasi warna pada stroke (outline) dan pewarnaan pada area srting (huruf) yang ditampilkan: Listing 5.3 FontFun3.java import java.awt.*; import javax.swing.*; import java.awt.geom.*; import java.awt.font.*;

public class FontFun3 extends JApplet { public static void main(String s[]) { JFrame frame = new JFrame(); frame.setTitle("Fonts"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JApplet applet = new FontFun3(); applet.init(); frame.getContentPane().add(applet); frame.pack(); frame.setVisible(true); }


class FontPanel extends JPanel {

47

public FontPanel() { setPreferredSize(new Dimension(640, 480)); setBackground(Color.white); }

public void paintComponent(Graphics g) { super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; //menentukan nama, tipe, ukuran Font font = new Font("Serif", Font.BOLD, 75);

//String yang ditampilkan FontRenderContext frc = g2.getFontRenderContext(); GlyphVector gv = font.createGlyphVector (frc, "UIN Malang"); Shape text = gv.getOutline(100,100); //men-set ketebalan garis outline g2.setStroke(new BasicStroke(5.0f)); //men-set warna garis outline g2.setColor(Color.RED); //putar sebesar 45 derajat g2.rotate(Math.toRadians(45), 100, 100); //menampilkan string g2.draw(text); //menset warna gradien

GradientPaint warnaGradien2 = new GradientPaint (125,100,Color.blue,400,100,Color.green,false); //menset warna dengan warna gradien g2.setPaint(warnaGradien2); //g2.setColor(Color.GREEN); //mengisi string dengan warna gradien g2.fill(text); } } Latihan: Ketiklah kode program diatas. Kemudian compile dan jalankan. Apa yang dihasilkan oleh program

48

tersebut? Jelaskan! Jawab: ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________ ____________________________________________________________________________________

Tugas Projek Tahap IV Lengkapilah program yang sudah Anda buat sebelumnya dengan menu yang digunakan untuk menampilkan text. Lihat screenshot berikut:

49

Gambar 3.1 Menu (objek) teks, (tipe garis) tipis, gradien (warna) terpilih

Keterangan: 1. 2. Tampilan di atas hanya merupakan contoh saja. Silahkan membuat program menurut kreativitas masing-masing, misalnya: Ditambah menu pilihan warna menggunakan radioButton. Ditambah TextField yang digunakan untuk menentukan ketebalan garis. Dll 1. Penambahan menu warna diharapkan dapat diselesaikan dalam satu minggu, supaya tidak terbebani pada untuk menentukan warna (merah, kuning, hijau, dll)

tahapan projek berikutnya.

BAB 6

ThreadSebuah thread merupakan sebuah pengontrol aliran program.Cara termudah untuk membuat thread 50

adalah membuat kelas turunan dari java.lang.Thread , yang memiliki semua metode untuk membuat dan menjalankan thread. Metode paling penting adalah run(), yang bisa kita beban-lebihkan untuk melakukan tugas yang kita butuhkan. Atau dengan kata lain run() adalah metode yang akan dijalankan bersamaan dengan thread lain. State dari Thread Sebuah thread memungkinkan untuk memiliki beberapa state: 1. Running Sebuah thread yang pada saat ini sedang dieksekusi dan didalam control dari CPU. 2. Ready to run Thread yang sudah siap untuk dieksekusi, tetapi masih belum ada kesempatan untuk melakukannya. 3. Resumed Setelah sebelumnya di block atau diberhentikan sementara, state ini kemudian siap untuk dijalankan. 4. Suspended Sebuah thread yang berhenti sementara, dan kemudian memperbolehkan CPU untuk menjalankan thread lain bekerja. 5. Blocked Sebuah thread yang di-block merupakan sebuah thread yang tidak mampu berjalan, karena ia akan menunggu sebuah resource tersedia atau sebuah event terjadi.

Prioritas Untuk menentukan thread mana yang akan menerima control dari CPU dan akan 51

dieksekusi pertama kali, setiap thread akan diberikan sebuah prioritas. Sebuah prioritas adalah sebuah nilai integer dari angka 1 sampai dengan 10, dimana semakin tinggi prioritas dari sebuah thread, berarti semakin besar kesempatan dari thread tersebut untuk dieksekusi terlebih dahulu. Sebagai contoh, asumsikan bahwa ada dua buah thread yang berjalan bersama-sama. Thread pertama akan diberikan prioritas nomor 5, sedangkan thread yang kedua memiliki prioritas 10. Anggaplah bahwa thread pertama telah berjalan pada saat thread kedua dijalankan. Thread kedua akan menerima control dari CPU dan akan dieksekusi pada saat thread kedua tersebut memiliki prioritas yang lebih tinggi dibandingkan thread yang pada saat itu tengah berjalan.

Class Thread Constructor Thread memiliki delapan constructor. Marilah kita lihat bersama beberapa constructor:

Constants 52

Class Thread juga menyediakan beberapa constants sebagai nilai prioritas. Seperti tabel berikut ini :

Methods Method- method inilah yang disediakan dalam class Thread.:

53

Contoh dari sebuah counter yang sederhana. import javax.swing.*; import java.awt.*; class CountDownGUI extends JFrame { JLabel label; CountDownGUI(String title) { super(title); label = new JLabel("Start count!"); setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); getContentPane().add(new Panel(), BorderLayout.WEST); getContentPane().add(label); setSize(300,300); setVisible(true); } void startCount() { try { for (int i = 10; i > 0; i--) { Thread.sleep(1000); label.setText(i + ""); } Thread.sleep(1000); 54

label.setText("Count down complete."); Thread.sleep(1000); } catch (InterruptedException ie) { } label.setText(Thread.currentThread().toString()); } public static void main(String args[]) { CountDownGUI cdg = new CountDownGUI("Count down GUI"); cdg.startCount(); } }

55

BAB 7 MEMBUAT OBJEK 3D1. Java 3D Java 3D API adalah sebuah hirarki class yang menyediakan interface untuk sistem render grafis dan suara tiga dimensi yang kompleks. Sehingga dengan demikian programmer dapat bekerja pada konstruk level tinggi tanpa perlu mengetahui bagaimana proses berjalannya. API ini menyediakan lebih dari 100 class yang akan diproses sedemikian rupa oleh engine 3D tersebut. Karena merupakan library eksternal, Java 3D API tidak tersedia secara default dalam JDK standart edition. Bahkan saat ini Java 3D sudah menjadi project komunitas open source. Dapat didownload di website resmi project-nya, https://java3d.dev.java.net Di dalam grafika komputer, 3D merupakan bentuk grafik yang menggunakan representasi data geometri tiga dimensi. Sebagaimana definisi grafika komputer, grafik 3D ini tersimpan di dalam komputer untuk keperluan kalkulasi dan rendering gambar 2D. Berbeda dengan dukungan grafik 2D yang sudah builtin, dukungan Java terhadap grafik 3D diletakkan ke dalam API terpisah, yakni Java3D. Java3D merupakan API 3D berbasis scene graph di platform Java, di mana scene graph merupakan sebuah pohon yang berisi hierarki data scene. Di dalam API Java3D didefinisikan sejumlah kelas dan interface yang menyediakan beragam operasi grafik 3D. Konsep scene graph merupakan inti dari Java3D. Sebuah scene graph merupakan grafik yang merepresentasikan geometri, material, dan pencahayaan. Scene graph dimulai dari root dengan sebuah VirtualUniverse dan mencakup transformasi serta geometri untuk mendefinisikan objek di dunia maya. Secara garis besar, ada tiga tahap fundamental yang diperlukan untuk menghasilkan objek 3D. Menciptakan objek Canvas3D Menciptakan sebuah scene graph Menghubungkan objek Canvas3D ke objek BranchGroup yang menunjuk root dari scene graph. 2. Membuat Objek 3D dengan Java Install terlebih dahulu Java3D API pada komputer Buat projek dalam netbeans Import library j3dcore.jar, j3dutils.jar, vecmath.jar yang berada pada cd:\c\Program Files\Java\jre6\lib\ext

Buat kelas HelloJava3D_a.java dan ketikkan source code berikut ini

56

Setelah di run, tampak objek kubus dari arah depan sehingga nampak seperti gamabar 2D. Agar gambar maka pada method BranchGroup diubah seperti berikut ini:

57

Untuk lebih jelasnya maka buat kelas baru dengan nama HelloJava3D_b.java dan ketikkan source code berikut ini:

Gambar kiri HelloJava3D_a; kanan HelloJava3D_b3. Transformasi Objek 3D (rotasi) Sekarang coba buatlah kelas HelloJava3D_c.java, secara umum source codenya sama dengan kelas sebelumnya, hanya ubah bagian method BranchGroup dengan source berikut ini:

58

Tampak pada source diatas terdapat pemanggilan kelas TransformGroup, kelas tersebut digunakan untuk menginisialisasi objek yang akan ditransformasikan dan kemudian ditambahkan sebagai subgraph dari objRoot. Kemudian rotasi dilakukan dengan pemanggilan kelas RotationInterpolator. Jalankan dan lihat bagaimana hasilnya. Untuk hasil yang berbeda, coba buat kelas lagi yang serupa dan beri nama HelloJava3D_d.java. Pada method BranchGroup ketikkan source code berikut ini:

59

Jalankan dan lihat pula bagaimana hasilnya.

TUGAS:Buatlah sebuah objek 3D yang dapat ditransformasikan (rotasi) melalui control mouse.

60

modul grafkom 2012

Documents