OpenGL渲染器04_绘制点线面

// 版本申明
#version 330 core
// 输入 a_position，类型是vec3,location是指定变量的位置，每个变量的location不能相同。
// vec3 拥有3个分量的向量；同理，vec4就是拥有4个分量 ...
layout (location = 0) in vec3 a_position;

void main()
{
    // gl_Position 是OpenGL内部变量，就是输入该顶点的位置
    gl_Position = vec4(aPos.x, aPos.y, aPos.z, 1.0);
}

for(Vertex v : vetices){
	// 顶点处理
	v.postion = ?;
    v.color=?;
    v.textcoord=?;
    //... 都是对 v 的属性的一些更新
}

// 版本申明
#version 330 core
// 输出变量，片元颜色值
out vec4 FragColor;

void main()
{
    // RGBA 颜色空间颜色值
    FragColor = vec4(1.0f, 0.0f, 0.0f, 1.0f);
} 

#version 330 core
// 定义了两个输入型变量
layout (location = 0) in vec2 a_position; // 位置
layout (location = 1) in vec4 a_color; // 颜色 ...
out vec4 v_color;

void main(){
	gl_Position = vec4(a_position, 0, 1);
	v_color = a_color;
}

#version 330 core
in vec4 v_color; // 注意这个变量名跟顶点着色器的输出变量一致，这样就可以拿到传输过来的值
out vec4 FragColor;
void main(){
   FragColor = v_color; //将顶点的颜色值作为像素颜色值
}

// 1. 初始化着色器， 目前添加两个，一个顶点着色器，一个是片元着色器
const char* vsSource = "#version 330 core\n"
                       "layout (location = 0) in vec2 a_position;\n" // 位置
                       "layout (location = 1) in vec4 a_color;\n" // 颜色 ...
                       "out vec4 v_color;\n"
                       "void main(){\n"
                       "  gl_Position = vec4(a_position, 0, 1);\n"
                       "  v_color = a_color;\n"
                       "}";
const char* fsSource = "#version 330 core\n"
                       "in vec4 v_color;\n"
                       "out vec4 FragColor;\n"
                       "void main(){\n"
                       "    FragColor = v_color;\n"
                       "}";


/**
 * 通过顶点着色器和片元着色器获得着色器程序program
 * @param vsSource 顶点着色器源码
 * @param fsSource 片元着色器源码
 */
GLuint getProgramFromShaderSource(const char* vsSource, const char* fsSource) {
    GLuint vs = compileShader(vsSource, GL_VERTEX_SHADER);
    GLuint fs = compileShader(fsSource, GL_FRAGMENT_SHADER);

    GLuint program = glCreateProgram();
    int bLinkSuc;
    int logLen = 512;
    char infoLog[512];

    glAttachShader(program, vs);
    glAttachShader(program, fs);
    glLinkProgram(program);
    glGetProgramiv(program, GL_LINK_STATUS, &bLinkSuc);

    if(!bLinkSuc){
        glGetProgramInfoLog(program, logLen, NULL, infoLog);
        std::cout << infoLog << std::endl;
        assert(0);
    }

    glDeleteShader(vs);
    glDeleteShader(fs);
    return program;
}

/**
 * 编译着色器
 * @param src 着色器源码
 * @param type GL_VERTEX_SHADER,GL_FRAGMENT_SHADER,GL_GEOMETRY_SHADER
 */
GLuint compileShader(const char* src, GLenum type) {
    int bCompileSuc;
    int logLen = 512;
    char infoLog[512];

    GLuint vs = glCreateShader(type);
    glShaderSource(vs, 1, &src, NULL);
    glCompileShader(vs);
    glGetShaderiv(vs, GL_COMPILE_STATUS, &bCompileSuc);
    if(!bCompileSuc){
        glGetShaderInfoLog(vs, logLen, NULL, infoLog);
        std::cout << infoLog << std::endl;
        assert(0);
    }
    return vs;
}

//2. 准备顶点属性数据； (1) 位置、 (2) 颜色
// 如何表示一个顶点数据? 在计算机层面如何存储。 Point(x, y)， 笛卡尔坐标系方式，来确认出一个点的位置。存储使用数据存储
float vertexPos[] = {
        0.0f, 0.5f, //第一个顶点
        0.0f, 0.0f, //第二个顶点
        0.5f, 0.0f, //第三个顶点
};
// 如何表示颜色数据：RGB色彩空间、HSV色彩空间... 这里采用RGB，然后加一个A表示透明度
float vertexColor[] = {
        1.0f, 0.0f, 0.0f, 1.0f, //红色
        0.0f, 1.0f, 0.0f, 1.0f, //绿色
        1.0f, 1.0f, 0.0f, 1.0f, //黄色
};

//... 准备顶点属性数据的地方省略，就是上边的两个float数组
//1. 创建顶点属性缓冲对象:两个缓冲对象，坐标和颜色
GLuint vbo[2];
glGenBuffers(2, vbo);

//2.设置值
glBindBuffer(GL_ARRAY_BUFFER, vbo[0]); //GL_ARRAY_BUFFER 缓冲区类型，使用缓冲之前一定要先绑定
glBufferData(GL_ARRAY_BUFFER, sizeof(vertexPos), vertexPos, GL_STATIC_DRAW); //将坐标数据放进缓冲
// 拿到着色器中申明的变量地址location. glsl中的：layout (location = 0) in vec2 a_position;重点就是这里
GLuint  loc = glGetAttribLocation(program, "a_position"); 
//3.开启属性
glEnableVertexAttribArray(loc);
//4.设置属性值的规则：
// GLuint index 属性的location
// GLint size 构成每个属性的分量个数：比如我们定的坐标只有x,y两个分量，这里就是2。到了三维阶段，我们需要定义x,y,z，值就是3
// GLenum type 构成每个属性的分量数据类型，我们定义了float数组，对应OpenGL中则是GL_FLOAT枚举
// GLboolean normalized 是否标准化，如果为true, 向量的标准化。详细后边写向量的地方会涉及这个点
// GLsizei stride 步长，加入我们在一个数组中放很多属性，步长就是顶点属性组之间的间隔。 learn-opengl.io网站描述的比较详细。因为我们把每个属性都分开VBO了，这里都是0
// const void *pointer 起始偏移值
glVertexAttribPointer(loc, 2, GL_FLOAT, false, 0, (void*) 0);

//颜色VBO同上
glBindBuffer(GL_ARRAY_BUFFER, vbo[1]);
glBufferData(GL_ARRAY_BUFFER, sizeof(vertexColor), vertexColor, GL_STATIC_DRAW);
loc = glGetAttribLocation(program, "a_color");
glEnableVertexAttribArray(loc);
glVertexAttribPointer(loc, 4, GL_FLOAT, false, 0, (void*) 0);

// 创建顶点数组
GLuint vao;
glGenVertexArrays(1, &vao);
//绑定顶点数组
glBindVertexArray(vao);
// ...在此处进行VBO的创建、设置值和规则配置。
// GLuint vbo[2];
// glGenBuffers(2, vbo);
// ...
// ...
// glVertexAttribPointer(loc, 2, GL_FLOAT, false, 0, (void*) 0);

//接触绑定，一般在上边Bind,结束就解除，绑定到0就是解除，因为每个VAO都是大于0的
glBindVertexArray(0);

// 应用着色器程序
glUseProgram(program);
// 绑定顶点数组对象 VAO
glBindVertexArray(vao);
glPointSize(5.0f); //点的像素大小，只有绘制点时候有用。
//绘制
// GLenum mode 模式 GL_POINTS点
// GLint first 起始索引，三个顶点都要绘制，所以起始是0
// GLsizei count 绘制总数，三个顶点，所以是3
glDrawArrays(GL_POINTS, 0, 3);
glBindVertexArray(0);

// 定义当前绘制模式
static GLuint currentMode = GL_POINTS;//默认点模式绘制

 // 列出所有的绘制模式，因为ImGui的选择空间Combo只支持字符串作为预览值，所以这里额外顶一个数组。
 const GLuint modelItems[] = {GL_POINTS, GL_LINES, GL_LINE_STRIP, GL_LINE_LOOP, GL_TRIANGLES, GL_TRIANGLE_STRIP, GL_TRIANGLE_FAN};
 // 展示选择框的文字，比如 GL_POINTS可以写作“点”（注意，这里中文可能会乱码，需要选择正确的字体格式才可以，后续会写）
 const char* previewText[] = {"GL_POINTS", "GL_LINES", "GL_LINE_STRIP", "GL_LINE_LOOP", "GL_TRIANGLES", "GL_TRIANGLE_STRIP", "GL_TRIANGLE_FAN" };
 static int item_current_idx = currentMode;
 const char* combo_preview_value = previewText[item_current_idx];
 if (ImGui::BeginCombo("Draw Mode", combo_preview_value))
 {
     // 循环定义选择框选项
     for (int n = 0; n < IM_ARRAYSIZE(previewText); n++)
     {
         const bool is_selected = (item_current_idx == n);
         if (ImGui::Selectable(previewText[n], is_selected))
             item_current_idx = n;
         if (is_selected)
             ImGui::SetItemDefaultFocus();
             // 赋值
             currentMode = modelItems[item_current_idx];
     }
     ImGui::EndCombo();
 }

//... BindVertexArray(vao)..
//...

//绘制
glDrawArrays(currentMode, 0, 3);
//...glBindVertexArray(0);
//...

float vertexPos[] = {
        0.0f, 0.5f, //第一个顶点
        0.0f, 0.0f, //第二个顶点
        0.5f, 0.0f, //第三个顶点
    
        0.0f, 0.5f, //第一个顶点
        0.5f, 0.0f, //第二个顶点
        0.5f, 0.5f, //第三个顶点
};

float vertexColor[] = {
        1.0f, 0.0f, 0.0f, 1.0f, //红色
        0.0f, 1.0f, 0.0f, 1.0f, //绿色
        1.0f, 1.0f, 0.0f, 1.0f, //黄色
        1.0f, 0.0f, 0.0f, 1.0f, //红色
        1.0f, 1.0f, 0.0f, 1.0f, //黄色
        0.0f, 1.0f, 1.0f, 1.0f, //
};

 glDrawArrays(currentMode, 0, 6); //3->6;currentMode选择GL_TRIANGLES

//第一个三角形
0.0f, 0.5f, //第一个顶点
0.5f, 0.0f, //第三个顶点

//第二个三角形
0.0f, 0.5f, //第一个顶点
0.5f, 0.0f, //第二个顶点

// 顶点
float vertexPos[] = {
        0.0f, 0.5f, //第一个顶点
        0.0f, 0.0f, //第二个顶点
        0.5f, 0.0f, //第三个顶点
        0.5f, 0.5f, //第四个顶点
};

// 索引
int indices[] = {
        0, 1, 2,
        0, 2, 3
};

//... VAO...
//... VBO...

GLuint ebo;
glGenBuffers(1, &ebo);
glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ebo);
glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);
// 5.解除绑定
glBindVertexArray(0);

/**
 * 渲染场景
 */
void renderScene() {
    // 应用着色器程序
    glUseProgram(program);
    // 绑定顶点数组对象 VAO
    glBindVertexArray(vao);
    // 绑定EBO
    glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, ebo);
    glPointSize(5.0f);

    //绘制
    // 6：索引数量
    glDrawElements(currentMode, 6, GL_UNSIGNED_INT, 0);
    glBindVertexArray(0);
}

// 顶点
float vertexPos[] = {
        0.0f, 0.5f, 
    	0.5f, 0.5f, 
        0.5f, 0.0f, 
        0.0f, 0.0f, 
};
// ...