Wednesday 2 August 2017

Kode Dasar Implementasi OpenGL untuk Gambar Bergerak

Yak, kali ini saya akan membagikan kode dasar implementasi openGL untuk gambar bergerak dengan bahasa pemrograman C++ (dapat juga disesuaikan dengan bahasa pemrograman lainnya). Penjelasan yang saya berikan disini sangatlah singkat (dalam bentuk komentar pada kode), karena tujuan saya hanya membagikan kode dasar implementasi openGL untuk gambar bergerak. Silakan untuk mempelajarinya sendiri untuk lebih dalam. Gambar yang diimplementasikan merupakan gambar 2 dimensi dengan sistem sel 100x100 (atau dalam citra disebut piksel 100x100).

1. Hal pertama yang dibutuhkan adalah menginstal openGL pada aplikasi IDE yang Anda gunakan. Jangan lupa untuk melakukan konfigurasi khusus jika memang diperlukan (pada Visual Studio 2010 yang saya gunakan perlu dilakukan konfigurasi khusus pada tiap project untuk menghubungkan proyek dengan library-nya).

2. Mempersiapkan variabel dan konstanta yang diperlukan

//variable dan konstanta
int init=1;
int delay_value=50000000;
int s[n2][n2], s1[n2][n2]; //terrain
const int n2 = 102;
const int n = 100;

//warna
GLfloat nothing[3] = {0.5, 0.3, 0.0};
GLfloat first_obj[3] = {0.2, 0.4, 0.8};

3. Setelah itu barulah mengimplementasikan fungsi main sebagai berikut:

int main(int argc, char ** argv)
{
   
    glutInit(&argc, argv);
    glutInitDisplayMode(GLUT_DOUBLE|GLUT_RGBA);
    glutInitWindowPosition(300,50);
    glutInitWindowSize(600,600);
    glutCreateWindow("Judul Window");
    glClearColor(1.0,1.0,1.0,0);
    gluOrtho2D(0,n,0,n);
    glutIdleFunc(display); //menunggu proses update state
    glutDisplayFunc(display); //menampilkan display
    glutMainLoop(); //loop
    return 0;
}

4. Dapat kita lihat di atas bahwa fungsi idle dan display membutuhkan masukan berupa "display", yang dimaksud adalah fungsi bernama display. Fungsi inilah yang dipanggil berulang untuk menampilkan gambar beserta update yang terjadi.

void display(void)
{
    glClear(GL_COLOR_BUFFER_BIT);
    glPointSize(10);
    userDraw();
    glutSwapBuffers();
}

5. Membuat fungsi userDraw(). Sesuai namanya, fungsi ini digunakan pengguna untuk "menggambar". Isi fungsi inilah yang digunakan untuk otak-atik kejadian dalam gambar.

void userDraw() {
    glBegin(GL_POINTS);
    if(init==1){
        //initialization
        init=0;
    }
    else{
        //update state
    }
   
    //draw
    for (int i = 1; i <= n; i++) {
        for(int j = 1; j <= n; j++){
            //pewarnaan sel
            if(s[i][j] == 1){
                glColor3fv(first_obj);
            }else{
                glColor3fv(nothing);
            }
            glVertex2f(i, j);
        }
    }
    delay();
    glEnd();
}

6. Membuat fungsi delay(). Komputer yang diproduksi saat ini merupakan komputer berkecepatan tinggi, jika kita tidak melakukan delay, segala kejadian yang terjadi tidak akan terlihat dengan jelas atau bahkan tidak terlihat karena terlalu cepat berlalu.

void delay(void){
    for(int tmp = 0; tmp < delay_value; tmp++){/*delayer*/}
}

7. Untuk mempermudah, berikut ini adalah susunan kode lengkapnya (silakan inisialisasi dan update state diisi sendiri sesuai kebutuhan)

//variable dan konstanta
int init=1;
int delay_value=50000000;
int s[n2][n2], s1[n2][n2]; //terrain
const int n2 = 102;
const int n = 100;

//warna
GLfloat nothing[3] = {0.5, 0.3, 0.0};
GLfloat first_obj[3] = {0.2, 0.4, 0.8};

void delay(void){
    for(int tmp = 0; tmp < delay_value; tmp++){/*delayer*/}
}

void userDraw() {
    glBegin(GL_POINTS);
    if(init==1){
        //initialization
        init=0;
    }
    else{
        //update state
    }
   
    //draw
    for (int i = 1; i <= n; i++) {
        for(int j = 1; j <= n; j++){
            //pewarnaan sel
            if(s[i][j] == 1){
                glColor3fv(first_obj);
            }else{
                glColor3fv(nothing);
            }
            glVertex2f(i, j);
        }
    }
    delay();
    glEnd();
}

void display(void)
{
    glClear(GL_COLOR_BUFFER_BIT);
    glPointSize(10);
    userDraw();
    glutSwapBuffers();
}

int main(int argc,char ** argv)
{
   
    glutInit(&argc, argv);
    glutInitDisplayMode(GLUT_DOUBLE|GLUT_RGBA);
    glutInitWindowPosition(300,50);
    glutInitWindowSize(600,600);
    glutCreateWindow("Judul Window");
    glClearColor(1.0,1.0,1.0,0);
    gluOrtho2D(0,n,0,n);
    glutIdleFunc(display); //menunggu proses update state
    glutDisplayFunc(display); //menampilkan display
    glutMainLoop(); //loop
    return 0;
}

Silakan gabungkan dengan kode pada link di bawah ini untuk implementasi:

No comments:

Post a Comment