Lingkaran - drawOval - fillOval

Assalamu'alaikum

Guys, kali ini saya akan melanjutkan tentang grafik dasar.  Akan dibahas tentang drawOval.

g.drawOval(x, y, dx, dy);

Gambar 1. Lingkaran

Lingkaran adalah sebuah gambar dengan titik pusat pada lokasi tertentu dan titik lainnya yang mengelilingi lingkaran dengan jarak yang sama dari titik pusat (jari-jari).  Kalau dibuat dalam bentuk gambar dapat diilustrasikan pada gambar 1.

Sedangkan untuk oval atau elips, jari-jari rx tidak sama dengan jari-jari ry, sehingga dapat diilustrasikan seperti pad gambar 2.

Gambar 2. Oval atau Elips

Pada komputer grafik dengan java, maka sebagai acuannya adalah bukan titik pusat, akan tetapi titik pojok kanan atas dari kotak lingkarannya.  Sebagai ilustrasi dapat dilihat pada gambar 3.

Gambar 3. Oval dan acuan membuatnya

Pada gambar 3. terlihat bahwa pojok kiri atas (lingkaran kuning) menjadi titik sentral untuk membuat oval.  Dimana harus dimasukkan titik koordinat pada perintah g.drawOval(x, y, dx, dy);

Lalu apa arti dari dx, dy ?   

dx adalah panjang garis searah sumbu x (diukur dari titik terjauh pada keliling oval sudut 0 derajat s/d sudut 180) atau disebut sebagai diameter sumbu x.

dy adalah panjang garis searah sumbu y (diukur dari titik terjauh pada keliling oval sudut 90 derajat s/d sudut 270) atau disebut sebagai diameter sumbu y.  

Penjelasan di atas dapat diilustrasikan seperti pada gambar 4.

Gambar 4. dx dan dy

Untuk menunjukkan bagaimana perintah programnya, bisa dilihat sebagai berikut :


package penggunaanawt;
import java.awt.Graphics;
import java.awt.Color;
import javax.swing.JFrame;
import javax.swing.JPanel;
public class Drawoval extends JPanel {
public void paint(Graphics g) {
 {     g.setColor(Color.blue);
        g.drawOval(100, 100, 50, 150);
   }
}
 public static void main(String[] args) {
    JFrame frame = new JFrame();
    frame.getContentPane().add(new Drawoval());
    frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    frame.setSize(500,500);
    frame.setVisible(true);
  }}

Gambar 6. Output running program dr listing di atas

Dari listing program di atas, dapat dijelaskan bahwa perintah g.drawOval(100, 100, 50, 150); menunjukkan bahwa oval akan dimulai pada pojok kiri atas (100,100) dengan diameter searah sumbu x = 50 dan diameter searah sumbu y = 150.  

Gambar hasil running programnya pasti akan oval lonjong ke arah bawah, karena diameter searah sumbu y lebih panjang daripada diameter searah sumbu x.

Hasilnya dapat dilihat pada gambar 6.

Jadi tingkat kelonjongannya ke arah mana itu sangat bergantung dengan dx dan dy.  Kalau nilai dx lebih besar  daripada dy, maka oval akan lonjong ke kanan (mendatar), tetapi kalu dy lebih panjang dari pada dx nya, maka oval akan memanjang ke bawah.

Perintah terakhir kali ini adalah 

g.fillOval(x, y, dx, dy);

Dimana perintah tersebut akan membentuk oval atau elips dengan arsiran didalamnya (bukan hanya frame atau rangka saja).

Sedangkan aturan yang dipakai sama persis dengan aturan pada g.drawOval(x, y, dx, dy); cuma berbeda efeknya. sebagai ilustrasi dapat dilihat pada gambar 7 perbedaan dari  kedua perintah tersebut.

Gambar 7. Perbedaan drawOval dan fillOval

Pada gambar 7 tersebut terlihat perbedaan pada arsirannya, pada perintah g.drawOval(100,100,150,50); diperoleh oval yang di bagian atas dengan tidak ada arsirannya, sedangkan perintah g.fillOval(100,160,150,50); diperoleh oval yang dibagian bawah (warna hijau),dimana terdapat arsirannya penuh warna hijau.

Sehingga dengan perintah itu semua saudara bisa membuat gambar muka dengan raut muka yang berbeda-beda ekspresinya.  Misalnya coba buatlah program untuk tampilan seperti pada gambar 8.

Gambar 8. Untuk latihan

Sekian ya....udah capek, udah lapar, udah ngantuk....udah....udah..... ya udahlah.....

Wassalamu'alaikum.