MODUL PRAKTIKUM PEMROGRAMAN BERORIENTASI OBJEK

Praktikum 4 Grafis, Applet

MODUL PRAKTIKUM PEMROGRAMAN BERORIENTASI OBJEK Deskripsi Singkat Praktikum pemrograman berorientasi objek adalah praktikum yang menggunakan bahasa Java sebagai bantuan dalam memahami konsep pemrograman berorientasi objek. Materi praktikum berisi teori, latihan dan soal pemrograman.

Tujuan 1. Memahami konsep Grafis dan Applet. 2. Membuat aplikasi sederhana dengan menggunakan konsep Grafis. 3. Membuat aplikasi sederhana dengan menggunakan konsep Applet.

Prasyarat Siswa telah mendapat pelajaran mata kuliah Algoritma dan Pemrograman.

Materi 1 : Grafis Pemrograman grafis digunakan dalam banyak hal mulai dari upaya untuk memperoleh tampilan yang indah, aplikasi animasi, aplikasi simulasi, aplikasi pengolahan citra sampai visi komputer. Berikut ini adalah beberapa pemrograman dasar di bidang grafis dalam java yang diharapkan dapat menjadi bekal awal untuk memahami berbagai topik seputar grafis yang begitu luas. Pembahasan pemograman grafis akan dimulai dari menggambar obyek-obyek sederhana menggunakan garis, menggambar bentuk 2 dimensi dan bagaimana dapat menampilkan dan mengolah data gambar (image processing) dengan pembahasan yang sangat sederhana. Bahasa Java merupakan salah satu bahasa dengan fasilitas berupa komponen-komponen grafis yang lengkap. Karena itulah banyak program grafik, dan permainan yang berbasis grafik dibuat menggunakan bahasa Java, khususnya untuk permainan di perangkat-perangkat mobile. Salah satu cara untuk membuat aplikasi grafis dengan java adalah dengan membuat class yang merupakan turunan dari class Canvas. Dalam class inilah kita meletakkan gambar atau animasi, dan membentuk sebuah obyek untuk mengakses gambar kita tersebut. Beberapa method yang sering digunakan dalam aplikasi grafis yaitu:

Viska Mutiawani, MSc Jurusan Informatika Universitas Syiah Kuala




drawstring(String str, int x, int y) --> membuat sebuah text menggunakan font dan color standar pada posisi koodinat x dan y.



drawLine(int x1, int y1, int x2, int y2) --> membuat sebuah garis dari titik x1,y1 ke titik x2,y2.



drawRect(int x, int y, int width, int height) --> membuat sebuah kotak dengan titik kiri atas pada(x,y) dan mempunyai ukuran tertentu.



drawOval(int x, int y, int width, int height) --> membuat sebuah oval dengan ukuran tertentu.



drawRoundRect(int x, int y, int width, int height, int xdiam, int ydiam) --> membuat kotak dengan sudut yang tidak tegak lurus.



draw3DRect(int x, int y, int width, int height, boolean raised) --> membuat kotak dengan efek 3 dimensi (sebaiknya warna gambar disesuaikan dengan warna background).



drawArc(int x, int y, int width, int height, int startAngle, int arcAngle) --> membuat sebuah lingkaran yang tidak penuh.



fillRect(int x, int y, int width, int height ) --> membuat kotak yang dalamnya berwarna.



fillOval(int x, int y, int width, int height) --> membuat oval yang mempunyai warna.



fillRoundRect(int x, int y, int width, int height, int xdiam, int ydiam) --> membuat kotak yang berwarna.



fill3DRect(int x, int y, int width, int height, Boolean raised)



fillArc(int x, int y, int width, int height, int startAngle, int arcAngle)

Kelas yang berkait erat dengan grafis adalah kelas Color.

Materi 2 : Applet Sebuah applet adalah tipe yang spesial dari program java yang dieksekusi melalui internet. Secara khusus berjalan pada suatu web browser seperti Firefox, Internet Explorer, Google Chrome dan Opera. Applet ini cukup terbatas jika dibandingkan dengan aplikasi desktop java. Class Applet adalah sebuah subclass dari class Panel yang didefinisikan dalam AWT. Applet adalah aplikasi java yang spesial. Mereka tidak dieksekusi menggunakan perintah java melainkan applet berjalan pada web browser atau menggunakan applet viewer. Untuk membuka applet melalui sebuah Viska Mutiawani, MSc Jurusan Informatika Universitas Syiah Kuala


web browser, secara sederhana buka dokumen HTML dimana applet terintegrasi kedalamnya menggunakan applet HTML tag. Cara lain untuk menjalankan sebuah applet adalah melalui perintah appletviewer. Untuk memudahkan ikuti syntax berikut ini: appletviewer <java filename> Ketika membuat sebuah applet, dibutuhkan suatu extend class Applet. Sebagaimana yang disebutkan sebelumnya, classnya dapat ditemukan dalam paket java.applet. Oleh karena itu, perlu mengimport paket java.applet. Class JApplet adalah bagian dari paket javax.swing yang menyediakan fungsi yang sama seperti Applet. Cara membuatnya juga sama yaitu dengan meng-extends JApplet. Bermakna class tersebut merupakan sub-kelas dari JApplet. Berikut ini adalah beberapa method dalam applet: 

 

 

init() : method yang dipanggil pertama kali dan dipanggil hanya sekali. Init() biasaya berisi instruksi untuk menginisialisasi applet. Bisa dikatakan tingkah laku init() mirip dengan method constructor walaupun init() bukan berguna untuk mencipta objek applet. start() : method ini dipanggil sesudah method init(). stop() : method ini dipanggil ketika web browser menutup dokumen HTML yang berisi applet. Method ini dipanggil untuk menginformasikan kepada applet agar ia menghentikan proses eksekusinya. destroy() : method ini dipanggil sesudah method stop() yang berguna untuk menghapus applet dari memory. paint() : method ini dipanggil setelah init() sesudah startup. Method ini akan dipanggil otomatis setiap saat applet window harus digambar ulang. Applet window perlu digambar ulang jika window diubah ukurannya, ditutupi oleh window lain atau di-minimized. Paint() tidak boleh langsung dipanggil dari program Applet, namun ia dapat dipanggil dengan perintah repaint().

Struktur dari coding Applet dapat dilihat di bawah: import javax.swing.JApplet; import java.awt.Graphics; public class ShellApplet extends JApplet { // declare fields here public void init( ) { // initialize data here } public void paint( Graphics g ) { super.paint( g ); //call to the paint() method of the super class // include graphics code here Viska Mutiawani, MSc Jurusan Informatika Universitas Syiah Kuala


} }

Struktur Applet tag pada file HTML dapat dilihat pada coding di bawah: Applet Shell HTML
Applet Shell

Your browser is ignoring the <APPLET> tag!

Kaitan Applet dengan Graphics Method paint() menggunakan objek Graphics sebagai formal parameter. Oleh karena itu semua method pada Graphics dapat digunakan untuk menggambar pada applet window.

LATIHAN 1 Buka BlueJ. Download projek grafis-praktikum yang terdapat pada website: http://informatika.unsyiah.ac.id/viska/pbo/grafis-praktikum.zip Di dalam projek tersebut terdapat beberapa class yang berkaitan dengan grafis sederhana. Grafis tersebut menggunakan kelas Canvas. Kemudian Canvas tersebut dimasukkan dalam JFrame. Beberapa contoh dalam projek tersebut: 1. Class Kanvas1 merupakan sub-kelas dari Canvas yang memiliki method paint untuk menggambar. Class Kanvas1 kemudian dimasukkan dalam JFrame yang terdapat pada class Gambar1. Tampilan jika Gambar1 dijalankan dengan menciptakan objek Gambar1, seperti di bawah:



Garis lurus warna merah dibuat dengan coding di bawah:

Persegi panjang warna biru dibuat dengan coding di bawah:

Lingkaran merah dibuat dengan coding di bawah:

Tulisan Selamat Belajar dibuat dengan coding di bawah:

2. Class AnimasiFont merupakan sub-kelas dari Canvas sehingga memiliki method paint untuk menggambar. Class AnimasiFont dimasukkan dalam JFrame pada class AnimasiFontFrame. Jika class AnimasiFontFrame dijalankan maka akan mencipta objek AnimasiFont yang menampilkan 25 buah tulisan “Java” pada background warna hitam. Setiap framenya diklik, maka AnimasiFont akan digambar ulang dengan menggunakan repaint, seperti coding di bawah:

Tampilan jika dijalankan:



3. Class berikutnya adalah PaintKanvas yang merupakan aplikasi melukis sederhana. Konsepnya tetap sama yaitu dengan meng-extend class Canvas dan menggunakan method paint untuk menggambar tampilan pada Canvas. Canvas ini dimasukkan dalam JFrame untuk ditampilkan. Contoh tampilannya:

Pelajari kesemua kelas-kelas tersebut, dan coba buat program grafis sederhana lainnya. Viska Mutiawani, MSc Jurusan Informatika Universitas Syiah Kuala


LATIHAN 2 Buka BlueJ. Download projek grafis-praktikum yang terdapat pada website: http://informatika.unsyiah.ac.id/viska/pbo/ applet-praktikum.zip Di dalam projek tersebut terdapat beberapa class yang menggunakan Applet. Jalankan Applet tersebut dengan klik kanan dan memilih Run Applet. Beberapa contoh dalam projek tersebut: 1. Class Kanvas1Applet merupakan applet sederhana yang diadaptasi dari class Kanvas1 pada projek grafis-praktikum. Tampilannya:

Coba anda ubah kelas AnimasiFont dan PaintKanvas ke dalam bentuk Applet. 2. Class DisplayImageApplet merupakan applet sederhana yang mencontohkan cara menampilkan image pada Applet. Caranya sangat sederhana, hanya dengan loading image dalam method init(): Kemudian menggambarkannya pada method paint():

Coba anda ubah imagenya menjadi image yang lain. 3. Class BallMoveApplet merupakan applet sederhana yang mencontohkan cara membuat animasi ball moving pada Applet. Caranya hanya dengan mengubah posisi x dan y. Pada contoh ini ball berpindah horizontal, maka hanya nilai x yang berubah.



Disini digunakan thread untuk memberikan waktu jeda pada animasi:

Coba anda praktekkan ball moving secara vertikal. Tips: nilai y yang akan berubah. 4. Berikutnya class MoveImageApplet mencontohkan perpindahan image di atas image yang lain dengan menggunakan tanda panah pada keyboard dengan memanfaatkan event KeyPressed pada interface KeyListener. Pelajari codingnya. Anda dapat mencoba bereksperimen jika menggunakan interface MouseListener dan memanfaatkan method mousePressed, mouseReleased dan mouseDragged. Anda dapat melihat contoh MouseListener pada class PaintKanvas dalam projek grafis-praktikum.

SOAL-SOAL 1. Buatlah tampilan animasi image berpindah secara horizontal dengan menggunakan sub-kelas Canvas. Jangan lupa buat frame untuk menampilkan canvas tersebut. 2. Buatlah tampilan GUI lampu lintas seperti gambar di bawah. Gambar tersebut harus mampu melakukan tindakan seperti: jika tombol Hijau diklik maka lampu berwarna hijau akan menyala, jika Viska Mutiawani, MSc Jurusan Informatika Universitas Syiah Kuala


tombol Kuning diklik maka lampu berwarna kuning akan menyala dan jika tombol Merah diklik maka lampu berwarna merah akan menyala. Jika tombol Exit diklik maka window akan tertutup.

3. Ubah class DisplayImageApplet dengan menambahkan satu image lain sebagai image background. Untuk image backgroundnya anda dapat mengambil image background.jpg pada projek appletpraktikum. 4. Ubah class BallMoveApplet sehingga ball akan berpindah seperti meloncat. Tips: nilai x dan y akan berubah secara bersama-sama. Jika ball menaik maka nilai x bertambah dan y berkurang. Jika ball menurun maka nilai x dan y akan bertambah.


MODUL PRAKTIKUM PEMROGRAMAN BERORIENTASI OBJEK

Recommend Documents

Applet Shell