OpenGL(5)Texture - 两张图片

为了能够让笑脸图片重叠到箱子图片上做如下修改:

  • fragmentSource.txt
#version 330 core          
in vec4 vertexColor;    
in vec2 TexCoord;

uniform sampler2D ourTexture;
uniform sampler2D ourFace;   //加入第二张图片


out vec4 FragColor;     
void main(){           
// FragColor = vertexColor;
   FragColor = texture(ourTexture,TexCoord) * texture(ourFace,TexCoord);//混合重叠
	
 } 
  • main.cpp

绑定纹理之前得激活纹理单元位置glActiveTexture(GL_TEXTURE0);

	unsigned int TexBufferA;
	glGenTextures(1, &TexBufferA);
	glActiveTexture(GL_TEXTURE0);//0号槽位 共有16个槽位 0到15
	glBindTexture(GL_TEXTURE_2D, TexBufferA);

与第一张纹理加入方式一样,第二张纹理的加入glActiveTexture(GL_TEXTURE3);//这里设置的是3号槽位,除了0号被第一张纹理选了除外,1到15号都可以选择

unsigned int TexBufferB;
	glGenTextures(1, &TexBufferB);
	glActiveTexture(GL_TEXTURE3);//这里设置的是3号槽位,其他槽位也可以共有16个槽位 0到15
	glBindTexture(GL_TEXTURE_2D, TexBufferB);
	unsigned char *data2 = stbi_load("awesomeface.png", &width, &height, &nrChannel, 0);
	if (data2)
	{
		glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, width, height, 0, GL_RGBA, GL_UNSIGNED_BYTE, data2);
		glGenerateMipmap(GL_TEXTURE_2D);
	}
	else
	{
		printf("load image failed.");
	}
	stbi_image_free(data2);

使用glUniform1i设置每个采样器的方式告诉OpenGL每个着色器采样器属于哪个纹理单元(在while循环里设置,与教程不同):

	glUniform1i(glGetUniformLocation(testShader->ID, "ourTexture"), 0);
	glUniform1i(glGetUniformLocation(testShader->ID, "ourFace"), 3);

注意: 定义纹理时需要绑定和激活,使用纹理时(while循环里)需要再次绑定和激活。

  • 颠倒

OpenGL要求y轴0.0坐标是在图片的底部的,但是图片的y轴0.0坐标通常在顶部,因此需要翻转y轴,在加载图片之前加入以下代码:

stbi_set_flip_vertically_on_load(true);

傅老师设置纹理单元图解:

在这里插入图片描述
完整代码如下:

#define GLEW_STATIC
#define STB_IMAGE_IMPLEMENTATION
#include<iostream>

#include<GL/glew.h>
#include<GLFW/glfw3.h>
#include"Shader.h"
#include "stb_image.h"


//现在直接在顶点数据里加入颜色信息以及纹理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,   1.0f, 1.0f, 0.0f,   0.0f, 1.0f    // 左上
};

unsigned int indices[] = {0,1,2,2,3,0};//按照顶点顺序绘制




//定义一个键盘输入
void processInput(GLFWwindow *window)
{
	if (glfwGetKey(window, GLFW_KEY_ESCAPE) == GLFW_PRESS)//如果键盘输入为esc,则设置关闭功能为真
		glfwSetWindowShouldClose(window, true);
}


int main() {

	//读取文件



	glfwInit();
	//告诉版本号
	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, "My Opengl", NULL, NULL);
	if (window == NULL)
	{
		printf("OPen Window failed");
		glfwTerminate();
		return -1;
	}
	glfwMakeContextCurrent(window);//通知GLFW将窗口的上下文设置为当前线程的主上下文了。

	//init glew 得初始化glew 不然会出现异常问题
	glewExperimental = true;

	if (glewInit() != GLEW_OK)
	{
		printf("init glew failed");
		glfwTerminate();
		return -1;
	}

	glViewport(0, 0, 800, 600);//glViewport函数前两个参数控制 程序 (不是opengl的窗口)窗口左下角的位置。第三个和第四个参数控制渲染窗口的宽度和高度(像素)


	//进行面的剔除
	//glEnable(GL_CULL_FACE);//打开面剔除功能
	//glCullFace(GL_BACK);//进行背面的剔除,(猜测:如果三角形的法向量是朝屏幕里面的 应该就是背面)


	//线框模式绘制
	//glPolygonMode(GL_FRONT_AND_BACK, GL_LINE);

	Shader* testShader = new Shader("vertexSource.txt", "fragmentSource.txt");

	unsigned int VAO;
	glGenVertexArrays(1, &VAO);
	glBindVertexArray(VAO);



	unsigned int VBO;
	glGenBuffers(1, &VBO);
	glBindBuffer(GL_ARRAY_BUFFER, VBO);
	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);


	//顶点
	glVertexAttribPointer(7, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)0);//第一个参数是layout(location = 0)中的0,
	glEnableVertexAttribArray(7);//layout(location = 0)中的0
	
	//颜色							 
	glVertexAttribPointer(8, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(3 * sizeof(float))); 
	glEnableVertexAttribArray(8);

	//u、v坐标(纹理)
	glVertexAttribPointer(9, 2, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(6 * sizeof(float)));  
	glEnableVertexAttribArray(9);



	unsigned int TexBufferA;
	glGenTextures(1, &TexBufferA);
	glActiveTexture(GL_TEXTURE0);//0号槽位 共有16个槽位 0到15
	glBindTexture(GL_TEXTURE_2D, TexBufferA);



	stbi_set_flip_vertically_on_load(true);
	//第一张图片
	int width, height, nrChannel;
	unsigned char *data = stbi_load("container.jpg", &width, &height, &nrChannel, 0);
	if (data)
	{
		glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, width, height, 0, GL_RGB, GL_UNSIGNED_BYTE, data);
		glGenerateMipmap(GL_TEXTURE_2D);
	}
	else
	{
		printf("load image failed.");
	}
	stbi_image_free(data);

	//第二张图片
	unsigned int TexBufferB;
	glGenTextures(1, &TexBufferB);
	glActiveTexture(GL_TEXTURE3);//这里设置的是3号槽位,其他槽位也可以共有16个槽位 0到15
	glBindTexture(GL_TEXTURE_2D, TexBufferB);
	unsigned char *data2 = stbi_load("awesomeface.png", &width, &height, &nrChannel, 0);
	if (data2)
	{
		glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, width, height, 0, GL_RGBA, GL_UNSIGNED_BYTE, data2);
		glGenerateMipmap(GL_TEXTURE_2D);
	}
	else
	{
		printf("load image failed.");
	}
	stbi_image_free(data2);


	while (!glfwWindowShouldClose(window))
	{
		//输入
		processInput(window);
		//渲染部分
		//设置opengl的窗口背景的颜色
		glClearColor(0.2f, 0.3f, 0.3f, 1.0f);
		glClear(GL_COLOR_BUFFER_BIT);
		//在前面定义时候已经绑定了一次,这里还需要绑定第二次
		glActiveTexture(GL_TEXTURE0);
		glBindTexture(GL_TEXTURE_2D, TexBufferA);
		glActiveTexture(GL_TEXTURE3);
		glBindTexture(GL_TEXTURE_2D, TexBufferB);
		glBindVertexArray(VAO);
		glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, EBO);
 
		testShader->use();
		glUniform1i(glGetUniformLocation(testShader->ID, "ourTexture"), 0);
		glUniform1i(glGetUniformLocation(testShader->ID, "ourFace"), 3);

		glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_INT, 0);

		glfwSwapBuffers(window);//glfwWindowShouldClose函数在我们每次循环的开始前检查一次GLFW是否被要求退出,如果是的话该函数返回true然后渲染循环便结束了,之后为我们就可以关闭应用程序了
		glfwPollEvents();//glfwPollEvents函数检查有没有触发什么事件(比如键盘输入、鼠标移动等)、更新窗口状态,并调用对应的回调函数
	}

	glfwTerminate();//清除释放分配的资源
	return 0;
}

参考教程:

LearnOpenGL CN

傅老师OpenGL教学

  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值