著色器(Shader)是運行在GPU上的小程序。這些小程序為圖形渲染管線的某個特定部分而運行。

// 頂點著色器 #version 330 core // 0號欄位讀取頂點坐標 layout (location = 0) in vec3 aPos; //1號欄位讀取顏色顏色 layout (location = 1) in vec3 aColor; // 輸出給 片段著色器 out vec4 vertexColor; void main() { // gl_Position 是固定的名稱 用來保存 頂點坐標的gl_Position = vec4(aPos.x, aPos.y, aPos.z, 1.0); vertexColor = vec4(aColor.x,aColor.y,aColor.z,1.0); }// 片段著色器 #version 330 core // 輸出一個 vec4類型的變量 out vec4 FragColor; // 從cpu中讀取 uniform vec4 outColor; //從頂點著色器中獲得 in vec4 vertexColor; void main() { FragColor = vertexColor; }

詳細的著色器內容查看文檔

多元色四邊形
效果

代碼

#define GLEW_STATIC // 這個一定要加不然報錯 靜態鏈接庫 #include<iostream> #include<GL/glew.h> #include<GLFW/glfw3.h> using namespace std; void processInput(GLFWwindow); void processInput(GLFWwindow* window) {//如果鍵盤輸入esc 則觸發 退出if (glfwGetKey(window, GLFW_KEY_ESCAPE) == GLFW_PRESS) {// 設置 要求退出glfwSetWindowShouldClose(window, true);} } // 逆時針方向繪制 默認情況下，逆時針的頂點連接順序被定義為三角形的正 // 逆時針或順時針都是相對于觀察者方向的 float vertices[] {-0.5f, 0.5f, 0.0f, 1.0f, 0,0, // 左上角 0 0.5f, -0.5f, 0.0f, 0,1.0f,0, // 右下角 10.5f, 0.5f, 0.0f, 0,0,1.0f, // 右上角 2// 第二個三角形//0.5f, -0.5f, 0.0f, // 右下角-0.5f, -0.5f, 0.0f , 1.0f,0,1.0f // 左下角 3//-0.5f, 0.5f, 0.0f // 左上角 }; // 使用索引來減小畫點的開銷 (未用索引緩沖對象時,每個點都需要畫一次(即使重復了)) unsigned int indices[] {0,1,2, //第一個三角形的索引1,3,0 //第二個三角形的索引 }; // 頂點著色器 輸出一個變量 給 片段著色器 // out vec4 vertexColor;輸出 // in vec4 vertexColor; 輸入// 我們可以使用 uniform 給頂點著色器輸入變量 從cpu中讀取 cpu -->gpu const char* vertexShaderSource = "#version 330 core \n" // 0號欄位讀取頂點坐標 "layout (location = 0) in vec3 aPos; \n" //1號欄位讀取顏色顏色 "layout (location = 1) in vec3 aColor; " "out vec4 vertexColor; \n" "void main() \n" "{ \n"// gl_Position 是固定的名稱 用來保存 頂點坐標的 " gl_Position = vec4(aPos.x, aPos.y, aPos.z, 1.0); \n" " vertexColor = vec4(aColor.x,aColor.y,aColor.z,1.0); \n" "} \n"; const char* fragmentShaderSource = "#version 330 core \n" "out vec4 FragColor; \n" "uniform vec4 outColor; \n" "in vec4 vertexColor; \n" "void main() \n" "{ \n" " FragColor = vertexColor; \n" "} \n";int main() {// 初始化GLFWglfwInit();// 提示 我們使用的版本是3.3// 主版本glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);// 次版本glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);// 簡介glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);// 創建一個窗口對象GLFWwindow* window = glfwCreateWindow(800, 600, "Test window", NULL, NULL);if (window == NULL) {cout << "open window failed." << endl;// 終止 glfwglfwTerminate();}// 綁定window到上下文對象 創建完窗口我們就可以通知GLFW將我們窗口的上下文設置為當前線程的主上下文了glfwMakeContextCurrent(window);glewExperimental = true;// GLEW_OK 0//init GLEWif (glewInit() != GLEW_OK) {cout << "glew init failed." << endl;// 終止 glfwglfwTerminate();return -1;}// OpenGL渲染窗口的尺寸大小 // glViewport函數前兩個參數控制窗口左下角的位置。第三個和第四個參數控制渲染窗口的寬度和高度（像素）glViewport(0, 0, 800, 600);// 設置剔除 （opegl默認正面背面都顯示（不剔除））//glEnable(GL_CULL_FACE);// 剔除背面 GL_BACK 剔除正面 GL_FRONT//glCullFace(GL_BACK);// 線框模式 //第一個參數表示我們打算將其應用到所有的三角形的正面和背面，第二個參數告訴我們用線來繪制//glPolygonMode(GL_FRONT_AND_BACK, GL_LINE);//VAO對象unsigned int VAO;// 生成一個VAO對象 這個方法可以生成多個 由第一個參數決定glGenVertexArrays(1, &VAO);// 綁定 VAOglBindVertexArray(VAO);unsigned int VBO; //如果多個可以用 VBO[]數組 這個方法可以生成多個 由第一個參數決定glGenBuffers(1, &VBO);//將新創建的緩沖綁定到 GL_ARRAY_BUFFER目標上glBindBuffer(GL_ARRAY_BUFFER, VBO);// glBufferData 是一個專門用來把用戶定義的數據復制到當前綁定緩沖的函數// GL_STATIC_DRAW 數據不會或幾乎不會改變。glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);unsigned int EBO;glGenBuffers(1, &EBO);glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, EBO);glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);// 頂點著色器unsigned int vertexShader;// 創建這個著色器vertexShader = glCreateShader(GL_VERTEX_SHADER);glShaderSource(vertexShader, 1, &vertexShaderSource, NULL);// 編譯glCompileShader(vertexShader);// 片段著色器unsigned int fragmentShader;// 創建這個著色器fragmentShader = glCreateShader(GL_FRAGMENT_SHADER);glShaderSource(fragmentShader, 1, &fragmentShaderSource, NULL);// 編譯glCompileShader(fragmentShader);// 著色器程序 是將多個著色器合并之后并最終鏈接完成的版本unsigned int shaderProgram;// 創建一個著色器程序對象shaderProgram = glCreateProgram();// 將之前編譯的著色器附加到程序對象上glAttachShader(shaderProgram, vertexShader);glAttachShader(shaderProgram, fragmentShader);// 用glLinkProgram鏈接它們glLinkProgram(shaderProgram);// glVertexAttribPointer函數告訴OpenGL該如何解析頂點數據（應用到逐個頂點屬性上）// 從 0號欄位 開始 將數據每三個為一組 單位為float 每次跳6*float字節 偏移為0glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)0);// 以頂點屬性位置值作為參數，啟用頂點屬性；頂點屬性默認是禁用的//讀取到0號欄位上glEnableVertexAttribArray(0);// 讀取顏色屬性 從 1號欄位 開始 將數據每三個為一組 單位為float 每次跳6*float字節 偏移為3個floatglVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)(3*sizeof(float)));// 讀取到1號欄位上 glEnableVertexAttribArray(1);//渲染循環 ，它能在我們讓GLFW退出前一直保持運行。下面幾行的代碼就實現了一個簡單的渲染循環：//glfwWindowShouldClose 我們每次循環的開始前檢查一次GLFW是否被要求退出while (!glfwWindowShouldClose(window)) {//自定義事件 當鍵盤觸發esc 退出processInput(window);glClearColor(0.2, 0.3, 0.3, 1.0);// GL_COLOR_BUFFER_BIT 顏色，GL_DEPTH_BUFFER_BIT 深度 和 GL_STENCIL_BUFFER_BIT 模板// 清除前面的那一幀的顏色glClear(GL_COLOR_BUFFER_BIT);// 綁定 VAO glBindVertexArray(VAO);//通過glfwGetTime()獲取運行的秒數。//float timeValue = glfwGetTime();//然后我們使用sin函數讓顏色在0.0到1.0之間改變，最后將結果儲存到greenValue里。//float greenValue = (sin(timeValue) / 2.0f) + 0.5f;// 我們用glGetUniformLocation查詢uniform ourColor的位置值//int vertexColorlocation = glGetUniformLocation(shaderProgram, "outColor");// -1表示未找到// 使用著色器程序glUseProgram(shaderProgram);// glUniform4f函數設置uniform值 第一個參數是位置 后面幾個是rgb//glUniform4f(vertexColorlocation, 0, greenValue, 0, 1.0f);// 畫三角形 從0開始 繪制三個頂點 和VBO的頂點數據（通過VAO間接綁定）來繪制圖元//glDrawArrays(GL_TRIANGLES, 0, 6); 這個是不用索引畫的glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, EBO);//可以不需要這個 綁定VAO的同時也會自動綁定EBO//glDrawElements函數從當前綁定到GL_ELEMENT_ARRAY_BUFFER目標的EBO中獲取索引glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_INT, 0);//解綁VAOglBindVertexArray(0);glfwSwapBuffers(window);glfwPollEvents();}// 最后終止 glfwglfwTerminate();return 0; }

uniform

Uniform是一種從CPU中的應用向GPU中的著色器發送數據的方式，但uniform和頂點屬性有些不同。首先，uniform是全局的(Global)。全局意味著uniform變量必須在每個著色器程序對象中都是獨一無二的，而且它可以被著色器程序的任意著色器在任意階段訪問。第二，無論你把uniform值設置成什么，uniform會一直保存它們的數據，直到它們被重置或更新。

下面是使用uniform向著色器賦值

//通過glfwGetTime()獲取運行的秒數。 float timeValue = glfwGetTime(); //然后我們使用sin函數讓顏色在0.0到1.0之間改變，最后將結果儲存到greenValue里。 float greenValue = (sin(timeValue) / 2.0f) + 0.5f; // 我們用glGetUniformLocation查詢uniform ourColor的位置值 int vertexColorlocation = glGetUniformLocation(shaderProgram, "outColor");// -1表示未找到 // 使用著色器程序 glUseProgram(shaderProgram); // glUniform4f函數設置uniform值 第一個參數是位置 后面幾個是rgb glUniform4f(vertexColorlocation, 0, greenValue, 0, 1.0f);

總結

以上是生活随笔為你收集整理的OpenGL Sharders(着色器) 入门的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。