Tutorial Melayu

OpenGL: Warna

Introduction

user

Fairuz

System Engineer (Texas Instruments France), Masters in Electronics , Embedded System Engineering,


LATEST POSTS

Nota: git alias yang biasa digunakan 05th December, 2013

Nota: Android .gitignore 23rd February, 2013

OpenGL

OpenGL: Warna

Posted on .

Dalam artikel sebelum ini, kita telah melukis bentuk primitif tetapi tidak memasukkan maklumat berkenaan dengan warna. Terdapat pelbagai format warna yang berbeza seperti YUV dan RGB. Dalam artikel ini kita akan menggunakan format RGB (Red Green Blue).

Format RGB terdiri dari 3 warna utama iaitu merah, hijau dan biru. Dan setiap warna mempunyai nilai dari 0 hingga 255 (8 bit). (0,0,0) dalam format RGB bersamaan dengan warna hitam manakala (255,255,255) adalah warna putih. Akan tetapi OpenGL menggunakan nilai dari 0 hingga 1. Jadi 255 bersamaan dengan 1 dalam OpenGL.

Contoh-contoh lain:

  • (0.0f, 0.0f, 0.0f) Hitam
  • (1.0f, 1.0f, 1.0f) Putih
  • (1.0f, 0.0f, 0.0f) Merah
  • (0.0f, 0.0f, 1.0f) Biru
  • (0.0f, 1.0f, 0.0f) Hijau
  • (1.0f, 1.0f, 0.0f) Kuning

Dalam OpenGL kita mempunyai dua fungsi yang boleh digunakan untuk warna, iaitu glColor3f(r, g, b) dan juga glColor4f(r, g, b, a). a di sini adalah nilai alpha di mana 0 bersamaan dengan telus dan 1.0f adalah legap.

Kita boleh memberi warna kepada setiap vertex yang dibina, atau kepada keseluruhan bentuk geometri.

Warna keseluruhan bentuk geometri.


void binaPrimitif(void){
	glColor3f(0.0f, 0.0f, 1.0f); // Petak berwarna biru
	glBegin(GL_QUADS);
	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();
}

Setiap vertex, mempunyai warna berbeza:

void binaPrimitif(void){
	glBegin(GL_QUADS);
	glColor3f(0.0f, 0.0f, 1.0f); // bucu berwarna biru
	glVertex3f(-1.0f, -1.0f, 0.0f);
	glColor3f(1.0f, 0.0f, 0.0f); // bucu berwarna merah
	glVertex3f(-1.0f, 1.0f, 0.0f);
	glColor3f(0.0f, 1.0f, 0.0f); // bucu berwarna hijau
	glVertex3f(1.0f, 1.0f, 0.0f);
	glColor3f(1.0f, 1.0f, 0.0f); // bucu berwarna kuning
	glVertex3f(1.0f, -1.0f, 0.0f);
	glEnd();
}

Kompil kod ini dan cuba lihat petak anda akan mempunyai bucu-bucu yang berlainan warna.

main.cpp

#include 
#include 

void binaPrimitif(void){
	glBegin(GL_QUADS);
	glColor3f(0.0f, 0.0f, 1.0f); // bucu berwarna biru
	glVertex3f(-1.0f, -1.0f, 0.0f);
	glColor3f(1.0f, 0.0f, 0.0f); // bucu berwarna merah
	glVertex3f(-1.0f, 1.0f, 0.0f);
	glColor3f(0.0f, 1.0f, 0.0f); // bucu berwarna hijau
	glVertex3f(1.0f, 1.0f, 0.0f);
	glColor3f(1.0f, 1.0f, 0.0f); // bucu berwarna kuning
	glVertex3f(1.0f, -1.0f, 0.0f);
	glEnd();
}

void tekanKekunci(unsigned char key, int x, int y) {
	switch (key) {
		case 27:  // Keluar dari program
			exit(0) ;
			break ;
		default:
			break ;
	}
}
 
void lepasKekunci(unsigned char key, int x, int y) {
 
}

void papar(void){
	glClearColor(1.0f, 0.0f, 0.0f, 1.0f); // Tukar background kepada warna merah
	glClear(GL_COLOR_BUFFER_BIT); // Kosongkan buffer warna
	glLoadIdentity(); // 
	glTranslatef(0.0f, 0.0f, -5.0f);  // alihkan kamera menjauhi paksi z 
 	binaPrimitif();   // Bina bentuk primitif
	glFlush(); // Hantar buffer ke tetingkap
}

void reshape(int width, int height){
	glViewport(0, 0, (GLsizei)width, (GLsizei)height); // 
	glMatrixMode(GL_PROJECTION); // Tukar kepada projection matrix
	glLoadIdentity(); //   
	gluPerspective(60, (GLfloat)width / (GLfloat)height, 1.0, 100.0); // fov, aspect ratio, near and far plane 
	glMatrixMode(GL_MODELVIEW); // Tukar semula ke modelview matrix  	
}

int main(int argc, char** argv)
{
	glutInit(&argc, argv);

	glutInitDisplayMode (GLUT_SINGLE);

	glutInitWindowSize (500, 500); 
	glutInitWindowPosition (100, 100);
	glutCreateWindow ("Tetingkap pertama saya");

	// Now, we define callbacks and functions for various tasks.
	glutDisplayFunc(papar); 
	glutReshapeFunc(reshape);
	glutKeyboardFunc(tekanKekunci);
    glutKeyboardUpFunc(lepasKekunci);

	glutMainLoop(); // Start the main code
	return 0;   /* ANSI C requires main to return int. */
}

profile

Fairuz

http://www.tutorialmelayu.com

System Engineer (Texas Instruments France), Masters in Electronics , Embedded System Engineering,

There are no comments.

Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

View Comments (0) ...
Navigation