从openGL控件的顶部和底部切割特定区域时，投影不起作用

本文介绍了从openGL控件的顶部和底部切割特定区域时，投影不起作用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

借助此链接可以在我的纹理上应用投影. 现在，我想从glcontrol的顶部和底部切割/删除相等的区域，然后在剩余区域上应用相同的投影.我已经尝试过如下.但是如图所示，投影中缺少顶部和底部曲线. 如何将其带回剩余区域?

With the help of this link i can apply projection on my texture. Now I want to cut/remove equal area from top and bottom of my glcontrol and then need to apply same projection on remain area. I have tried like below. But as shown in the image top and bottom curve is missing on projection. How can I bring it back in remain area?

precision highp float; uniform sampler2D sTexture; varying vec2 vTexCoord; void main() { float img_h_px = 432.0; // height of the image in pixel float area_h_px = 39.0; // area height in pixel float w = area_h_px/img_h_px; if (vTexCoord.y < w || vTexCoord.y > (1.0-w)){ gl_FragColor= vec4(1.0,0.0,1.0,1.0); } else { vec2 pos = vTexCoord.xy * 2.0 - 1.0; float b = 0.5; float v_scale = (1.0 + b) / (1.0 + b * sqrt(1.0 - pos.x*pos.x)); float u = asin( pos.x ) / 3.1415 + 0.5; float v = (pos.y * v_scale) * 0.5 + 0.5; if ( v < 0.0 || v > 1.0 ) discard; vec3 texColor = texture2D( u_texture, vec2(u, v) ).rgb; gl_FragColor = vec4( texColor.rgb, 1.0 ); } }

推荐答案

底部和顶部区域的大小(底部和顶部区域的总和)，相对于控件的大小为2.0*area_h_px/img_h_px = 2.0*w. 控件大小和可见"区域的比例(h_ratio)为:

The size of bottom and top area (sum of bottom and top area), relative to the size of the control is 2.0*area_h_px/img_h_px = 2.0*w. The ration (h_ratio) of the control size and the "visible" area is:

float w = area_h_px/img_h_px; float h_ratio = 1.0 - 2.0*w;

您必须通过可见"区域的比例和控件大小来缩放纹理查找的y坐标，这是h_ratio(1.0/h_ratio)的倒数:

You've to scale the y coordinate for the texture lookup by the ration of the "visible" area and the control size, this is reciprocal of h_ratio (1.0/h_ratio):

float v = (pos.y * v_scale / h_ratio) * 0.5 + 0.5;

最终着色器:

precision highp float; uniform sampler2D sTexture; varying vec2 vTexCoord; void main() { float img_h_px = 432.0; // height of the image in pixel float area_h_px = 39.0; // area height in pixel float w = area_h_px/img_h_px; float h_ratio = 1.0 - 2.0*w; vec2 pos = vTexCoord.xy * 2.0 - 1.0; float b = 0.5; float v_scale = (1.0 + b) / (1.0 + b * sqrt(1.0 - pos.x*pos.x)); float u = asin(pos.x) / 3.1415 + 0.5; float v = (pos.y * v_scale / h_ratio) * 0.5 + 0.5; vec3 texColor = texture2D(sTexture, vec2(u, v)).rgb; vec4 color = vec4(texColor.rgb, 1.0); if (vTexCoord.y < w || vTexCoord.y > (1.0-w)) color = vec4(1.0, 0.0, 1.0, 1.0); else if (v < 0.0 || v > 1.0) discard; gl_FragColor = color; }

如果要将整个区域涂成紫色，则必须设置color，而不是 discard分段:

If you want to tint the entire area in purple, then you've to set color, instead of discarding the fragments:

if (v < 0.0 || v > 1.0) color = vec4(1.0, 0.0, 1.0, 1.0);