10.1 正方形纹理映射

1. 任务描述

本关任务

为了完成本关任务，你需要掌握：了解计算机图形学的纹理映射原理，了解 OpenGL 程序的贴图纹理映射方法。为了在场景中添加纹理映射，需要执行以下步骤：

纹理控制：定义纹理如何包裹物体的表面。
定义纹理：利用矩形图像进行贴图是二维纹理贴图中常用的方法。
纹理映射方式：用函数可以设置纹理映射的方式。
纹理坐标：定义纹理与几何坐标对应关系的纹理坐标。

预期输出

具体要求

提示：每一步相关知识可以点击展开查看 给两个正方形添加纹理映射。

1. 设置控制纹理映射

设置控制纹理映射的函数，参数分别如下：

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_MAG_FILTER, GL_NEAREST);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);

相关知识点击查看


纹理的控制：
OpenGL 的纹理控制实质上就是定义纹理是如何包裹物体的表面，因为纹理的外形并不总是与物体一致。控制纹理映射方式的函数原型如下：
void glTexParameter{fi}v(GLenum target, GLenum pname, TYPE param);
参数 target 指定纹理映射类型，必须是 GL_TEXTURE_1D 或 GL_TEXTURE_2D。pname 指定一个单值纹理参数的符号名，param 指定纹理参数的取值。

2. 定义二维纹理贴图

运用定义二维纹理贴图函数，参数分别如下：

glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, checkImageWidth, checkImageHeight, 0, GL_RGBA, GL_UNSIGNED_BYTE, checkImage);

相关知识点击查看


定义二维纹理贴图的函数原型如下：
void glTexImage2D(GLenum target, GLint level, GLint components, GLsizei width, GLsizei height, GLint border, GLenum format, GLenum type, const GLvoid *pixels);
参数说明如下：
（1）target 指定纹理映射方式，此处必须是 GL_TEXTURE_2D；
（2）level 指定纹理图像纹理分辨率的级数。当只有一种分辨率时 level 的值为 0；
（3）components 指定选用 RGBA 的哪些成分用于颜色的混合和调整，1 代表只选用纹理图像的红色分量，2 表示选择纹理图像的红色和 alpha 分量，3 代表同时选用纹理图像的红、绿、蓝分量，4 表示同时选择红、绿、蓝和 alpha 分量；
（4）width 和 height 定义纹理图像的长度和宽度，必须是 2 的 n 次方；
（5）border 说明纹理边界的宽度，当其值为 0 时，边界也为 0；当 border 为 1 时，纹理图像的长度和宽度必须写成 2^m+2border 及 2^n+2border 的形式，其中 m、n 为一个大于 32 的整数；
（6）format 说明纹理图像数据的格式，其值可以是 GL_COLOR_INDEX、GL_RGB、GL_RGBA、GL_RED、GL_GREEN、GL_BLUE、GL_ALPHA、GL_LUMINANCE_ALPHA；
（7）type 说明纹理图像的数据类型，取值可为：GL_TYPE、GL_UNSIGNED_BYTE、GL_SHORT、GL_UNSIGNED_SHORT、GL_INT、GL_UNSIGNED_INT、GL_FLOAT、GL_BITMAP 之一；
（8）pixels 说明纹理图像的像素数据的存储地址，通常纹理可以是彩色的或灰度的。

3. 设置纹理映射方式

设置纹理映射方式，函数参数如下：

glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_REPLACE);

相关知识点击查看

纹理映射函数可用来设置纹理映射方式： void glTexEnv{fi}v(GLenum target, GLenum pname, TYPE param);

参数说明如下：（1）target 指定一个纹理环境，值必须是 GL_TEXTURE_ENV。（2）pname 指定一个纹理环境参数的符号名，可以是 GL_TEXTURE_ENV_MODE 或 GL_TEXTURE_ENV_COLOR。若 pname 取值为 GL_TEXTURE_ENV_MODE，则 param 取值可为 GL_MODULATE、GL_DECAL、GL_BLEND 和 GL_REPLACE；若 pname 取值为 GL_TEXTURE_ENV_COLOR，则 param 取值可为包含 4 个浮点数的数组 (B,G,R,A)。（3）当 param 取值为 GL_MODULATE 时，纹理图像以透明方式贴在物体表面上，就像现实世界中将一张带有图案的透明纸贴在物体上一样；当 param 取值为 GL_BLEND 时，则使用了一个 RGBA 常量来融合物体原色和纹理图像颜色的映射方式；当 param 取值为 GL_REPLACE 时，纹理映射的结果是在物体表面上映射纹理图像，不让其下的任何物体的颜色表现出来。

4. 设置三个矩形纹理坐标

设置纹理坐标，函数参数如下：

	glTexCoord2f(0.0, 0.0); glVertex3f(-2.0, -1.0, 0.0);
	glTexCoord2f(0.0, 1.0); glVertex3f(-2.0, 1.0, 0.0);
	glTexCoord2f(1.0, 1.0); glVertex3f(0.0, 1.0, 0.0);
	glTexCoord2f(1.0, 0.0); glVertex3f(0.0, -1.0, 0.0);

	glTexCoord2f(0.0, 0.0); glVertex3f(1.0, -1.0, 0.0);
	glTexCoord2f(0.0, 1.0); glVertex3f(1.0, 1.0, 0.0);
	glTexCoord2f(1.0, 1.0); glVertex3f(2.41421, 1.0, -1.41421);
	glTexCoord2f(1.0, 0.0); glVertex3f(2.41421, -1.0, -1.41421);

相关知识点击查看


纹理图像一般用二维数组来表示，纹理坐标通常有一维、二维、三维或四维形式，称为 s、t、r、q 坐标。定义纹理坐标的函数原型如下，它有多达 32 种变化：
void glTexCoord1{sifd}(GLint s);
void glTexCoord2{sifd}(GLint s, GLint t);
void glTexCoord3{sifd}(GLint s, GLint t, GLint r);
void glTexCoord4{sifd}(GLint s, GLint t, GLint r, GLint q);

2. 我的回答

文件 step2/test2.cpp:

// 提示：在合适的地方修改或添加代码
#include <GL/freeglut.h>
#include<stdlib.h>
#include<stdio.h>
// 评测代码所用头文件-开始
#include<opencv2/core/core.hpp>
#include<opencv2/highgui/highgui.hpp>
#include<opencv2/imgproc/imgproc.hpp>
using namespace std;
// 评测代码所用头文件-结束


#define checkImageWidth 64
#define checkImageHeight 64
static GLubyte checkImage[checkImageHeight][checkImageWidth][4];
static GLuint texName;

void makeCheckImage(void)
{
	int i, j, c;
	for (i = 0; i < checkImageHeight; i++)
	{
		for (j = 0; j < checkImageWidth; j++)
		{
			c = (((i & 0x8) == 0 ^ ((j & 0x8)) == 0)) * 255;
			checkImage[i][j][0] = (GLubyte)c;
			checkImage[i][j][1] = (GLubyte)c;
			checkImage[i][j][2] = (GLubyte)c;
			checkImage[i][j][3] = (GLubyte)255;
		}
	}
}

void init(void)
{
    glClearColor(0.5, 2.0, 0.5, 0.0);
    glShadeModel(GL_FLAT);
    glEnable(GL_DEPTH_TEST);

    makeCheckImage();
    glGenTextures(1, &texName); // 注意：建议添加纹理生成语句
    glBindTexture(GL_TEXTURE_2D, texName);

    //********1.请输入代码设置控制纹理映射函数***************//
    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_MAG_FILTER, GL_NEAREST);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
    //******************************************************// 
    
    //********2.请输入代码设置纹理的定义函数*****************//
    glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, checkImageWidth, checkImageHeight, 0, GL_RGBA, GL_UNSIGNED_BYTE, checkImage);
    //******************************************************// 
}

void display(void)
{
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    glEnable(GL_TEXTURE_2D);
    
    //********3.请输入代码进行纹理映射方式设置*********//
    glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_REPLACE);
    //**********************************************//
    
    glBindTexture(GL_TEXTURE_2D, texName);
    glBegin(GL_QUADS);
    //********4.请输入代码进行纹理坐标设置**********//
    glTexCoord2f(0.0, 0.0); glVertex3f(-2.0, -1.0, 0.0);
    glTexCoord2f(0.0, 1.0); glVertex3f(-2.0, 1.0, 0.0);
    glTexCoord2f(1.0, 1.0); glVertex3f(0.0, 1.0, 0.0);
    glTexCoord2f(1.0, 0.0); glVertex3f(0.0, -1.0, 0.0);

    glTexCoord2f(0.0, 0.0); glVertex3f(1.0, -1.0, 0.0);
    glTexCoord2f(0.0, 1.0); glVertex3f(1.0, 1.0, 0.0);
    glTexCoord2f(1.0, 1.0); glVertex3f(2.41421, 1.0, -1.41421);
    glTexCoord2f(1.0, 0.0); glVertex3f(2.41421, -1.0, -1.41421);
    //***************************************** **//
    glEnd();
    glFlush();
    glDisable(GL_TEXTURE_2D);
}

void reshape(int w, int h)
{
	glViewport(0, 0, (GLsizei)w, (GLsizei)h);
	glMatrixMode(GL_PROJECTION);
	glLoadIdentity();
	gluPerspective(60.0, ((GLsizei)w / (GLsizei)h), 1.0, 30.0);
	glMatrixMode(GL_MODELVIEW);
	glLoadIdentity();
	glTranslatef(0.0, 0.0, -3.6);
}


int main(int argc, char *argv[])
{

	glutInit(&argc, argv);
	glutInitWindowPosition(100, 100);
	glutInitWindowSize(400, 400);
	glutCreateWindow("几何变换示例");
    init();
    glutDisplayFunc(display);
    glutReshapeFunc(reshape);
    glutMainLoopEvent();     
     
    /*************以下为评测代码，与本次实验内容无关，请勿修改**************/
	GLubyte* pPixelData = (GLubyte*)malloc(400 * 400 * 3);//分配内存
    GLint viewport[4] = {0};
    glReadBuffer(GL_FRONT);
    glPixelStorei(GL_UNPACK_ALIGNMENT, 4);
    glGetIntegerv(GL_VIEWPORT, viewport);
    glReadPixels(viewport[0], viewport[1], viewport[2], viewport[3], GL_RGB, GL_UNSIGNED_BYTE, pPixelData);
    cv::Mat img;
    std::vector<cv::Mat> imgPlanes;
    img.create(400, 400, CV_8UC3);
    cv::split(img, imgPlanes);

    for (int i = 0; i < 400; i++) {
        unsigned char* plane0Ptr = imgPlanes[0].ptr<unsigned char>(i);
        unsigned char* plane1Ptr = imgPlanes[1].ptr<unsigned char>(i);
        unsigned char* plane2Ptr = imgPlanes[2].ptr<unsigned char>(i);
        for (int j = 0; j < 400; j++) {
            int k = 3 * (i * 400 + j);
            plane2Ptr[j] = pPixelData[k];
            plane1Ptr[j] = pPixelData[k + 1];
            plane0Ptr[j] = pPixelData[k + 2];
        }
    }
    cv::merge(imgPlanes, img);
    cv::flip(img, img, 0);
    cv::namedWindow("openglGrab");
    cv::imshow("openglGrab", img);
    //cv::waitKey();
    cv::imwrite("../img_step2/test.jpg", img);
    return 0;
}

音乐

音乐

10.1 正方形纹理映射

10.1 正方形纹理映射

1. 任务描述

本关任务

预期输出

具体要求

1. 设置控制纹理映射

2. 定义二维纹理贴图

3. 设置纹理映射方式

4. 设置三个矩形纹理坐标

相关知识

2. 我的回答

音乐

课程

10.1 正方形纹理映射

10.1 正方形纹理映射#

1. 任务描述#

本关任务#

预期输出#

具体要求#

1. 设置控制纹理映射#

2. 定义二维纹理贴图#

3. 设置纹理映射方式#

4. 设置三个矩形纹理坐标#

相关知识#

2. 我的回答#

10.1 正方形纹理映射

1. 任务描述

本关任务

预期输出

具体要求

1. 设置控制纹理映射

2. 定义二维纹理贴图

3. 设置纹理映射方式

4. 设置三个矩形纹理坐标

相关知识

2. 我的回答