Toplam Makale Sayısı : 268, Toplam Görsel Anlatım Sayısı : 111 (06.09.2010)
Skip Navigation Links.
Microsoft Most Valuable Professional
Bölüm 22 : Java ile Grafik Çizim 06.08.2004

Geçtiğimiz hafta boyunca, Java dili ile fazla ilgilenemedim. Nitekim vaktimin büyük çoğunluğunu Whidbey' i incelemekle geçirmiştim. Aslında yazın bu sıcak dönemlerinde, beni şöyle rahatalacak, fazla terleymeyecek çalışmalar yapmak istiyordum. Whidbey beni bir nebze olsa rahatlatsada, klimanın verdiği ferahlığı sağlayamamıştı. Bana biraz eğlenceli ve eğlenceli olduğu kadarda işe yarayacak bir konu gerekiyordu. Sonunda, Java programlama dili ile, grafiksel çizimlerin nasıl yapıldığını araştırmaya karar verdim. Zor olmayan, sıkıcı olmayan hatta zaman zaman işe yarar bir şekil oluşturabilmek için eski matematik bilgilerimi hatırlamama yol açan bu konu benim için yeteri kadar eğlenceli ve güzeldi.

Elbette, bir programlama dili ne kadar güçlü olursa olsun, sağladığı grafiksel kütüphanalerin kabiliyetleri, sıradan bir tasarım programının yerini tutamazdı. Ancak insan durup düşündüğünde, bu tip grafik programlarının oluşturulmasında java, C# gibi dillerin kullanılabileceğini kolaylıkla anlayabilir. Sonuç olarak, bir grafik programında mouse ile, toolbar' dan seçtiğimiz bir şekli kolayca oluşturabiliriz. Mouse ile sürükleme bir olaydır. Seçilen şekle göre ekranda bir vektör grafiğin oluşmasıda, dilin sağladığı grafik kütüphaneler ile mümkün olabilir. Olayı dahada sofistike düşündüğümde, C# ile veya Java ile yazılmış, haritacılık, şehir planlama gibi programların olduğunu da biliyordum. Hatta böyle bir programı iş başındaykenden inceleme fırsatı bulmuştum.

Sonuçta, eğlenceli olan grafik nesneleri aslında büyük çaplı projelerdede temel yapı taşları olarak rol alabilirlerdi. Kendimi bu düşünceler eşliğinde gaza getirdikten sonra, şöyle ağız tadıyla web sayfasına bir çizik atayım dedim. Yapacağım işlemler son derece kolaydı. Bir applet tasarlayacak ve bu sayede bir web sayfasına, çeşitli grafik metodları yardımıyla vektör şekiller çizebilecektim. Bunun için aşağıdaki gibi bir java kaynak kod dosyasını oluşturdum.

import java.awt.*;
import java.applet.Applet;

public class Grafikler extends Applet
{
    public void paint(Graphics g)
    {
        g.setColor(Color.BLUE);
        g.drawLine(0,0,100,100);
    }
}

Ekrana bir çizgi çizmek için, Applet' in paint metodunu kullandım. Burada, çizgiyi Graphics sınıfının, drawLine metodu ile oluşturdum. Metod 4 parametre alıyordu. İlk ikisi x ve y koordinatlarını, son ikisi ise, çizginin bittiği yerin x ve y koordinatlarını vermekteydi. Ayrıca, çizgiyi mavi renkte boyamak istediğimden, Graphics nesnesine setColor metodu ile Color numaralandırıcısından BLUE değerini atadım. Sonuç aşağıdaki gibiydi.

 

Elbette Graphics sınıfından çizebileceğim şekiller sadece basit bir çizgiden ibaret olamazdı. Daha pek çok şekil vardı. İçi dolu olanlar veya içi boş olanlar gibi. O halde yapmam gereken ortadaydı. Çizebileceğim her şekli deneyecektim ve sonuçlarını görecektim. Bu aynı zamanda benim için bir rehber olacaktı. Çizim kodu ve altında şeklin görüntüsü. Hemen parmakları sıvadım ve klavyemin tuşlarını aşındırmaya başladım. Öncelikle temel şekillerle işe başlama taraftarıydım. Yani dörtgenlerden.

import java.awt.*;
import java.applet.Applet;

public class Grafikler extends Applet
{
    public void paint(Graphics g)
    {
        g.setColor(Color.BLUE);
        g.setFont(new Font("Verdana",Font.BOLD,12));
        g.drawString("ICI BOS DORTGEN",0,165);
        g.drawRect(10,10,100,140);
    }
}

drawRect metodu 4 parametre almaktaydı. İlk ikisi, dörtgenin yerleştirileceği X ve Y koordinatlarını belirtirken, sonraki iki parametrede genişlik ve yüksekliği belirtmekteydi. Bir dörtgenin içinin dolu olmasını veya kenarlarının yuvarlatılmış olmasını isteyebilirdik. Bunun içinde değişik metodlar vardı. Örneğin fill ile başlayan metodlar içi dolu şekiller oluştururken, draw ile başlayanlar içi boş şekiller oluşturmaktaydı. Hemen, diğer olası dörtgen şekillerinide çizmeye çalıştım ve aşağıdaki örnek kodları oluşturdum.

g.fillRect(10,10,100,140);

g.fillRoundRect(10,10,100,100,16,16);

g.drawRoundRect(10,10,100,100,64,128);

Round tipteki dörtgenlerin kenarları yuvarlatılırken son iki parametre kullanılmakta. Bunlardan ilki, yayın genişliğinin piksel cinsinden değerini belirtirken ikinciside yayın yüksekliğini belirtiyor. Dörtgenlerden sonra sıra yaylara gelmişti. Lisans eğitimim sırasında, yaylarla epeyce haşırneşir olmuştum. Ancak genelde yayları elle kağıtlara çizmek yerine, yaylar ile ilgili teoremlerin ispatlarının yapılması ile uğraşmıştım. Sırf bu nedenle, ilk ve orta okulda çok iyi olan resim çizme kabiliyetimin yok olduğunu söyleyebilirim. Nitekim, artık şekil çizmeye çalıştığımda o şekle matematiksel bir gözle bakıyor ve olabilecek çeşitli ispatları ve teoremleri hatırlıyorum. Neyse, konuyu ve kafayı fazla bulandırmadan yay çizme işlemine girişsek hiç fena olmaz sanırım.

g.drawArc(10,10,150,150,45,180);

g.fillArc(10,10,150,150,45,45);

Yayların çizimindeki en önemli nokta son iki parametreydi. Bu parametrelerden ilki, başlangıç açısını derece cinsinden belirtirken, ikinci parametre yayın oluşturacağı açıyı derece cinsinden belirtmekteydi. Tabiki, içi dolu yay aslında bir daire diliminden başka bir şey olmamaktaydı. Ancak daireleri çizmek içinde başka metodlar vardı. Daireler oval şekillerin çizildiği fillOval yada drawOval metodları ile elde edilebilirdi. Daire olması için, genişlik ve yükseklik değerlerinin eşit olması yeterliydi. Bu şekilleride aşağıdaki kod satırları ile test ettim.

g.setColor(Color.BLACK);
g.setFont(new Font("Verdana",Font.BOLD,12));
g.drawString("YAYLAR...",0,165);
g.fillOval(70,100,80,18);
g.drawOval(30,30,75,75);

Sırada daha komplike bir şekil olan poligonlar vardı. Bir poligon çizebilmek için, drawPolygon yada fillPolygon metodlarından birisini kullanabilirdim. Aralarındaki tek fark birisinin içinin dolu ötekisinin ise boş oluşuydu. Hangileri tahmin edin bakalım :) Elbette bir poligon oluşturabilmek için bir takım verilere ihtiyacım vardı. Herşeyden önce poligonların köşe sayıları belli değildi. Dolayısıyla bu köşelerin x ve y koordinatlarını belirleyecek iki integer diziye ihtiyacım olacaktı. Bu dizilerden birisi, x koordinatlarını diğeri ise y koordinatlarını taşımalıydı. İşte bu anda, kalem kağıda sarıldım ve acaba bir kum saatinin sembolik resmini çizebilir miyim diye düşünmeye başladım. Oturup ciddi ciddi, kağıt üzerinde, bir kum saatinin iki boyutlu görüntüsüne ait köşe koordinatlarını, ekranın ordinat sistemine göre çıkarmaya çalıştım. İşte kağıttaki çalışmamım güzelim Fireworks grafik programı ile şematize edilişi.

Sonuç olarak aşağıdaki kodlar bana izleyen şekli verdi. Ehhh işte. Biraz da olsa kum saatini andırıyor.

int xKoordinatlari[]={50,200,150,200,50,100};
int yKoordinatlari[]={50,50,150,250,250,150};

g.fillPolygon(xKoordinatlari,yKoordinatlari,6);

Artık tüm şekilleri öğrendiğime göre, bunları harmanlayıp beni daha çok neşelendirecek bir uygulama yazabilirdim. Örneğin, hepimizin kağıda çizmekte hiç zorlanmayacağı, hatta patatesler ve bir kaç kibrit çöpü ile birlikte yapabileceği bir çöp adamı, Java' daki grafik metodlarını kullanarak çizmek ne kadar zor olabilirdi ki? Doğruyu söylemek gerekirse o basit çöp adamı oluşturabilmek için bir süre çalışmam gerekti. Kağıt üzerinde matematiksel olarak koordinatların belirlenmesi, hangi şeklin nereye geleceği derken saat sabahın üçü oluvermişti bile. Ancak bir kaç dakikalık bu eziyet sonrasında aşağıdaki program kodları sayesinde oldukça ilginç bir eser ortaya çıkartabilmiştim. Belki Da Vinci kadar iyi değildi. Ancak yinede modern sanatın bir görüntüsüydü.

import java.awt.*;
import java.applet.Applet;

public class Grafikler extends Applet
{
    public void paint(Graphics g)
    {
        g.setColor(Color.RED);
        g.setFont(new Font("Verdana",Font.BOLD,12));
        g.drawArc(20,10,20,20,45,75);
        g.drawArc(50,10,20,20,45,75);

        g.setColor(Color.blue);
        g.drawLine(20,1,20,6);
        g.drawLine(25,1,25,7);
        g.drawLine(30,1,30,7);
        g.drawLine(35,1,35,8);
        g.drawLine(40,1,40,8);
        g.drawLine(45,1,45,9);
        g.drawLine(50,1,50,8);
        g.drawLine(55,1,55,8);
        g.drawLine(60,1,60,7);
        g.drawLine(65,1,65,7);
        g.drawLine(70,1,70,6);

        g.fillOval(25,18,9,9);
        g.fillOval(55,18,9,9);

        g.setColor(Color.BLACK);
        g.drawArc(37,30,15,45,130,60);

        g.setColor(Color.orange);
        g.drawArc(10,20,50,50,-120,90);
   
        g.setColor(Color.black);
        g.fillOval(35,80,15,80);

        g.setColor(Color.MAGENTA);
        g.fillRoundRect(1,80,20,100,10,10);
        g.drawRoundRect(20,80,50,125,10,10);
        g.fillRoundRect(70,80,20,100,10,10);
        g.fillRoundRect(25,205,18,100,10,10);
        g.fillRoundRect(45,205,18,100,10,10);
    }
}

Şimdi gelde, şu grafik programlarını, harita programlarını nasıl yazıyorlar düşün. Düşünmeden edemedim. Allah bu tip grafik tabanlı yazılımları Java veya C# gibi nesne yönelimli diller ile geliştirilenlere sabır versin. Bende bir kaç have finacanı ile ancak yukarıdaki kadar garip bir adam elde edebildim.

Burak Selim ŞENYURT

selim@bsenyurt.com

Tasarlayan : Tasarım Fukarası Burak Selim Şenyurt (2008)