网站使用说明书模板,公司主页网站设计,wordpress首页错位,做手机app制作教程相关链接#xff1a; C OpenGL学习笔记#xff08;1、Hello World空窗口程序#xff09; C OpenGL学习笔记#xff08;2、绘制橙色三角形绘制、绿色随时间变化的三角形绘制#xff09; C OpenGL学习笔记#xff08;3、绘制彩色三角形、绘制彩色矩形#xff09;
通过前面…相关链接 C OpenGL学习笔记1、Hello World空窗口程序 C OpenGL学习笔记2、绘制橙色三角形绘制、绿色随时间变化的三角形绘制 C OpenGL学习笔记3、绘制彩色三角形、绘制彩色矩形
通过前面几章彩色三角形也可以画出来进行显示了。现在我有一张图片我想把图像显示绘制出来怎么操作。这里就需要openGL纹理绘制相关知识了最终效果如下图 目录 课前准备1、stb_image库2、测试图像下载3、其他事项 封装的文件及代码1、Base.h头文件2、ffimage类3、Shader类 纹理贴图代码相关修改及说明1、initTexture纹理初始化函数2、initModel函数vertexShader.glsl文件修改fragmentShader.glsl文件修改rend函数 主函数完整代码变形 课前准备
本节代码是基于上一节绘制彩色矩形代码基础上进行升级的。
1、stb_image库
因为要绘制图片至少需要打开图片等一些操作所以这里引入一个图片库stb_image库之所以引入这个库是因为它很简单这个库所有文件就一个点.h文件不会涉及很麻烦的编译过程网盘下载链接
通过网盘分享的文件stb_image.h
链接: https://pan.baidu.com/s/1S019c2jQqFnWxAvsZNvd1w?pwdcx6y 提取码: cx6y
--来自百度网盘超级会员v5的分享该库使用方法很简单在这个头文件中已经说了先要定义一个宏然后包含头文件即可如下图。
2、测试图像下载
wall.jpg网盘下载
通过网盘分享的文件wall.jpg
链接: https://pan.baidu.com/s/1L6m9_jOxVPCY_Xg5mWrBJg?pwdn2vr 提取码: n2vr
--来自百度网盘超级会员v5的分享直接另存为也可以
3、其他事项
因为代码慢慢多了起来这次代码中进行一些封装 1、将stb_image图像库封装在自定义的ffimage类中保留一个读入接口和图片的一些基础信息图片宽、高等信息 2、将Shader程序shaderProgram变量封装到自定义的Shader类中同时把初始化ShderinitShader函数放进去
封装的文件及代码
1、Base.h头文件
该头文件放入openGL基础的头文件另外放入了几个自定义结构体描述颜色信息、3维点信息、2维点信息 Base.h代码如下
#pragma once
//存放各种头文件#include glad/glad.h
#include GLFW/glfw3.h
#include iostream#include string
#include fstream
#include sstreamtypedef unsigned int uint;
typedef unsigned char byte;
struct ffRGBA
{//描述一个点的颜色信息byte m_r;byte m_g;byte m_b;byte m_a;ffRGBA(byte _r 255, byte _g 255, byte _b 255, byte _a 255){m_r _r;m_g _g;m_b _b;m_a _a;}};template typename T
struct tVec3 {//三维向量结构体T m_x;T m_y;T m_z;tVec3(T _x 0, T _y 0, T _z 0){m_x _x;m_y _y;m_z _z;}
};template typename T
struct tVec2 {//二维向量结构体T m_x;T m_y;tVec2(T _x 0, T _y 0){m_x _x;m_y _y;}
};
2、ffimage类
下载stb_image.h文件放入项目同级目录 ffimage.h代码如下
#pragma once
#include Base.hclass ffImage
{
private:int m_width;//图片宽int m_height;//图片高int m_picType;//图片数据类型ffRGBA * m_data;//图片Buffer信息
public:int getWidth() const { return m_width; }int getHeight() const { return m_height; }int getPicType() const { return m_picType; }ffRGBA* getData()const { return m_data; }ffRGBA getColor(int x, int y)const{if (x0 || xm_width - 1 || y0 || ym_height - 1){return ffRGBA(0,0,0,0);}return m_data[y*m_width x];}ffImage(int _width 0, int _height 0, int _picType 0, ffRGBA* _data NULL){m_width _width;m_height _height;m_picType _picType;int _sumSize m_width * m_height;if (_data _sumSize){m_data new ffRGBA[_sumSize];memcpy(m_data,_data,sizeof(ffRGBA)*_sumSize);}else{m_data NULL;}};~ffImage(){}public:static ffImage* readFromFile(const char* _fileName);//读入影像函数};ffimage.cpp代码如下
#include ffimage.h#define STB_IMAGE_IMPLEMENTATION//调用stb_image.h前需要进行这个宏定义
#include stb_image.hffImage * ffImage::readFromFile(const char * _fileName)
{int _picType 0;int _width 0;int _height 0;//stbimage读入的图像是反过来的上下颠倒stbi_set_flip_vertically_on_load(true);//读的时候给我颠倒回来unsigned char* bits stbi_load(_fileName, _width, _height, _picType, STBI_rgb_alpha);//按照8位RGBA读取ffImage* _image new ffImage(_width,_height,_picType,(ffRGBA*)bits);stbi_image_free(bits);return _image;
}
3、Shader类
主要封装Shader程序为m_shaderProgram变量和初始化Shader的函数 Shader.h文件代码如下
#pragma once
#include Base.h
class Shader
{
public:Shader(){m_shaderProgram 0;}~Shader() {}void initShader(const char* _vertexPath, const char* _fragPath);void start() {glUseProgram(m_shaderProgram);//启用m_shaderProgram}void end() {glUseProgram(0);//关闭m_shaderProgram}private:unsigned int m_shaderProgram;};Shader.cpp文件
#include Shader.hvoid Shader::initShader(const char * _vertexPath, const char * _fragPath)
{std::string _vertexCode();std::string _fragCode();std::ifstream _vShaderFile;std::ifstream _fShaderFile;_vShaderFile.exceptions(std::ifstream::failbit | std::ifstream::badbit);_fShaderFile.exceptions(std::ifstream::failbit | std::ifstream::badbit);try {_vShaderFile.open(_vertexPath);_fShaderFile.open(_fragPath);std::stringstream _vShaderStream, _fShaderStream;_vShaderStream _vShaderFile.rdbuf();_fShaderStream _fShaderFile.rdbuf();_vertexCode _vShaderStream.str();_fragCode _fShaderStream.str();}catch (std::ifstream::failure e) {std::string errStr rerad shader fail;std::cout errStr std::endl;}const char* _vShaderStr _vertexCode.c_str();const char* _fShaderStr _fragCode.c_str();//shader的编译链接unsigned int _vertexID 0, _fragID 0;char _infoLog[512];//存储错误信息int _successFlag 0;//是否成功//编译_vertexID glCreateShader(GL_VERTEX_SHADER);//编译的是VERTEX类型glShaderSource(_vertexID, 1, _vShaderStr, NULL);//把代码传过去glCompileShader(_vertexID);//编译glGetShaderiv(_vertexID, GL_COMPILE_STATUS, _successFlag);//获取编译情况如何if (!_successFlag) {//如果编译不成功glGetShaderInfoLog(_vertexID, 512, NULL, _infoLog);std::string errStr(_infoLog);std::cout errStr std::endl;}//frag shader _fragID glCreateShader(GL_FRAGMENT_SHADER);//编译的是FRAGMENT类型glShaderSource(_fragID, 1, _fShaderStr, NULL);//把代码传过去glCompileShader(_fragID);//编译glGetShaderiv(_fragID, GL_COMPILE_STATUS, _successFlag);//获取编译情况如何if (!_successFlag) {//如果编译不成功glGetShaderInfoLog(_fragID, 512, NULL, _infoLog);std::string errStr(_infoLog);std::cout errStr std::endl;}//链接m_shaderProgram glCreateProgram();glAttachShader(m_shaderProgram, _vertexID);//向program好的加入编译好的glAttachShader(m_shaderProgram, _fragID);//向program好的加入glLinkProgram(m_shaderProgram);//开始链接//检查链接是否成功glGetProgramiv(m_shaderProgram, GL_LINK_STATUS, _successFlag);if (!_successFlag) {//如果链接不成功glGetProgramInfoLog(m_shaderProgram, 512, NULL, _infoLog);std::string errStr(_infoLog);std::cout errStr std::endl;}//释放glDeleteShader(_vertexID);glDeleteShader(_fragID);}
纹理贴图代码相关修改及说明
再次说明本节代码是基于上一节绘制彩色矩形代码基础上进行升级的。
主要变化 1、增加纹理全局变量纹理初始化函数initTexture 2、initModel()函数该函数里面需要增加纹理位置信息 3、修改Shader相关代码
1、initTexture纹理初始化函数
1、该函数在主程序初始化模型下面增加该函数入口
2、定义全局变量 3、initTexture函数代码
void initTexture()
{//初始化纹理贴图,构建完成全局变量_texture对象_pImage ffImage::readFromFile(wall.jpg);//同级目录下准备了一张图片glGenTextures(1, _texture);//新建一个textureglBindTexture(GL_TEXTURE_2D,_texture);//绑定texture纹理类型为GL_TEXTURE_2D//设置纹理属性glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_WRAP_S,GL_REPEAT);//设置S方向填充方式为重复REPEAT方式glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_WRAP_T,GL_REPEAT);//设置T方向填充方式为重复REPEAT方式glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_NEAREST);//设置图像缩小时候采样方式为NEAREST最近邻方式glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_LINEAR);//设置图像放大时候采样方式为LINEAR双线性方式//读入图像数据glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, _pImage-getWidth(), _pImage-getHeight(),0,GL_RGBA,GL_UNSIGNED_BYTE, _pImage-getData());}
2、initModel函数
1、修改变量vertices要引入纹理贴的顶点位置。引入后每行顶点坐标含义前三个点位置坐标、中间三个颜色信息每行最后两位为纹理坐标位置(u、v) 2、修改锚点0、锚点1的步长信息新增锚点2为纹理坐标信息最后启动锚点2
void initModel()
{//构建模型在模型数据发送GPUVAO,VBO 在这里完成的//带颜色信息的顶点0.0是黑色1.0是白色,下面三个点分别设置红、绿、蓝//float vertices[] {//-0.5f,-0.5f,0.0f, 1.0f,0.0f,0.0f,//0.5,-0.5,0.0f, 0.0f,1.0f,0.0f,//0.0f,0.5f,0.0f,0.0f,0.0f,1.0f,//};//带纹理坐标、带颜色信息的顶点每行最后两位为纹理坐标位置(u、v)float vertices[] {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, 0.0f,1.0f,0.0f, 0.0f,1.0f,};unsigned int indices[] {0,1,3,1,2,3};glGenVertexArrays(1, VAO);//创建1个VAOglBindVertexArray(VAO);//绑定VAOunsigned int EBO 0;//这个容器绑定角点和indexglGenBuffers(1, EBO);glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, EBO);glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);//下面初始化VBO下面的VBO就属于VAO的管理范围以后绘图直接使用VAO即可glGenBuffers(1, VBO);//可以同时获取多个VBO的indexglBindBuffer(GL_ARRAY_BUFFER, VBO);//绑定VBOglBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);//给GL_ARRAY_BUFFER分配空间第二个参数分配多大的空间第三个参数从哪里开始读取数据第四个参数告诉openGL怎么使用这个数据//下面做锚定点//glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0);//每个顶点包含3个坐标每个坐标都是float类型不进行正则化步长3 * sizeof(float)增加颜色信息修改锚定//glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)0);//0代表顶点信息每个顶点包含3个坐标每个坐标都是float类型不进行正则化步长6 * sizeof(float),顶点起始点是从0开始所以(void*)0//glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)(3 * sizeof(float)));//1代表颜色信息每个顶点包含3个坐标每个坐标都是float类型不进行正则化步长6 * sizeof(float),颜色起始点是从3开始所以3*sizeof(float)//增加纹理信息和颜色信息修改锚定glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)0);//顶点步长改成了8glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(3 * sizeof(float)));//颜色步长改成了8glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(6 * sizeof(float)));//新建2号锚点该锚点是连续读取2个数据最后的起始位置是6所以最后一个是(void*)(6 * sizeof(float))glEnableVertexAttribArray(0);//启动0这个锚定点弄顶点glEnableVertexAttribArray(1);//启动1这个锚定点弄颜色glEnableVertexAttribArray(2);//启动2这个锚定点弄纹理glBindBuffer(GL_ARRAY_BUFFER, 0);//给VBO解绑glBindVertexArray(0);//给VAO解绑}vertexShader.glsl文件修改
initModel函数新增了锚点2所以顶点Shader文件需要进行相关变化
#version 330 core
layout(location 0) in vec3 aPos;//layout为0是位置顶点信息
layout(location 1) in vec3 aColor;//layout为1是颜色信息
layout(location 2) in vec2 aUV;//layout为2是纹理位置UV坐标
out vec4 outColor;//下一步输出变量
out vec2 outUV;//纹理位置void main()
{/*gl_Position 是opengl内置全局变量该变量会在后面进行调用*/gl_Position vec4(aPos.x,aPos.y,aPos.z,1.0);//outColor vec4(aColor.x, aColor.y, aColor.z, 1.0);outColor vec4(aColor, 1.0);outUV aUV;//把纹理位置信息增加到管线中};
fragmentShader.glsl文件修改
在上一步顶点管线中新增了纹理位置输出所以在渲染管线中要新增该变量
#version 330 core
out vec4 FragColor;in vec4 outColor;//从vertexShader.glsl文件过来的变量要求变量名也一致
in vec2 outUV;//上个管线输入的变量uniform sampler2D ourTexture;//内置的数据类型sampler2D专门描述纹理的。如果C外部不传入ourTexture这个变量则它默认为0void main()
{//FragColor vec4(1.0f, 0.5f, 0.2f, 1.0f);//FragColor outColor;FragColor texture(ourTexture, outUV);//内置函数texture函数从outUV位置上取纹理ourTexture的颜色值给FragColor 方案1直接取出纹理颜色值};rend函数
该函数还是用绘制矩形的那个函数没有变化
void rend()
{//渲染函数//每次循环都会调用该函数,直接进行渲染glBindTexture(GL_TEXTURE_2D, _texture);//绘制前绑定纹理_shader.start();glBindVertexArray(VAO);//使用VAO方式进行绘制//glDrawArrays(GL_TRIANGLES, 0, 3);//绘制从第0个开始画起作用的是3个glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_INT, 0);//绘制EBO元素6个索引_shader.end();
}
主函数完整代码
其他几个函数完整代码都贴出来了的包含下图文件
这里只贴出主程序文件所有代码main.cpp /*
三角形绘制基础代码
在这节课介绍三角形绘制的基础方法也会涉及到基础的shader调用其中最关键的概念是
VAO、VBO在OpenGL核心模式下的使用及内涵
也会做一个小小的程序结构让大家方便今后的架构慢慢改进先对vertexShader.glsl 进行顶点变换,再传入fragmentShader.glsl里面插值1、获取VBO的index
2、绑定VBO的index
3、给VBO分配显存空间传输数据
4、告诉shader数据解析方式
5、激活锚点//本节内容
1、纹理贴图做准备
2、进一步封装类
3、引入stb_image库该库只有一个stb_image.h头文件*/
#include Base.h
#include Shader.h
#include ffimage.hShader _shader;unsigned int VAO 0;
unsigned int VBO 0;unsigned int _texture 0;//纹理
ffImage* _pImage NULL;//纹理贴图影像void rend()
{//渲染函数//每次循环都会调用该函数,直接进行渲染glBindTexture(GL_TEXTURE_2D, _texture);//绘制前绑定纹理_shader.start();glBindVertexArray(VAO);//使用VAO方式进行绘制//glDrawArrays(GL_TRIANGLES, 0, 3);//绘制从第0个开始画起作用的是3个glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_INT, 0);//绘制EBO元素6个索引_shader.end();
}void initModel()
{//构建模型在模型数据发送GPUVAO,VBO 在这里完成的//带颜色信息的顶点0.0是黑色1.0是白色,下面三个点分别设置红、绿、蓝//float vertices[] {//-0.5f,-0.5f,0.0f, 1.0f,0.0f,0.0f,//0.5,-0.5,0.0f, 0.0f,1.0f,0.0f,//0.0f,0.5f,0.0f,0.0f,0.0f,1.0f,//};//带纹理坐标、带颜色信息的顶点每行最后两位为纹理坐标位置(u、v)float vertices[] {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, 0.0f,1.0f,0.0f, 0.0f,1.0f,};unsigned int indices[] {0,1,3,1,2,3};glGenVertexArrays(1, VAO);//创建1个VAOglBindVertexArray(VAO);//绑定VAOunsigned int EBO 0;//这个容器绑定角点和indexglGenBuffers(1, EBO);glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, EBO);glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);//下面初始化VBO下面的VBO就属于VAO的管理范围以后绘图直接使用VAO即可glGenBuffers(1, VBO);//可以同时获取多个VBO的indexglBindBuffer(GL_ARRAY_BUFFER, VBO);//绑定VBOglBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);//给GL_ARRAY_BUFFER分配空间第二个参数分配多大的空间第三个参数从哪里开始读取数据第四个参数告诉openGL怎么使用这个数据//下面做锚定点//glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0);//每个顶点包含3个坐标每个坐标都是float类型不进行正则化步长3 * sizeof(float)增加颜色信息修改锚定//glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)0);//0代表顶点信息每个顶点包含3个坐标每个坐标都是float类型不进行正则化步长6 * sizeof(float),顶点起始点是从0开始所以(void*)0//glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)(3 * sizeof(float)));//1代表颜色信息每个顶点包含3个坐标每个坐标都是float类型不进行正则化步长6 * sizeof(float),颜色起始点是从3开始所以3*sizeof(float)//增加纹理信息和颜色信息修改锚定glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)0);//顶点步长改成了8glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(3 * sizeof(float)));//颜色步长改成了8glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(6 * sizeof(float)));//新建2号锚点该锚点是连续读取2个数据最后的起始位置是6所以最后一个是(void*)(6 * sizeof(float))glEnableVertexAttribArray(0);//启动0这个锚定点弄顶点glEnableVertexAttribArray(1);//启动1这个锚定点弄颜色glEnableVertexAttribArray(2);//启动2这个锚定点弄纹理glBindBuffer(GL_ARRAY_BUFFER, 0);//给VBO解绑glBindVertexArray(0);//给VAO解绑}void initTexture()
{//初始化纹理贴图,构建完成全局变量_texture对象_pImage ffImage::readFromFile(wall.jpg);//同级目录下准备了一张图片glGenTextures(1, _texture);//新建一个textureglBindTexture(GL_TEXTURE_2D,_texture);//绑定texture纹理类型为GL_TEXTURE_2D//设置纹理属性glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_WRAP_S,GL_REPEAT);//设置S方向填充方式为重复REPEAT方式glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_WRAP_T,GL_REPEAT);//设置T方向填充方式为重复REPEAT方式glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_NEAREST);//设置图像缩小时候采样方式为NEAREST最近邻方式glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_LINEAR);//设置图像放大时候采样方式为LINEAR双线性方式//读入图像数据glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, _pImage-getWidth(), _pImage-getHeight(),0,GL_RGBA,GL_UNSIGNED_BYTE, _pImage-getData());}void initShader(const char* _vertexPath, const char* _fragPath)
{//shader写出来编译出来_shader.initShader(_vertexPath, _fragPath);}void framebuffer_size_callback(GLFWwindow* window, int width, int height)
{glViewport(0, 0, width, height);
}void processInput(GLFWwindow *window)
{//检测是否有外部输入if (glfwGetKey(window, GLFW_KEY_ESCAPE) GLFW_PRESS){glfwSetWindowShouldClose(window, true);//把关闭状态设置为true}
}int main()
{glfwInit();//初始化上下文环境glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);//要求opengl 3版本以上glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);//设置CORE模式只能用VAO绘制GLFWwindow* window glfwCreateWindow(800, 600, OpenGL Core, NULL, NULL);//创建窗体if (window NULL){std::cout Failed to create GLFW window std::endl;glfwTerminate();return -1;}glfwMakeContextCurrent(window);//上下文绑定窗体if (!gladLoadGLLoader((GLADloadproc)glfwGetProcAddress))//初始化函数指针为下面函数做准备{std::cout Failed to initialize GLAD std::endl;return -1;}glViewport(0, 0, 800, 600);//设置需要渲染的视口glfwSetFramebufferSizeCallback(window, framebuffer_size_callback);//设置回调函数initModel();//初始化模型initTexture();//调取读纹理函数initShader(vertexShader.glsl, fragmentShader.glsl);while (!glfwWindowShouldClose(window))//创建的window关掉后就退出while循环{processInput(window);//glClearColor(0.2f, 0.3f, 0.3f, 1.0f);//设置颜色glClear(GL_COLOR_BUFFER_BIT);//用设置的颜色把画布进行清零掉rend();glfwSwapBuffers(window);glfwPollEvents();}glfwTerminate();std::cout Hello World!\n;return 0;
}
变形
因为每个顶点的颜色信息还进行了保留如果在fragmentShader.glsl文件中的核心代码进行相关变形就会得到一个彩色的纹理图像
#version 330 core
out vec4 FragColor;in vec4 outColor;//从vertexShader.glsl文件过来的变量要求变量名也一致
in vec2 outUV;uniform sampler2D ourTexture;//内置的数据类型sampler2D专门描述纹理的。如果C外部不传入ourTexture这个变量则它默认为0void main()
{FragColor texture(ourTexture, outUV)*outColor;//方案2纹理像素和原来彩色进行相乘进行颜色混合};输出效果