Workshop Grafika Komputer - Primitive Drawing
Workshop Grafika Komputer - Primitive Drawing
Function
int main() {
//start GL context and OS Windows using GLFW lib
if (!glfwInit()) {
fprintf(stderr, "ERROR : could not start GLFW3\n");
return 1;
}
glfwMakeContextCurrent(window);
glEnable(GL_DEPTH_TEST);
glDepthFunc(GL_LESS);
float points[] = {
0.0f, 0.5f, 0.0f,
0.5f, -0.5f, 0.0f,
-0.5f, -0.5f, 0.0f,
};
//VAO setting
GLuint vao = 0;
glGenVertexArrays(1, &vao);
glBindVertexArray(vao);
glEnableVertexAttribArray(0);
glBindBuffer(GL_ARRAY_BUFFER, vbo);
glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 0, NULL);
//RECALL SHADERS
const char* vertex_shader =
"#version 400\n"
"in vec3 vp;"
"void main() {"
"gl_Position = vec4(vp, 1.0);"
"}";
//shaders attach
GLuint vs = glCreateShader(GL_VERTEX_SHADER);
glShaderSource(vs, 1, &vertex_shader, NULL);
glCompileShader(vs);
GLuint fs = glCreateShader(GL_FRAGMENT_SHADER);
glShaderSource(fs, 1, &fragment_shader, NULL);
glCompileShader(fs);
while (!glfwWindowShouldClose(window))
{
//wipe drawing or clear
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glUseProgram(shader_progamme);
glBindVertexArray(vao);
//draw point
glDrawArrays(GL_TRIANGLES, 0, 3);
glPointSize(15.0);
//update event
glfwPollEvents();
//put drawing
glfwSwapBuffers(window);
}
}
Capture Output :
Segitiga Dot
Sintaks Code :
#include <GL/glew.h>
#include <GLFW/glfw3.h>
#include <stdio.h>
int main() {
//start GL context and OS Windows using GLFW lib
if (!glfwInit()) {
fprintf(stderr, "ERROR : could not start GLFW3\n");
return 1;
}
glfwMakeContextCurrent(window);
glEnable(GL_DEPTH_TEST);
glDepthFunc(GL_LESS);
float points[] = {
0.0f, 0.5f, 0.0f,
0.5f, -0.5f, 0.0f,
-0.5f, -0.5f, 0.0f,
};
//create vector buffer object
GLuint vbo;
glGenBuffers(1, &vbo);
//VAO setting
GLuint vao = 0;
glGenVertexArrays(1, &vao);
glBindVertexArray(vao);
glEnableVertexAttribArray(0);
glBindBuffer(GL_ARRAY_BUFFER, vbo);
glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 0, NULL);
//RECALL SHADERS
const char* vertex_shader =
"#version 400\n"
"in vec3 vp;"
"void main() {"
"gl_Position = vec4(vp, 1.0);"
"}";
//shaders attach
GLuint vs = glCreateShader(GL_VERTEX_SHADER);
glShaderSource(vs, 1, &vertex_shader, NULL);
glCompileShader(vs);
GLuint fs = glCreateShader(GL_FRAGMENT_SHADER);
glShaderSource(fs, 1, &fragment_shader, NULL);
glCompileShader(fs);
while (!glfwWindowShouldClose(window))
{
//wipe drawing or clear
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glUseProgram(shader_progamme);
glBindVertexArray(vao);
//draw point
glDrawArrays(GL_POINTS, 0, 3);
glPointSize(15.0);
//update event
glfwPollEvents();
//put drawing
glfwSwapBuffers(window);
}
}
Capture Output :
Input Handler Function Keyboard Spasi
Sintaks Code :
#include <GL/glew.h>
#include <GLFW/glfw3.h>
#include <math.h>
#include <iostream>
void keyCallback(GLFWwindow* window, int key, int scancode, int action, int mods);
int main(void)
{
GLFWwindow* window;
if (!glfwInit())
{
return -1;
}
if (!window)
{
glfwTerminate();
return -1;
}
glfwMakeContextCurrent(window);
glfwSetKeyCallback(window, keyCallback);
glfwSetInputMode(window, GLFW_STICKY_KEYS, 1);
while (!glfwWindowShouldClose(window))
{
glClear(GL_COLOR_BUFFER_BIT);
glfwSwapBuffers(window);
glfwPollEvents();
}
glfwTerminate();
return 0;
void keyCallback(GLFWwindow* window, int key, int scancode, int action, int mods)
{
if (key == GLFW_KEY_SPACE && action == GLFW_PRESS)
{
std::cout << "Space Key Pressed" << std::endl;
}
}
Capture Output :
while (!glfwWindowShouldClose(window))
{
glClear(GL_COLOR_BUFFER_BIT);
double xpos, ypos;
glfwGetCursorPos(window, &xpos, &ypos);
glfwSwapBuffers(window);
glfwPollEvents();
}
glfwTerminate();
return 0;
}
int main(void) {
GLFWwindow* window;
if (!glfwInit())
{
return -1;
}
glfwSetCursorEnterCallback(window, cursorEnterCallback);
while (!glfwWindowShouldClose(window))
{
glClear(GL_COLOR_BUFFER_BIT);
glfwSwapBuffers(window);
glfwPollEvents();
}
glfwTerminate();
return 0;
}
TUGAS
Assignment 1
1. Sintaks Code :
#include <GL/glew.h>
#include <GLFW/glfw3.h>
#include <stdio.h>
int main() {
//start GL context and OS Windows using GLFW lib
if (!glfwInit()) {
fprintf(stderr, "ERROR : could not start GLFW3\n");
return 1;
}
glEnable(GL_DEPTH_TEST);
glDepthFunc(GL_LESS);
float points[] = {
0.5f, 0.5f, 0.0f,
0.5f, -0.5f, 0.0f,
-0.5f, -0.5f, 0.0f,
-0.5f, 0.5f, 0.0f,
0.5f, 0.5f, 0.0f,
-0.5f, 0.5f, 0.0f,
0.5f, -0.5f, 0.0f,
-0.5f, -0.5f, 0.0f
};
//VAO setting
GLuint vao = 0;
glGenVertexArrays(1, &vao);
glBindVertexArray(vao);
glEnableVertexAttribArray(0);
glBindBuffer(GL_ARRAY_BUFFER, vbo);
glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 0, NULL);
//RECALL SHADERS
const char* vertex_shader =
"#version 400\n"
"in vec3 vp;"
"void main() {"
"gl_Position = vec4(vp, 1.0);"
"}";
//shaders attach
GLuint vs = glCreateShader(GL_VERTEX_SHADER);
glShaderSource(vs, 1, &vertex_shader, NULL);
glCompileShader(vs);
GLuint fs = glCreateShader(GL_FRAGMENT_SHADER);
glShaderSource(fs, 1, &fragment_shader, NULL);
glCompileShader(fs);
while (!glfwWindowShouldClose(window)) {
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glUseProgram(shader_progamme);
glBindVertexArray(vao);
glDrawArrays(GL_LINES, 0, 8);
glPointSize(38.0);
glfwPollEvents();
glfwSwapBuffers(window);
}
Capture Output :
Analisa :
Pada praktikum di assignment 1.1 kali ini yaitu membuat garis yang akan
membentuk persegi. Pertama membuat output window dengan ukuran 640 dan 480.
Selanjutnya membuat variable konstanta untuk menampilkan renderer graphic yang
dipakai dan versi opengl yang dipakai, selanjutnya membuat float points untuk garis
yang akan dimunculkan nanti, Menggunakan perintah buffer untuk memproses float
pointnya, membuat variable untuk shader dan fragment untuk posisi dan warnanya,
kemudian memasukanprogram untuk memproses shader dan fragment. Selanjutnya
membuat fungsi while untuk menampilkan hasilnya dengan memanggil fungsi shader,
array dari variable vao, perintah gldrawarray untuk menggambarkan hasil prosesnya
yang berisi fungsi GL_LINES untuk menampilkan garis yang sudah diproses dan
point size untuk menentukan ukuran dari gambarnya. Hasilnya akan muncul gambar
persegi Panjang yang terbentuk dari garis – garis yang sudah di proses tadi.
2. Sintaks Code :
#include <GL/glew.h>
#include <GLFW/glfw3.h>
#include <stdio.h>
int main() {
if (!glfwInit()) {
fprintf(stderr, "ERROR : could not start GLFW3\n");
return 1;
}
if (!window) {
fprintf(stderr, "ERROR : could not open windows with GLFW3\n");
glfwTerminate();
return 1;
}
glfwMakeContextCurrent(window);
glewExperimental = GL_TRUE;
glewInit();
glEnable(GL_DEPTH_TEST);
glDepthFunc(GL_LESS);
float points[] = {
0.5f, 0.5f, 0.0f,
0.5f,-0.5f, 0.0f,
-0.5f,-0.5f, 0.0f,
-0.5f, 0.5f, 0.0f,
0.5f, 0.5f, 0.0f,
-0.5f, 0.5f, 0.0f,
0.5f,-0.5f, 0.0f,
-0.5f,-0.5f, 0.0f,
};
GLuint vbo;
glGenBuffers(1, &vbo);
glBindBuffer(GL_ARRAY_BUFFER, vbo);
glBufferData(GL_ARRAY_BUFFER, sizeof(points), points, GL_STATIC_DRAW);
GLuint vao = 0;
glGenVertexArrays(1, &vao);
glBindVertexArray(vao);
glEnableVertexAttribArray(0);
glBindBuffer(GL_ARRAY_BUFFER, vbo);
glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 0, NULL);
GLuint vs = glCreateShader(GL_VERTEX_SHADER);
glShaderSource(vs, 1, &vertex_shader, NULL);
glCompileShader(vs);
GLuint fs = glCreateShader(GL_FRAGMENT_SHADER);
glShaderSource(fs, 1, &fragment_shader, NULL);
glCompileShader(fs);
while (!glfwWindowShouldClose(window)) {
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glUseProgram(shader_progamme);
glBindVertexArray(vao);
glDrawArrays(GL_LINE_LOOP, 0, 4);
glfwPollEvents();
glfwSwapBuffers(window);
}
}
Capture Output :
Analisa :
Pada praktikum kali ini yaitu membuat perulangan garis yang akan
membentuk persegi Panjang. Pertama membuat output window dengan ukuran 640
dan 480. Selanjutnya membuat variable konstanta untuk menampilkan renderer
graphic yang dipakai dan versi opengl yang dipakai, selanjutnya membuat float points
untuk garis yang akan dimunculkan nanti, Menggunakan perintah buffer untuk
memproses float pointnya, membuat variable untuk shader dan fragment untuk posisi
dan warnanya, kemudian memasukanprogram untuk memproses shader dan fragment.
Selanjutnya membuat fungsi while untuk menampilkan hasilnya dengan memanggil
fungsi shader, array dari variable vao, perintah gldrawarray untuk menggambarkan
hasil prosesnya yang berisi fungsi GL_LINE_LOOP untuk menampilkan garis secara
berulang dan point size untuk menentukan ukuran dari gambarnya. Hasilnya akan
muncul gambar persegi Panjang yang terbentuk dari garis – garis yang sudah di
proses tadi.
Assignment 2
1. Sintaks Code :
#include <GL/glew.h>
#include <GLFW/glfw3.h>
#include <stdio.h>
#include <math.h>
#include <iostream>
void keyCallBack(GLFWwindow* window, int key, int scancode, int action, int
mods) {
std::cout << key << std::endl;
int main(void) {
GLFWwindow* window;
if (!glfwInit()) {
return -1;
}
glfwMakeContextCurrent(window);
glfwSetKeyCallback(window, keyCallBack);
glfwSetInputMode(window, GLFW_STICKY_KEYS, 1);
while (!glfwWindowShouldClose(window)) {
glClear(GL_COLOR_BUFFER_BIT);
glfwSwapBuffers(window);
glfwPollEvents();
}
glfwTerminate();
return 0;
}
Capture Output :
Analisa :
Pada program keyboard yang pertama, fungsi keyCallback menggunakan fungsi input
GLFW_KEY_SPACE dan GLFW_PRESS. Outputnya adalah jika kita menekan
space, akan muncul teks “Space Key Pressed”. Sedangkan pada program keyboard
assignment 2(1) menggunakan fungsi input GLFW_REPEAT. Perbedaan dari fungsi
sebelumnya yang menggunakan GLFW_PRESS yaitu pada GLFW_REPEAT, saat
menekan tombol space pada keyboard harus ditekan lebih lama agar tulisan “Space
Key Pressed” muncul.
2. Sintaks Code :
#include <GL/glew.h>
#include <GLFW/glfw3.h>
#include <stdio.h>
#include <math.h>
#include <iostream>
void keyCallBack(GLFWwindow* window, int key, int scancode, int action, int
mods) {
std::cout << key << std::endl;
if (key == GLFW_KEY_L && action == GLFW_PRESS) {
std::cout << "L Key Pressed" << std::endl;
}
}
int main(void) {
GLFWwindow* window;
if (!glfwInit()) {
return -1;
}
glfwMakeContextCurrent(window);
glfwSetKeyCallback(window, keyCallBack);
glfwSetInputMode(window, GLFW_STICKY_KEYS, 1);
while (!glfwWindowShouldClose(window)) {
glClear(GL_COLOR_BUFFER_BIT);
glfwSwapBuffers(window);
glfwPollEvents();
}
glfwTerminate();
return 0;
}
Capture Output :
Analisa :
Pada percobaan praktikum assignment 2(2) menggunakan program yang sama
dengan program keyboard. Namun, pada fungsi keyCallback pada parameter if,
bagian key dan action diganti dengan key L dan GLFW_REPEAT. Pada parameter if,
nilai key diganti menjadi GLFW_KEY_L agar saat tombol L ditekan, program akan
memberikan callback dan mencetak “L key pressed”. Bila key selain L ditekan, maka
tidak akan mencetak tulisan apapun. Namun, karena menggunakan GLFW_REPEAT,
maka tombol L harus ditekan terus menerus untuk mencetak tulisan “L Key Pressed”.
Bila tombol L hanya ditekan kemudian dilepaskan, maka tulisan tidak akan tercetak.
Assignment 3
1. Sintaks Code :
#include <GL/glew.h>
#include <GLFW/glfw3.h>
#include <stdio.h>
#include <math.h>
#include <iostream>
int main(void) {
GLFWwindow* window;
if (!glfwInit())
{
return -1;
}
glfwMakeContextCurrent(window);
glfwSetMouseButtonCallback(window, mouseButtonCallback);
glfwSetInputMode(window, GLFW_STICKY_MOUSE_BUTTONS, GLFW_TRUE);
while (!glfwWindowShouldClose(window))
{
glClear(GL_COLOR_BUFFER_BIT);
glfwSwapBuffers(window);
glfwPollEvents();
}
glfwTerminate();
return 0;
}
int main(void) {
GLFWwindow* window;
if (!glfwInit())
{
return -1;
}
if (!window) {
glfwTerminate();
return -1;
}
glfwMakeContextCurrent(window);
glfwSetScrollCallback(window, scrollCallback);
glfwSetInputMode(window, GLFW_STICKY_MOUSE_BUTTONS, GLFW_TRUE);
while (!glfwWindowShouldClose(window))
{
glClear(GL_COLOR_BUFFER_BIT);
glfwSwapBuffers(window);
glfwPollEvents();
}
glfwTerminate();
return 0;
}
Capture Output :
Analisa :
Output program mouse assignment 3(2) adalah jika kita melakukan scroll up pada
mouse, akan keluar nilai 1 pada sumbu y, dan jika kita melakukan scroll down pada mouse,
akan keluar nilai -1 pada sumbu y. Perbedaan dari program sebelumnya adalah pada program
sebelumnya kita harus mengklik kanan atau kiri pada mouse terlebih dahulu baru muncul
output “Right button pressed” atau “Left button pressed”, sedangkan program ini hanya perlu
menscroll ke atas atau ke bawah saja untuk menampilkan nilai pada Y apakah 1 atau -1.