美文网首页
OpenGLES纹理翻转解决方案

OpenGLES纹理翻转解决方案

作者: 枫紫_6174 | 来源:发表于2020-08-04 23:16 被阅读0次

一.先看看我们平时显示纹理可能出现的问题


纹理旋转

二.解决方案

2.1矩阵旋转顶点坐标(即图形顶点坐标在不改变顶点纹理坐标的前提下,旋转顶点)

         在设置纹理采样器 sampler2DglUniform1i(glGetUniformLocation(self.myPrograme, "colorMap"), 0);绘图glDrawArrays(GL_TRIANGLES, 0, 6);的中间旋转顶点坐标,传入旋转矩阵,在自定义顶点着色器里面添加旋转矩阵:uniformmat4rotateMatrix;并vec4vPos = position; vPos = vPos * rotateMatrix;gl_Position= vPos;赋值

自定义着色器传入旋转矩阵

函数实现;-(void)rotateTextureImage{

    //注意,想要获取shader里面的变量,这里记得要在glLinkProgram后面,后面,后面!

    //1. rotate等于shaderv.vsh中的uniform属性,rotateMatrix

    GLuint rotate = glGetUniformLocation(self.myPrograme, "rotateMatrix");

    //2.获取渲旋转的弧度

    floatradians =180*3.14159f/180.0f;

    //3.求得弧度对于的sin\cos值

    floats =sin(radians);

    floatc =cos(radians);

    //4.因为在3D课程中用的是横向量,在OpenGL ES用的是列向量

    /*

     参考Z轴旋转矩阵

     */

    GLfloatzRotation[16] = {

        c,-s,0,0,

        s,c,0,0,

        0,0,1,0,

        0,0,0,1

    };

    //5.设置旋转矩阵

    /*

     glUniformMatrix4fv (GLint location, GLsizei count, GLboolean transpose, const GLfloat* value)

     location : 对于shader 中的ID

     count : 个数

     transpose : 转置

     value : 指针

     */

    glUniformMatrix4fv(rotate,1,GL_FALSE, zRotation);

}

2.2修改顶点着色器的纹理坐标(1-纹理坐标的y值)

       在自定义顶点着色器的vsh中修改代码:varyTextCoord =vec2(textCoordinate.x,1.0-textCoordinate.y);

修改顶点着色器的纹理坐标

2.3修改片元着色器的纹理坐标(1-纹理坐标的y值)

        在自定义片元着色器fsh中修改代码:gl_FragColor=texture2D(colorMap,vec2(varyTextCoord.x,1.0-varyTextCoord.y));

修改片元着色器的纹理坐标

2.4改变顶点纹理坐标的映射位置

原来的顶点位置:

    GLfloatattrArr[] =

    {

        0.5f, -0.5f, -1.0f,    1.0f,0.0f,

        -0.5f,0.5f, -1.0f,    0.0f,1.0f,

        -0.5f, -0.5f, -1.0f,    0.0f,0.0f,

        0.5f,0.5f, -1.0f,      1.0f,1.0f,

        -0.5f,0.5f, -1.0f,    0.0f,1.0f,

        0.5f, -0.5f, -1.0f,    1.0f,0.0f,

    };

改变后的顶点位置:

GLfloatattrArr[] =

    {

        0.5f, -0.5f, -1.0f,    1.0f,1.0f,

        -0.5f,0.5f, -1.0f,    0.0f,0.0f,

        -0.5f, -0.5f, -1.0f,    0.0f,1.0f,

        0.5f,0.5f, -1.0f,      1.0f,0.0f,

        -0.5f,0.5f, -1.0f,    0.0f,0.0f,

        0.5f, -0.5f, -1.0f,    1.0f,1.0f,

    };

关于纹理坐标映射,请看我的博客纹理坐标

2.5图片源文件翻转

    拿到元纹理图片的宽高,重新绘制一张图片出来
    CGRectrect =CGRectMake(0,0, width, height);

    CGContextDrawImage(spriteContext, rect, spriteImage);

    CGContextTranslateCTM(spriteContext, rect.origin.x, rect.origin.y);

    CGContextTranslateCTM(spriteContext, 0, rect.size.height);

    CGContextScaleCTM(spriteContext,1.0, -1.0);

    CGContextTranslateCTM(spriteContext, -rect.origin.x, -rect.origin.y);

    CGContextDrawImage(spriteContext, rect, spriteImage);

    CGContextRelease(spriteContext);

        

翻转后的效果

相关文章

  • OpenGLES纹理翻转解决方案

    一.先看看我们平时显示纹理可能出现的问题 二.解决方案 2.1矩阵旋转顶点坐标(即图形顶点坐标在不改变顶点纹理坐标...

  • OpenGLES 2 (翻)

    OpenGLES 2 翻转策略 方案一:图形顶点翻转180°,纹理保持原状 图形顶点利用旋转矩阵旋转180°,如图...

  • OpenGL 图片翻转的5种策略

    iOS纹理翻转解决策略 第1种: 旋转矩阵翻转图形,不翻转纹理 让图形顶点坐标旋转180°. 而纹理保持原状. 第...

  • OpenGLES 之纹理

    纹理 纹理是一个用来保存图像的颜色元素值的OpenGL ES 缓存。它可以控制一个渲染的三角形中每个像素的...

  • OpenGLES 纹理介绍

    一、纹理基础 3D图形渲染中最基本的操作就是对一个表面应用纹理。纹理可以表现只从网格的几何形状无法得到的附加细节。...

  • openglES纹理参数

    纹理过滤

  • Opengles 纹理映射

    在纹理坐标系中有一个命名为 S 和 T 的 2D 轴(类似于 X 轴 和 Y 轴)。纹理的尺寸为从 S 轴上从 0...

  • 纹理翻转

    OpenGL的纹理坐标是左下角的,而图片的坐标是在左上角的,所以画上去的时候会是倒立的,有五种方法可以使图片正过来...

  • OPenGL ES纹理翻转解决方案

    纹理翻转 在使用OpenGL函数加载纹理到图形时,经常遇到纹理上下颠倒的问题。原因是因为OpenGL要求纹理坐标原...

  • OpenGL ES 纹理翻转解决方案

    由于OpenGL要求图片的坐标原点跟图片本身的坐标原点不一样,所以如果要正常显示图片,需要对图片进行翻转。下面列举...

网友评论

      本文标题:OpenGLES纹理翻转解决方案

      本文链接:https://www.haomeiwen.com/subject/lyhvrktx.html