OpenGL ile 3 Boyutlu Çizim ve Döndürme İşlemi

Tem 282007

Bir önceki makalemizde OpenGL ile 2 boyutlu bir çizimi nasıl yapabileceğimizi öğrenmiştik. Şimdide buna benzer şekilde 3 boyutlu bir çizim yapacağız de devamında ise olşan cismi klavyeden alacağımız yönledirmeler doğrultusunda döndürme işlemini gerçekleştireceğiz.

İlk olarak 3 boyutlu cismimizin ne olacağını kararlaştırıp kordinat düzlemindeki noktalarını belirliyoruz. Daha sonra bu noktalar yardımı ile çizimimize başlayacağız. Ben çizimimde bir dörtgen prizması ve bir üçgen pramit kullarak ev profili oluşturmaya çalışacağım. Çizim işlemini gerçekleştiren bölüm :

int DrawGLScene(GLvoid)
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glLoadIdentity();
glBegin(GL_QUADS);                                           // Dörtgen Prizması başlangıcı
glColor3f(1.0f,0.0f,0.0f);

// Ön taraf
glVertex3f(-1.0f, -1.0f, -1.0f);
glVertex3f( 1.0f, -1.0f, -1.0f);
glVertex3f( 1.0f,1.0f, -1.0f);
glVertex3f(-1.0f,1.0f, -1.0f);

// Sol Yan Taraf
glColor3f(1.0f,1.0f,0.0f);
glVertex3f(-1.0f, -1.0f, -1.0f);
glVertex3f( -1.0f, -1.0f, -3.0f);
glVertex3f( -1.0f,1.0f, -3.0f);
glVertex3f(-1.0f,1.0f, -1.0f);

// Taban Taraf
glColor3f(0.0f,1.0f,0.0f);
glVertex3f(-1.0f, -1.0f, -1.0f);
glVertex3f( -1.0f, -1.0f, -3.0f);
glVertex3f( 1.0f,-1.0f, -3.0f);
glVertex3f( 1.0f, -1.0f, -1.0f);

// Sağ Yan Taraf
glColor3f(1.0f,0.0f,1.0f);
glVertex3f(1.0f, -1.0f, -1.0f);
glVertex3f( 1.0f, -1.0f, -3.0f);
glVertex3f( 1.0f,1.0f, -3.0f);
glVertex3f( 1.0f, 1.0f, -1.0f);

// Üst Taraf
glColor3f(0.0f,0.0f,1.0f);
glVertex3f(-1.0f, 1.0f, -1.0f);
glVertex3f( -1.0f, 1.0f, -3.0f);
glVertex3f( 1.0f,1.0f, -3.0f);
glVertex3f( 1.0f, 1.0f, -1.0f);

//Arka Taraf
glColor3f(1.0f,0.0f,0.0f);
glVertex3f(-1.0f, -1.0f, -3.0f);
glVertex3f( 1.0f, -1.0f, -3.0f);
glVertex3f( 1.0f,1.0f, -3.0f);
glVertex3f(-1.0f,1.0f, -3.0f);

//pencere
glColor3f(1.0f,1.0f,0.0f);
glVertex3f(-0.5f, -0.5f, -1.0f);
glVertex3f(-0.5f, 0.5f, -1.0f);
glVertex3f(0.5f, 0.5f, -1.0f);
glVertex3f(0.5f, -0.5f, -1.0f);

glEnd(); // Dörtgen Prizması Çizim Bitimi

glBegin(GL_TRIANGLES); // Üçgen Pramit Çizim Başlangıcı

// Pramit Ön Parça
glColor3f(1.0f,1.0f,0.0f);
glVertex3f( -1.0f, 1.0f, -1.0f);
glVertex3f(1.0f,1.0f, -1.0f);
glVertex3f( 0.0f,3.0f, -2.0f);

// Pramit Sol Parça
glColor3f(0.0f,0.0f,1.0f);
glVertex3f( -1.0f, 1.0f, -1.0f);
glVertex3f(-1.0f,1.0f, -3.0f);
glVertex3f( 0.0f,3.0f, -2.0f);

// Pramit Arka Parça
glColor3f(1.0f,1.0f,0.0f);
glVertex3f( -1.0f, 1.0f, -3.0f);
glVertex3f(1.0f, 1.0f, -3.0f);
glVertex3f( 0.0f,3.0f, -2.0f);

// Pramit Sağ Parça
glColor3f(0.0f,0.0f,1.0f);
glVertex3f( 1.0f, 1.0f, -3.0f);
glVertex3f(1.0f, 1.0f, -1.0f);
glVertex3f( 0.0f,3.0f, -2.0f);
glEnd();                                                                          // Üçgen Pramit Çizim Bitimi

return TRUE;

}

Çizim işlemini gerçekleştirdikten sonra oluşan görünüm ise resimdeki gibi oluyor.

Çizim işlemini tamamladıktan sonra ilk olarak global değişkenler tanımlayalım. Bu değişkenler x ve eksenlerinde ki dönme işlemlerimizdeki hız büyüklüğünü tuatacağımız değişkenler olacak.

GLfloat xspeed;
GLfloat yspeed;
GLfloat z=-5.0f;
GLfloat xrot;
GLfloat yrot;

Değişkenlerimizi de tamamladıktan sonra dönme işlemini gerçekleştirecek satırları DrawGLScene() fonksiyonumuzun içerisine eklemeye. glLoadIdentity(); satırının altına aşağıdaki satırları ekleyelim.

glTranslatef(0.0f,0.0f, -2.0f); // şekli merkeze taşıdık , z eksenin de iki birim ilerlettik
glRotatef(xrot,0.0f,1.0f, 0.0f);
glRotatef(yrot,1.0f,0.0f,0.0f);

glTranslatef(0.0f,0.0f, 2.0f); // şekli z ekesninde 2 birim götürmüştük aynı miktarda geri getirdik

Bu satırlardaki döndürme işlemlerinden önce ve sonra eklemiş olduğumuz glTranslatef fonksiyonlarını şeklimizin merkezini önce 0,0,0 noktasına taşıyıp daha sonra tekrar eski konumuna taşımak için kullandık. glRotatef() fonksiyonları sayesinde de dönme işlmlerini gerçekleştirdik, xrot ve yrot değişlenleri de dönme hızlarını belirliyor. Uygulamalarınızda fonksiyon içerisindeki değişkenleri değiştirip ortaya çıkan sonuçları gözlemleyerek daha iyi bir şekilde kavrayacağınızdan eminim ve bu konuda birde glTranslatef() fonksiyonlarını kaldırarak değişimleri gözlemenizi istiyorum. Şimdide son olarak DrawGLScene() fonksiyonunda return TRUE dan sonra

xrot += xspeed;
yrot += yspeed;

bu iki satırı uygulamamıza ekleyelim. Bunlarıda tamamladıktan sonra bu dönme işlmerini klavyemizden kontrol etmek için şu satırları eklememiz gerekiyor :

if (PeekMessage(&msg,NULL,0,0,PM_REMOVE))
{
….
}
else
{
…..
else
{
SwapBuffers(hDC);
if (keys[VK_UP])
{
yspeed+=0.01f;      // yukarı yöntuşuna basılırsa
}
if (keys[VK_DOWN])
{
yspeed-=0.01f;      //aşağı yöntuşuna basılırsa
}
if (keys[VK_RIGHT])
{
xspeed+=0.01f;     //sağ yöntuşuna basılırsa
}
if (keys[VK_LEFT])
{
xspeed-=0.01f;    //sol yöntuşuna basılırsa

}
…
}
xrot += xspeed; // alınan hız değerleri xrot ve yrot değişkenlerine aktarılıyor

yrot += yspeed;

Bu son değişikliklerden sonra uygulamamızı çalıştırdıktan sonra uygulamamızı çalıştırdıktan sonra elde edeceğimiz görüntü ise şekilde ki olacak.

Üç boyutlu şekil çizme ve bu cismi döndürme işlemlerini en basit hali ile sizlere aktarmaya çalıştım. Eğer cisminizi döndirmek değil hareket ettirmek isterniz glTranslatef() fonksiyonu sayesinde gerçekleştirebilirsiniz. Bu konudaki sorularınızı , görüşlerinizi forumlarımızdan yada e-posta göndererek iletebilirsiniz. Bir sonraki yazıda görüşmek üzere.

Tahir MUTLU

iletisim (at) tahirmtlu.info

OpenGL ile 2 Boyutlu Çizim Yapma

OpenGL No Responses »

Tem 142007

Bu yazımda sizlere 2 boyutlu grafik çiziminden bahsedeceğim. Bu çizimleri
gerçekleştirebilmek için kullanacak olduğum API ise OpwnGL kütüphanesi
olacaktır. Bu yüzden çizim işlemine başlamadan önce OpenGL nedir ne gibi
konularda bize yardımcı olur biraz bahsetmek istiyorum.

OpenGL Nedir ? : OpenGL ( Open Graphics Library ) 2 boyutlu ve 3
boyutlu grafik çizim işlemlerinde kullanabileceğiniz bir kütüphanedir. Bu
kütüphane sayesinde bizler grafik donanımlarını yönetebiliriz. Avantalarına
gelince ise b kütüphane ile gerçekleştirdiğiniz çizimler platform bağımsız
olarak her ortamda çalışabilir yani işletim sisteminden ve işletim sisteminin
bulunduğu donanımdan bağımsızdır. Ayrıca birçok yazılım dili tarafından
kullanabilirsiniz. Birkaç örnek vermek gerekirse C,C++,C#,Java,Fortran gibi.

Yazımda sizlere OpenGL kütüphanesinin hem C++,hemde C# tarafından kullanılışını
aktarıyor olacağım. Fakat performans olarak değerlendirildiğin C++ ile yapılan
uygulamalar daha performanslı olduğu için uygulamalarınızda C++ ‘ kullanmanızı
tavsiye edebilirim.

Bu uygulamamızda kullanacağım bazı komutlardan bahsettikten sonra uygulamamıza
geçebiliriz. Bunlardan ilki glClear() bu
komutu tüm uygulamalarımızda kullanacağız çünkü uygulamamaya başlamadan önce
ekranı ve derinlik tamponunu silmemiz gerekiyor. glLoadIdentity()
bu komut sayesinde o anki model matrisini temizliyoruz. glBegin() sayesinde herhangi bir cizim olayını başlatabiliyoruz
ve glEnd() ile de başladığımız cizim
olayını sonlandırıyoruz. glbegin() içerisinde yapacak olduğumuz çizim şeklini
belirtmemiz gerekiyor. Bunlarda örneğin bir dörtgen için style='color:red'>GL_QUADS,üçgen için GL_TRIANGLES
gibi. Bunun gibi bazı bilinmesi gerekenleri de öğrendikten sonra artık
uygulamalarımıza geçebiliriz.

C# içerisinde OpenGL kütüphanesini kullanabilmek için href="http://csgl.sourceforge.net/">http://csgl.sourceforge.net/ adresinden
csgl dll ini indirmeniz gerekmektedir. Bu dll i
de indirdikten sonra uygulamamıza geçebiliriz. Bir adet boş windows uygulaması
başlatın ve indirmiş olduğumuz dll i ve System.Drawing i referasn olarak
gösterniz. Cizme işlemini ayrı bir class ta yapalım ve bunun içide boş bir
class oluşturun ve adı ciz.cs olsun.
İçeriğinide u şekild dolduralım :

style='border-collapse:collapse;mso-yfti-tbllook:1184;mso-padding-alt:0cm 0cm 0cm 0cm'>

using
System;

using
System.Drawing;

using
CsGL.OpenGL;

using
System.Windows.Forms;

namespace
ciz

{

public class
Ourview : OpenGLControl // sınıfımızı Opengl
kontrolünden türetiyoruz

{

public bool
finished = false;

public Ourview() : base()

{

this.KeyDown += new
KeyEventHandler(Ourview_OnKeyDown);

}

protected void
Ourview_OnKeyDown(object Sender, KeyEventArgs
kea)

{

if(kea.KeyCode== Keys.Escape)

{

Application.Exit();

}

//Köşe noktalarını bir değişkenle ifade ettik çünkü
buradan değişitrerek şeklin ne kadar büyük olacağını belirleyebiliriz.

public override
void glDraw()

{

GL.glClear(GL.GL_COLOR_BUFFER_BIT | GL.GL_DEPTH_BUFFER_BIT); style='color:green'>//Ekranı ve derinliği temizliyoruz

GL.glLoadIdentity(); //O anki model matrisini
sıfırlıyoruz

GL.glTranslatef( 0.0f,0.0f,-8.0f );

GL.glBegin(GL.GL_QUADS); // Dörtgen Çizimini
Başlatıyoruz

GL.glColor3f(0.0f,0.0f,1.0f);// Renk olarak maviyi
seçtik

GL.glVertex2f(1.0f,1.0f);

GL.glVertex2f(1.0f,3.0f);

GL.glVertex2f(3.0f,3.0f);

GL.glVertex2f(3.0f,1.0f);

GL.glEnd(); // Dörtgen Çizimin Sonlandırdık

GL.glBegin(GL.GL_TRIANGLES); // Üçgen Çizimini
başlatıyoruz

GL.glColor3f(1.0f,1.0f,0.0f);//Renk olarak sarıyı seçtik

GL.glVertex2f(-3.0f,1.0f);

GL.glVertex2f(-2.0f,3.0f);

GL.glVertex2f(-1.0f,1.0f);

GL.glEnd(); // Üçgen Çizimini Sonlandırdık

}

protected override
void InitGLContext()

{

GL.glShadeModel(GL.GL_SMOOTH);

GL.glClearColor(1.0f, 1.0f, 1.0f, 0.5f);

GL.glClearDepth(1.0f);

GL.glEnable(GL.GL_DEPTH_TEST);

GL.glDepthFunc(GL.GL_LEQUAL);

GL.glHint(GL.GL_PERSPECTIVE_CORRECTION_HINT, GL.GL_NICEST);

}

protected override
void OnSizeChanged(EventArgs e) style='color:green'>// Ekran boyu değişiminde olacak olanlar

{

base.OnSizeChanged(e);

Size s = Size;

GL.glMatrixMode(GL.GL_PROJECTION);

GL.glLoadIdentity();

GL.gluPerspective(45.0f, (double)s.Width /( style='color:blue'>double) s.Height, 0.1f, 100.0f);

GL.glMatrixMode(GL.GL_MODELVIEW);

GL.glLoadIdentity();

}

Sınıfımızıda tamamladıktan sonra şimdide uygulamamızın içinden bunu çağıralım.
Eğer uygulamanızda using System.Drawing; ekli değilse mutlaka
ekleyiniz. Uygulamamıznı içinide aşağıdaki gibi dolduralım .

style='border-collapse:collapse;mso-yfti-tbllook:1184;mso-padding-alt:0cm 0cm 0cm 0cm'>

public
class Form1 : System.Windows.Forms.Form

{

private ciz.Ourview view;

private System.ComponentModel.Container components
= null;

public Form1()

{

InitializeComponent();

this.view = new
ciz.Ourview(); // Sınıfızdaki view ile
eşleştiriyoruz

this.view.Parent = this;

this.view.Dock = DockStyle.Fill; style='color:green'>// Formu dolduruyoruz

this.Show();

}

protected override
void Dispose( bool
disposing )

{

if( disposing )

{

if (components != null)

{

components.Dispose();

}

base.Dispose( disposing );

}

#region Windows
Form Designer generated code

private void
InitializeComponent()

{

this.AutoScaleBaseSize = style='color:blue'>new System.Drawing.Size(5, 13);

this.ClientSize = new
System.Drawing.Size(552, 454);

this.Name = "Form1";

this.Text = "bilyaz.com C# ile
OpenGL";

}

#endregion

[STAThread]

static void
Main()

{

Form1 form = new Form1(); style='color:green'>// yeni bir form oluşturuyoruz.

while((!form.view.finished) &&
(!form.IsDisposed)) // Sonlandırma yoksa devam et

{

form.view.glDraw(); // Çizimi gerçekleştiriyoruz

form.Refresh();//Formu tazele

Application.DoEvents();

}

form.Dispose();

}

Uygulamamızı çalıştırdıktan sonra elde edeceğimiz görüntü ise resimdeki gibi
olmalı.

style='mso-no-proof:yes'> src="http://www.bilyaz.com/images/makale/1184414290-csharp_2bcizim.JPG"
alt="http://www.bilyaz.com/images/makale/1184414290-csharp_2bcizim.JPG">

C++ ile Aynı uygulamayı nasıl programladığımıza gelince ise öncelikle eklememiz
gerekn kütüphanleri belirleyelim. Bunlar :

style='border-collapse:collapse;mso-yfti-tbllook:1184;mso-padding-alt:0cm 0cm 0cm 0cm'>

#include
<windows.h> style='color:green'>// Windows penceresi İçin

#include
<gl\gl.h> style='color:green'>// OpenGL kütüphanesi İçin

#include
<gl\glu.h> style='color:green'>// GLU kütüphanesi İçin

#include
<gl\glaux.h> style='color:green'>// Glaux Kütüphanesi İçin

Daha sonra bir GL penceresi oluşturalım ve çizim fonksiyonumuzu
belirleyelim. Bunlar :

style='border-collapse:collapse;mso-yfti-tbllook:1184;mso-padding-alt:0cm 0cm 0cm 0cm'>

int
DrawGLScene(GLvoid)
//Çizim İşmeli
fonksiyonumuz

{

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); style='color:green'>// Ekran ve derimliği temizle

glLoadIdentity();
      //Aktif model
matrisini temizle

glTranslatef(-1.5f,0.0f,-6.0f);

glBegin(GL_TRIANGLES);

// Üçgen Çizimi başlat

glColor3f(1.0,0.0,0.0);

glVertex3f( 0.0f, 1.0f,
0.0f);

glVertex3f(-1.0f,-1.0f,
0.0f);

glVertex3f( 1.0f,-1.0f,
0.0f);

glEnd();
      //Üçgen çizimi
sonlandır

glTranslatef(3.0f,0.0f,0.0f);

glBegin(GL_QUADS);
      // Dörtgen Çizimini
başlat

glColor3f(1.0,0.0,0.0);

glVertex3f(-1.0f, 1.0f,
0.0f);

glVertex3f( 1.0f, 1.0f,
0.0f);

glVertex3f( 1.0f,-1.0f,
0.0f);

glVertex3f(-1.0f,-1.0f,
0.0f);

glEnd();
      //Dörtgen çizimini
sonlandır

return
TRUE;

}

Kodumuzun geri kalanı ise belirli standartları eklememiz gerekiyor bunlarıda
aşağıdaki gibi belirlerisek C++ uygulamamızıda tamamlamış olacağız . Uygulamamızı
çalıştırdıktan sonta elde ettiğmiz görütü ise resimdeki gibi oluyor. Dosyanın
aslını aşağıda belirtilen kaynak adresinden edinebilirsiniz.

style='mso-no-proof:yes'> src="http://www.bilyaz.com/images/makale/1184414215-cpp_2bcizim.JPG"
alt="http://www.bilyaz.com/images/makale/1184414215-cpp_2bcizim.JPG">

Bu yazımda sizlere fazla derinlemesine girmeden OpenGL ile 2 boyutlu cizimlerin
nasıl yapılabileceğini C# ve C++ otamlarında anlatmaya çalıştım. Olayların
derinlerine girmememin sebebi ise ilk makaleden sizleri sıkmamaktı. Önümüzdeki
makalelerde yeni uygulamalar geliştirdikçe sizlerde yapılan işlemleri daha iyi
anlayacaksınız. Bu makeleden edindiklerinizle yeni ve değişik uygulamalar
geliştirir iseniz daha iyi anlayacağınızdan eminim. Bir sonraki makalede
görüşmek üzere.

Kaynak : http://nehe.gamedev.net/

Tahir MUTLU

14 Temmuz 2007