OpenGL ES详解——多个纹理实现混叠显示

OpenGL纹理叠加 OpenGL纹理叠加1. 纹理贴图的实现2. 纹理单元 在OpenGL纹理贴图的基础上继续深入学习纹理相关内容,本篇文章的主要目的是为了实现OpenGL纹理叠加,需要引入纹理单元的相关概念。 1. 纹理贴图的实现 按照之前纹理贴图的实现方法在两个三角形组成的矩形内贴上星空和胡桃如下所示 2. 纹理单元 之前在绘制纹理贴图时着色器的编写如下所示: #version 330 core out vec4 FragColor; in vec3 ourColor; in vec2 TexCoord; // t 阅读详情

目录

一、获取图片纹理数据

二、着色器编写

1. 顶点着色器

2. 片元着色器

三、绑定和绘制纹理

1. 绑定纹理

2. 绘制纹理

四、源码下载


一、获取图片纹理数据

获取图片纹理数据代码如下:

//获取图片1纹理数据
mTextureId = loadTexture(mContext, R.mipmap.scenery)
//获取图片2纹理数据
mTextureMeiNvId = loadTexture(mContext, R.mipmap.meinv)

fun loadTexture(context: Context, resourceId: Int): Int {
    var bitmap = generateBitmap(context, resourceId)
    if (bitmap == null) {
        Log.d(TAG, "resourceId could not be decoded.")
        return 0
    }
    return getImgTexture(bitmap)
}

fun getImgTexture(bitmap: Bitmap): Int {
    val textureObjectIds = IntArray(1)
    glGenTextures(1, textureObjectIds, 0)
    if (textureObjectIds[0] == 0) {
        glDeleteTextures(1, textureObjectIds, 0)
        return 0
    }
    glBindTexture(GL_TEXTURE_2D, textureObjectIds[0])
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR)
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR)
    texImage2D(GL_TEXTURE_2D, 0, bitmap, 0)
    glGenerateMipmap(GL_TEXTURE_2D)
    bitmap.recycle()
    glBindTexture(GL_TEXTURE_2D, 0)
    return textureObjectIds[0]
}

二、着色器编写

1. 顶点着色器

代码如下:

attribute vec4 a_Position; // 顶点坐标
attribute vec2 a_TextureCoordinates;  //纹理坐标
varying vec2 aCoord;

void main(){
    gl_Position = a_Position;
    aCoord = a_TextureCoordinates;
}

2. 片元着色器

代码如下:

precision mediump float;// 数据精度

varying vec2 aCoord;
uniform sampler2D  u_TextureUnit;
uniform sampler2D  u_TextureUnit1;

void main(){
     gl_FragColor = mix(texture2D(u_TextureUnit, aCoord), texture2D(u_TextureUnit1, aCoord), 0.5);
}

三、绑定和绘制纹理

1. 绑定纹理

     GLES20.glActiveTexture(GL_TEXTURE0)
        GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, mTextureId)
        mTextureShaderProgram!!.setUniforms(
            mTextureShaderProgram!!.getTextureUniformLocation(),
            0
        )
        GLES20.glActiveTexture(GL_TEXTURE1)
        GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, mTextureMeiNvId)
        mTextureShaderProgram!!.setUniforms(
            mTextureShaderProgram!!.getTextureUniform1Location(),
            1
        )

2. 绘制纹理

        GLES20.glDrawArrays(GLES20.GL_TRIANGLE_STRIP, 0, 6)

图一:

图二:

叠加后的效果图如下:

四、源码下载

Android OpenGL ES多个纹理实现混叠显示项目源码

下载地址:

https://download.youkuaiyun.com/download/github_27263697/90115686

推荐文章

https://juejin.cn/post/7155040552353234951

第一章 OpenGL ES 基础-屏幕、纹理、顶点坐标 GL_TRIANGLE_STRIP:指定要绘制的基本图元类型为三角形条带,即每三个顶点定义一个三角形,但从第三个顶点开始,每个新顶点都与前两个顶点一起构成一个新的三角形。坐标系 的 左下点(-1, -1),右下角(1,-1) , 左上角(-1, 1) , 右上角(1 , 1)坐标系 的 左下点 (0, 0),右下角(1 , 0) , 左上角(0, 1 ), 右上角(1, 1)0:指定了要渲染的顶点数组的起始索引,这里表示从顶点数组的第一个顶点开始。使用第二个顶点作为三角形条带的第二个顶点。 阅读详情

相关推荐

Android显示系统(07)- OpenGL ES - 纹理Texture

矩阵乘以单位矩阵时,任何矩阵都不会发生改变。例如,对于一个二维或者三维的变换,单位矩阵是一个不做任何变换的基础矩阵。在三维空间中,具体的单位矩阵形式如下:1 0 0 00 1 0 00 0 1 00 0 0 1本章主要讲解了内部纹理如何渲染,你可以简单理解成如何显示出你手机图库里面某张照片。需要掌握的内容非常多,主要涉及GPU内部结构和关键接口的了解,纹理的概念,并且得了解一些纹理参数,每个参数又和一些业务场景相关,只要做图形学相关,纹理是必须掌握的,大家加油压!

Ziwubiancheng的博客 2115

OpenGL之——多纹理,混合纹理设置渲染

 实现下面三种纹理的组合和混合:  一、首先,获取纹理顶点坐标 #version 330 core layout (location = 0) in vec3 aPos; layout (location = 1) in vec2 aTexCoods; out vec2 TexCoods; void main(){ gl_Position = vec4(aPos, 1.0f); Te...

衣带渐宽人憔悴 9354

Android OpenGL es 纹理坐标设定与贴图规则

当opengl对一个四方形进行贴图时,会定义纹理贴图坐标,一串数组,相信初学openggl es者看到后会很头疼,不知道写得是什么东西。现在就将我的研究成果与大家分享下!当纹理映射启动后绘图时,你必须为OpenGL ES提供其他数据,即顶点数组中各顶点的纹理坐标。纹理坐标定义了图像的哪一部分将被映射到多边形。它的工作方式有点奇怪。相信初学者看到后会很头疼,不知道写得是什么东西。现在就将我的研究成果与大家分享下!下面看下在android平台下Opengl纹理系统坐标,左下角为原点。我们现在讨论怎样使用这些纹理

cjkwin的专栏 3万+

【C++ OpenGL ES 2.0编程笔记】4: 纹理贴图-图片叠加效果实现

本文介绍了如何使用C++语言和OpenGL ES 2.0 API实现纹理图片的叠加显示效果

Small Flows 9461

Android OpenGL ES纹理总结、纹理坐标系说明、使用代码示例

#.纹理介绍: 可以简单想象成一张皮,可以贴在OpenGL空间中自己指定的区域之上,从而实现需要的视觉效果。 ##.使用纹理的好处: 如果想让图形看起来更真实,就必须有足够多的顶点,还要设置相应的颜色属性,会产生很多性能开销。 而如果是使用在指定的位置贴上一层纹理的方式,不需要非常多顶点,只需要纹理绘制满足需要,OpenGl中顶点位置与纹理对应位置关联正确。就可以达到需要的细节显示效果。 ##."需要蒙皮"位置与纹理的对应关系 纹理有自己内部的坐标系,纹...

u013914309的博客 3381

OpenGL ES学习之纹理贴图

OpenGL ES学习之纹理贴图 基本原理 启用纹理映射功能后,如果想把一副纹理应用到相应的几何图元,就必须告知渲染系统如何进行纹理的映射。告知的方式就是为图元汇总的顶点指定恰当的纹理坐标,纹理坐标用浮点数来表示。范围一般是0.0到1.0: 左侧是一副纹理图,其位于纹理坐标当中。纹理坐标系原点在左上侧,向右为S轴,向下为T轴,两个周的取值范围都是0.0到1.0.也就是说不论实际纹理图...

小薇子的博客 4227

OpenGL ES 纹理以及纹理的映射

OpenGL ES 纹理以及纹理的映射

Lud的博客 931

android opengl es添加纹理,绘制立方体纹理,立方体使用不同纹理

绘制立方体纹理,立方体6个面使用不同纹理

u012761326的博客 3124

Android OpenGL ES详解——纹理

我们已经了解到,我们可以为每个顶点添加颜色来增加图形的细节,从而创建出有趣的图像。但是,如果想让图形看起来更真实,我们就必须有足够多的顶点,从而指定足够多的颜色。这将会产生很多额外开销,因为每个模型都会需求更多的顶点,每个顶点又需求一个颜色属性。艺术家和程序员更喜欢使用。是一个2D图片(甚至也有1D和3D的纹理),它可以用来添加物体的细节;你可以想象纹理是一张绘有砖块的纸,无缝折叠贴合到你的3D的房子上,这样你的房子看起来就像有砖墙外表了。

闲暇部落 1294

android 使用OPENGL ES实现纹理拉伸效果-纹理映射基础

效果图: 编写dad.java文件          *声明三个矩形,分别贴s,t的最大值为1X1、4X4、4X2的纹理涂,在场景中分别绘制1X1、4X4、4X2的纹理矩形       *设置视窗的大小、矩阵类型、并设置投影模式为透视投影       *定义封装方法initTexture()以获取纹理ID,该方法通过收取图片ID,生成一个纹理ID并返回 pac

刘国栋的博客 2657

OpenGL ES 20 用2D纹理伪造3D效果 Demo

OpenGL ES 20 ;Android ;2D纹理 ;3D效果 ;Demo

henryjax的博客 2818

Opengl ES之纹理贴图

纹理可以理解为一个二维数组,它可以存储大量的数据,这些数据可以发送到着色器上。一般情况下我们所说的纹理是表示一副2D图,此时纹理存储的数据就是这个图的像素数据。所谓的纹理贴图,就是使用Opengl将这个纹理数据渲染出来,这个过程有点像装修工人给墙体贴瓷砖,而瓷砖好比作纹理。

u012944685的专栏 1790

OpenGL纹理叠加基础知识与编程

每个纹理图像都有自己的纹理单元,通过将纹理单元与纹理句柄关联,可以在渲染过程中选择使用哪些纹理进行叠加。纹理叠加是OpenGL中常用的技术之一,它能够将多个纹理图像叠加在一起,以创建更复杂的视觉效果。纹理环境定义了纹理叠加的混合方式和参数。第一个纹理图像使用默认的纹理环境(GL_MODULATE),而第二个纹理图像使用GL_ADD模式进行混合。综上所述,通过设置合适的纹理环境和参数,我们可以在OpenGL中实现纹理叠加效果。除了选择纹理环境外,还可以通过设置纹理环境参数来进一步控制纹理叠加的效果。

ByteWhisper的博客 492

Android OpenGL ES基本用法(10),多个surface绘制同一个共享纹理

在上一篇的基础上实现共享纹理。 MainActivity private void initView() { picGlSurfaceView = (PicGlSurfaceView) findViewById(R.id.picGlSurfaceView); llContent = (LinearLayout) findViewById(R.id.llConte...

张雨的博客 5033

OpenGL纹理叠加的基本原理及代码实现

纹理叠加是通过将多个纹理对象进行混合从而生成新的纹理对象的过程。在OpenGL中,我们可以使用glEnable(GL_BLEND)来启用混合功能,然后使用glBlendFunc(GLenum srcFactor, GLenum dstFactor)函数设置颜色混合的两个因子。在OpenGL中,我们可以使用多个纹理对象来进行纹理映射,并将它们混合在一起,从而创建出更加生动、具有丰富层次感的图形效果。纹理叠加是OpenGL中一个重要的图形处理技术,它可以给图像增加更多的层次感和细节,从而使图像更加生动、真实。

James_CODER的博客 500

实现OpenGL ES圆形纹理映射教程

OpenGL ES是由Khronos组织为了适应移动设备计算能力和内存资源限制而专门优化的OpenGL版本。它保留了OpenGL的核心功能,同时移除了一些在嵌入式系统中不太实用的特性,确保了API的轻量级和高效性。在OpenGL ES中,有多种预设的混合函数可供选择,这些函数根据不同的场景和需求应用不同的算法。一些常见的颜色混合函数包括:GL_FUNC_ADD:将源颜色和目标颜色按照各自的权重相加。GL_FUNC_SUBTRACT:从目标颜色中减去源颜色。

weixin_42607969的博客 989

OpenGL ES 3.0多重纹理技术详解:如何实现复杂的材质效果

OpenGL ES 3.0多重纹理技术是实现复杂材质效果的核心方法,通过将多个纹理组合应用到3D模型表面,可以创建出丰富的视觉细节和真实感。本文将从基础概念、实现步骤到实际案例,全面解析OpenGL ES 3.0中的多重纹理技术,帮助开发者快速掌握这一实用技能。 ## 什么是多重纹理技术? 多重纹理(Multitexturing)是指在渲染过程中同时使用多个纹理图像对物体表面进行着色的技术。通

gitblog_00638的博客 1130

OpenGL ES纹理贴图实战指南

OpenGL ES(Open Graphics Library for Embedded Systems)是OpenGL的一个子集,专为移动设备和嵌入式系统设计,以实现高性能的2D和3D图形渲染。其轻量级和跨平台的特性使其成为开发手机游戏和应用程序的首选图形API。在深入探讨OpenGL ES的纹理贴图之前,先来了解其基本架构和概念。OpenGL ES通过一套精简的API来管理图形渲染管线,这包括顶点处理、片元处理、纹理映射、光照和混合等步骤。

weixin_33812391的博客 861
上一篇: OpenGL ES详解——glUniform1i方法是否能用于设置纹理单元
下一篇: 多线程详解——AsyncTask工作原理(源码详解)
闲暇部落
博客等级 码龄12年 2775粉丝 215原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

闲暇部落

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值