feat(OpenGL-hello): tex v1

OpenGL/hello/src/main.cpp

@@ -1,15 +1,17 @@
 #include "glad/glad.h"
 #include "shader.h"
+#include "stb_image.h"
 #include <GLFW/glfw3.h>
 #include <cmath>
+#include <iostream>
 
-// 三角形顶点
+// 四边形顶点
 float vertices[] = {
-    // 第一个三角形
-    0.4f, 0.4f, 0.0f,   // 右上角
-    0.4f, -0.4f, 0.0f,  // 右下角
-    -0.4f, -0.4f, 0.0f, // 左下角
-    -0.4f, 0.4f, 0.0f   // 左上角
+    //     ---- 位置 ----       ---- 颜色 ----     - 纹理坐标 -
+    0.5f,  0.5f,  0.0f, 1.0f, 0.0f, 0.0f, 1.0f, 1.0f, // 右上
+    0.5f,  -0.5f, 0.0f, 0.0f, 1.0f, 0.0f, 1.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, 1.0f  // 左上
 };
 
 // 索引
@@ -53,8 +55,32 @@ int main() {
   glfwSetFramebufferSizeCallback(window, framebuffer_size_callback);
 
   // 创建着色器程序
-  Shader shader = Shader("src/simple.vs", "src/uniformcolor.fs");
+  Shader shader = Shader("src/tex.vs", "src/tex.fs");
 
+  // 创建纹理
+  unsigned int texture;
+  glGenTextures(1, &texture);
+  glBindTexture(GL_TEXTURE_2D, texture);
+  // 设置纹理环绕方式
+  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
+  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
+  // 设置纹理过滤方式
+  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER,
+                  GL_LINEAR_MIPMAP_LINEAR);
+  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
+
+  // 加载并生成纹理
+  int width, height, nrChannels;
+  unsigned char *data =
+      stbi_load("resources/container.jpg", &width, &height, &nrChannels, 0);
+  if (data) {
+    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, width, height, 0, GL_RGB,
+                 GL_UNSIGNED_BYTE, data);
+    glGenerateMipmap(GL_TEXTURE_2D);
+  } else {
+    std::cout << "Failed to load texture" << std::endl;
+  }
+  stbi_image_free(data);
 
   unsigned int VAO, VBO, EBO;
   // 创建顶点数组对象
@@ -72,9 +98,17 @@ int main() {
   glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices,
                GL_STATIC_DRAW);
 
-  // 设置顶点属性指针
-  glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void *)0);
+  // 顶点属性
+  glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void *)0);
   glEnableVertexAttribArray(0);
+  // 颜色属性
+  glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float),
+                        (void *)(3 * sizeof(float)));
+  glEnableVertexAttribArray(1);
+  // 纹理坐标属性
+  glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, 8 * sizeof(float),
+                        (void *)(6 * sizeof(float)));
+  glEnableVertexAttribArray(2);
 
   // 循环渲染
   while (!glfwWindowShouldClose(window)) {
@@ -85,19 +119,14 @@ int main() {
     glClearColor(1.0f, 1.0f, 1.0f, 0.0f);
     glClear(GL_COLOR_BUFFER_BIT);
 
+    // 绑定纹理
+    glBindTexture(GL_TEXTURE_2D, texture);
+
     // 激活着色器
     shader.use();
 
-    // 更新uniform颜色
-    float timeValue = glfwGetTime();
-    float greenValue = (sin(timeValue) / 2.0f) + 0.5f;
-    shader.setFloat4("ourColor", 1.0f, greenValue, 0.0f, 0.0f);
-    shader.setFloat1("xOffset", cos(timeValue) / 2.0f);
-    shader.setFloat1("yOffset", sin(timeValue) / 2.0f);
-
     // 绘制三角形
     glBindVertexArray(VAO);
-    glPolygonMode(GL_FRONT_AND_BACK, GL_FILL);
     glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_INT, 0);
     glBindVertexArray(0);
 

OpenGL/hello/src/tex.fs

@@ -0,0 +1,12 @@
+#version 330 core
+out vec4 FragColor;
+
+in vec3 ourColor;
+in vec2 TexCoord;
+
+uniform sampler2D ourTexture;
+
+void main()
+{
+    FragColor = texture(ourTexture, TexCoord) * vec4(ourColor, 1.0);;
+}

OpenGL/hello/src/tex.vs

@@ -0,0 +1,14 @@
+#version 330 core
+layout (location = 0) in vec3 aPos;
+layout (location = 1) in vec3 aColor;
+layout (location = 2) in vec2 aTexCoord;
+
+out vec3 ourColor;
+out vec2 TexCoord;
+
+void main()
+{
+    gl_Position = vec4(aPos, 1.0);
+    ourColor = aColor;
+    TexCoord = aTexCoord;
+}