[OpenGL] 3차원 객체 렌더 1

이제 3D 좌표를 2D 좌표로 변환하는 방법을 통해 실제 3D 객체를 렌더링할 수 있다.

■ 변환 행렬 정의

3D 객체를 그리기 위해 먼저 모델 행렬을 생성한다. 모델 행렬은 객체의 모든 정점을 Global World Space로 변환하기 위해 적용하고자 하는 평행이동, 스케일링, 회전등으로 구성된다.

- Model Matrix (모델 행렬)

glm::mat4 model = glm::mat4(1.0f);
// 평면을 x축을 기준으로 회전시켜 바닥에 놓인 것 처럼 보이게 한다.
model = glm::rotate(model, glm::radians(-55.0f), glm::vec3(1.0f, 0.0f, 0.0f));

이 모델 행렬과 정점 좌표를 곱함으로써 정점 좌표를 월드 좌표로 변환한다.

다음으로 객체가 보이도록 하기 위해 씬에서 약간 뒤로 물러나려 하는데, 카메라를 뒤로 이동시키는 것은 전체 씬을 앞으로 이동시키는 것과 같다.

이를 위해 View Matrix (뷰 행렬)을 생성하여 카메라가 이동하고자 하는 방향의 반대로 전체 씬을 이동시킨다.

우리(카메라)가 뒤로 이동하려면 양의 z축 방향으로 이동해야 한다. 따라서 씬을 음의 z축 방향으로 이동시킬 것이다.

- View Matrix (뷰 행렬)

glm::mat4 view = glm::mat4(1.0f);
// 전체 씬을 음의 z축 방향으로 평행이동시킨다.
view = glm::translate(view, glm::vec3(0.0f, 0.0f, -3.0f));

 

- Projection Matrix (투영 행렬)

glm::mat4 projection;
// Perspective Projection 사용
projection = glm::perspective(glm::radians(45.0f), 800.0f / 600.0f, 0.1f, 100.0f);

 

■ 셰이더에 전달

이제 변환 행렬들을 생성했으니, 이를 셰이더에 전달해야 한다. 먼저 변환 행렬을 Vertex Shader에서 uniform으로 선언하고, 그것들을 정점 좌표와 곱한다.

- Vertex Shader

#version 330 core
layout (location = 0) in vec3 aPos;
...
uniform mat4 model;
uniform mat4 view;
uniform mat4 projection;

void main()
{
	// 행렬의 곱셈이므로 오른쪽에서 왼쪽순으로 곱한다.
	gl_Position = projection * view * model * vec4(aPos, 1.0);
	...
}

 

그리고 변환 행렬을 셰이더에 보낸다. (변환 행렬은 자주 변동되기 때문에 일반적으로 매 프레임마다 수행된다)

 

// 모델 행렬
int modelLoc = glGetUniformLocation(ourShader.ID, "model");
glUniformMatrix4fv(modelLoc, 1, GL_FALSE, glm::value_ptr(model));

// 뷰 행렬
int viewLoc = glGetUniformLocation(ourShader.ID, "view");
glUniformMatrix4fv(viewLoc, 1, GL_FALSE, glm::value_ptr(view));

// 투영 행렬
int projectionLoc = glGetUniformLocation(ourShader.ID, "projection");
glUniformMatrix4fv(projectionLoc, 1, GL_FALSE, glm::value_ptr(projection));

 

* 투영 행렬은 흔하게 변경되지 않으므로 루프 밖에서 한 번만 설정하는 것이 좋다.

 

 

■ 소스 코드

#include <glad/glad.h>
#include <GLFW/glfw3.h>
#include <Shader.h>
#include <iostream>

#define STB_IMAGE_IMPLEMENTATION
#include "stb_image.h"

#include <glm/glm.hpp>
#include <glm/gtc/matrix_transform.hpp>
#include <glm/gtc/type_ptr.hpp>

void framebuffer_size_callback(GLFWwindow* window, int width, int height);
void processInput(GLFWwindow* window);

const unsigned int SCR_WIDTH = 800;
const unsigned int SCR_HEIGHT = 600;

float mixPercent = 0.0f;

int main()
{
    // ---------- [ 1. GLFW, GLAD 세팅 ] ----------

    // GLFW 초기화 및 설정
    glfwInit();
    glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);
    glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);
    glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);

    // GLFW 윈도우 생성
    GLFWwindow* window = glfwCreateWindow(SCR_WIDTH, SCR_HEIGHT, "LearnOpenGL", NULL, NULL);
    if (window == NULL)
    {
        std::cout << "Failed to create GLFW window" << std::endl;
        glfwTerminate();
        return -1;
    }
    glfwMakeContextCurrent(window);
    glfwSetFramebufferSizeCallback(window, framebuffer_size_callback);

    // GLAD - OpenGL 함수 포인터를 로드
    if (!gladLoadGLLoader((GLADloadproc)glfwGetProcAddress))
    {
        std::cout << "Failed to initialize GLAD" << std::endl;
        return -1;
    }

    // 셰이더 프로그램 빌드 및 컴파일
    Shader ourShader("Shaders/Shader.vert", "Shaders/Shader.frag");

    // ---------- [ 2. 정점 데이터 입력 / 정점 속성 구성 ] ----------

    float vertices[] = {
        // 위치              // 컬러             // 텍스처 좌표
        0.5f,  0.5f, 0.0f,   1.0f, 0.0f, 0.0f,   2.0f, 2.0f,   // 우측 상단
        0.5f, -0.5f, 0.0f,   0.0f, 1.0f, 0.0f,   2.0f, 0.0f,   // 우측 하단
       -0.5f, -0.5f, 0.0f,   0.0f, 0.0f, 1.0f,   0.0f, 0.0f,   // 좌측 하단
       -0.5f,  0.5f, 0.0f,   1.0f, 1.0f, 0.0f,   0.0f, 2.0f    // 좌측 상단
    };
    unsigned int indices[] = {
        0, 1, 3,   // 첫 번째 삼각형
        1, 2, 3    // 두 번째 삼각형
    };

    // VAO, VBO, EBO 생성
    // VAO: VBO와 정점 속성 포인터의 상태를 저장하기 위한 객체 
    // VBO: GPU 메모리에 정점 데이터를 저장하기 위한 버퍼 객체
    unsigned int VBO, VAO, EBO;
    glGenVertexArrays(1, &VAO);
    glGenBuffers(1, &VBO);
    glGenBuffers(1, &EBO);

    // 정점 배열 객체(VAO) 바인딩
    glBindVertexArray(VAO);

    // 정점 버퍼 객체(VBO)를 바인딩
    glBindBuffer(GL_ARRAY_BUFFER, VBO);

    // 바인딩된 버퍼 객체에 vertices 데이터를 복사하고,버퍼 객체의 크기와 데이터 설정
    glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);

    // EBO
    glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, EBO);
    glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);

    // Position Attribute 구성
    glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)0);
    glEnableVertexAttribArray(0);
    // Color Attribute 구성
    glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(3 * sizeof(float)));
    glEnableVertexAttribArray(1);
    // Texture coord Attribute 구성
    glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(6 * sizeof(float)));
    glEnableVertexAttribArray(2);

    // 다른 VAO 호출이 이 VAO를 실수로 수정하지 않도록 VAO를 바인딩 해제할 수 있지만, 일반적으로는 VAO(및 VBO)를 바인딩 해제하지 않는다.
    // glBindVertexArray(0);

    // ---------- [ 3. 텍스처 로드 및 생성 ] ----------
    
    // 텍스처 객체 생성 (2개)
    unsigned int texture1, texture2;

    // 상하 반전 설정
    stbi_set_flip_vertically_on_load(true);

    // < 텍스처 1 >
    glGenTextures(1, &texture1);
    glBindTexture(GL_TEXTURE_2D, texture1);

    // Wrapping 옵션 설정
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);

    // Filtering 옵션 설정
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);

    // 이미지 로드 (jpg)
    int width, height, nrChannels;
    unsigned char* data = stbi_load("Textures/container.jpg", &width, &height, &nrChannels, 0);

    // 텍스처 생성 (RGB)
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, width, height, 0, GL_RGB, GL_UNSIGNED_BYTE, data);
    glGenerateMipmap(GL_TEXTURE_2D);

    // 메모리 반환
    stbi_image_free(data);

    // < 텍스처 2 >
    glGenTextures(1, &texture2);
    glBindTexture(GL_TEXTURE_2D, texture2);

    // Wrapping 옵션 설정
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
    
    // Filtering 옵션 설정
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);

    // 이미지 로드 (png)
    data = stbi_load("Textures/awesomeface.png", &width, &height, &nrChannels, 0);

    // 텍스처 생성 (RGBA)
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, width, height, 0, GL_RGBA, GL_UNSIGNED_BYTE, data);
    glGenerateMipmap(GL_TEXTURE_2D);

    // 메모리 반환
    stbi_image_free(data);

    // 셰이더 활성화
    ourShader.use();

    // 셰이더 프로그램의 uniform 변수 설정 (매개 변수 : 1.location, 2.텍스처 유닛 인덱스)
    glUniform1i(glGetUniformLocation(ourShader.ID, "texture1"), 0);
    ourShader.setInt("texture2", 1); // 또는 미리 만들어진 shader 클래스 사용

    // ---------- [ 4. 렌더 루프 ] ----------
    while (!glfwWindowShouldClose(window))
    {
        // 입력 처리
        processInput(window);

        ourShader.setFloat("mixPercent", mixPercent);

        // 배경 렌더
        glClearColor(0.0f, 0.0f, 0.0f, 1.0f);
        glClear(GL_COLOR_BUFFER_BIT);

        // 각각의 텍스처 유닛에 텍스처 바인딩
        glActiveTexture(GL_TEXTURE0);
        glBindTexture(GL_TEXTURE_2D, texture1);
        glActiveTexture(GL_TEXTURE1);
        glBindTexture(GL_TEXTURE_2D, texture2);

        // 도형에 텍스처 렌더
        ourShader.use();

        // ---------- [ 5. 3D 변환 ] ----------

        // 모델 행렬
        glm::mat4 model = glm::mat4(1.0f);
        model = glm::rotate(model, glm::radians(-55.0f), glm::vec3(1.0f, 0.0f, 0.0f));

        // 뷰 행렬
        glm::mat4 view = glm::mat4(1.0f);
        view = glm::translate(view, glm::vec3(0.0f, 0.0f, -3.0f));

        // 투영 행렬
        glm::mat4 projection = glm::mat4(1.0f);
        projection = glm::perspective(glm::radians(45.0f), (float)SCR_WIDTH / (float)SCR_HEIGHT, 0.1f, 100.0f);

        // pass them to the shaders
        unsigned int modelLoc = glGetUniformLocation(ourShader.ID, "model");
        unsigned int viewLoc = glGetUniformLocation(ourShader.ID, "view");
        unsigned int projectionLoc = glGetUniformLocation(ourShader.ID, "projection");

        glUniformMatrix4fv(modelLoc, 1, GL_FALSE, glm::value_ptr(model));
        glUniformMatrix4fv(viewLoc, 1, GL_FALSE, glm::value_ptr(view));
        glUniformMatrix4fv(projectionLoc, 1, GL_FALSE, glm::value_ptr(projection));

        // 변환 행렬을 이용해 변환된 정점들을 그린다
        glBindVertexArray(VAO);
        glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_INT, 0);

        // 프론트, 백 버퍼 교체
        glfwSwapBuffers(window);

        // 이벤트 처리
        glfwPollEvents();
    }

    // VAO, VBO, EBO 메모리 해제
    glDeleteVertexArrays(1, &VAO);
    glDeleteBuffers(1, &VBO);
    glDeleteBuffers(1, &EBO);

    // 사용된 리소스 해제, 초기화 및 정리 작업
    glfwTerminate();
    return 0;
}

// 입력 처리 함수
void processInput(GLFWwindow* window)
{
    // ESC가 눌리면 윈도우 닫기
    if (glfwGetKey(window, GLFW_KEY_ESCAPE) == GLFW_PRESS)
    {
        glfwSetWindowShouldClose(window, true);
    }

    if (glfwGetKey(window, GLFW_KEY_UP) == GLFW_PRESS)
    {
        mixPercent += 0.05f;
    }

    if (glfwGetKey(window, GLFW_KEY_DOWN) == GLFW_PRESS)
    {
        mixPercent -= 0.05f;
    }
}

// 윈도우 사이즈 변경 시 호출될 콜백 함수
void framebuffer_size_callback(GLFWwindow* window, int width, int height)
{
    glViewport(0, 0, width, height);
}

 

- 링크

https://learnopengl.com/code_viewer_gh.php?code=src/1.getting_started/6.1.coordinate_systems/coordinate_systems.cpp