OpenGL ES 2.0 - 如何仅使用着色器绘制纹理的一部分？

Question

我将png转换为java一侧的纹理，并在2D表面的屏幕上的自定义位置上绘制它们。在我的情况下是屏幕的0,0左上角。右下角是例如1024x768。现在我想实现像ImageView一样的滚动效果。这意味着在滚动过程中会有一些纹理只能部分显示。例如顶部纹理（顶部项目）将会错过顶部部分和底部纹理（底部项目）将错过底部部分。

我使用标准的顶点和片段着色器：

precision mediump float; 
varying vec2 v_texCoord; 
uniform sampler2D s_texture; 

void main() 
{ 
    gl_FragColor = texture2D(s_texture, v_texCoord); 
} 
//------------ 
uniform mat4 uMVPMatrix; 
attribute vec4 vPosition; 
attribute vec2 a_texCoord; 
varying vec2 v_texCoord; 

void main() 
{ 
    gl_Position = uMVPMatrix * vPosition; 
    v_texCoord = a_texCoord; 
} 

让说我的ImageView的轻微滚动，我看到只有70％的项目*纹理的高度？首先30％应该是隐形的。我如何修改顶点或片段着色器？

我使用OpenGL ES 2.0

谢谢

Answer 1

两种方式来实现这一点：

（1）有它代表了整个纹理一个超大的矩形，并改变从顶点发出的gl_Position着色器提供滚动。想想在3D空间中上下移动矩形，你就会明白。

clip-space（顶点着色器的输出）中-1和+1坐标之间的区域是可见的。例如。如果你希望纹理的中间50％可见并填充整个屏幕（切掉顶部和底部的25％），那么你会发出坐标为+2到-2的纹理四边形。可见剪辑空间之外的部分（+1 - > +2和-2 - > -1）将被简单地删除。 （2）在屏幕上保持矩形大小相同，并更改由顶点着色器发出的纹理坐标v_texCoord。在这种情况下，您希望减少值以提供放置。 0.0到1.0之间的坐标表示整个纹理，因此，如果您想根据“顶部”的定义将要使用的顶部30％（0.3到1.0）或（0.0到0.7）截断。