OpenGL ES 2.0 - 如何仅使用着色器绘制纹理的一部分?
问题描述:
我将png转换为java一侧的纹理,并在2D表面的屏幕上的自定义位置上绘制它们。在我的情况下是屏幕的0,0左上角。右下角是例如1024x768。现在我想实现像ImageView一样的滚动效果。这意味着在滚动过程中会有一些纹理只能部分显示。例如顶部纹理(顶部项目)将会错过顶部部分和底部纹理(底部项目)将错过底部部分。OpenGL ES 2.0 - 如何仅使用着色器绘制纹理的一部分?
我使用标准的顶点和片段着色器:
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
谢谢
答
两种方式来实现这一点:
(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)截断。
第二种方式听起来更好,我的目的。我想我知道该怎么做,然后我会试一试简单的例子。我相信这个主题可能会让很多人感兴趣,所以如果有经验的人可以添加简单的例子,我会很开心。非常感谢。 – user1063364