Показать половину изображения рядом - OpenGL - PullRequest
Новая
       86

Показать половину изображения рядом - OpenGL

0 голосов
/ 22 ноября 2018

Я создал две текстуры для двух изображений.Теперь я хочу показать эти текстуры в opengl в том порядке, в котором левая часть image2, полное изображение1, правая часть изображения2.Я сделал, как показано ниже.Изображение 1 показано в центре экрана OpenGL.Но левая и правая части экрана неправильные (которые должны отображать левую часть изображения 2 и правую часть изображения 2 соответственно)

Вершинный шейдер: 

attribute vec3 a_position;
varying vec2 vTexCoord;
void main() {
    vTexCoord = (a_position.xy + 1) / 2;
    gl_Position = vec4(a_position,1);
}

Фрагмент шейдера: 

precision highp float;
uniform sampler2D sTexture;//texture for image 1
uniform sampler2D sTexture1;//texture for image 2
varying vec2 vTexCoord;

void main () {
    if ( vTexCoord.x<=0.25 )
        gl_FragColor = texture2D (sTexture1, vec2(vTexCoord.x/2.0, vTexCoord.y));
    else if ( vTexCoord.x>0.25 && vTexCoord.x<0.75 )
        gl_FragColor = texture2D (sTexture, vec2(vTexCoord.x*2.0, vTexCoord.y));
    else if(vTexCoord.x>=0.75 )
        gl_FragColor = texture2D (sTexture1,  vec2(vTexCoord.x*2.0-1.0, vTexCoord.y));
}

Компиляция шейдеров: 

void CreateShaders() {
    /***********Vert Shader********************/
    vertShader = GL.CreateShader(ShaderType.VertexShader);
    GL.ShaderSource(vertShader, vertexShaderSource);
    GL.CompileShader(vertShader);

    /***********Frag Shader ****************/
    fragShader = GL.CreateShader(ShaderType.FragmentShader);
    GL.ShaderSource(fragShader, fragmentShaderSource);
    GL.CompileShader(fragShader);
}

1 Ответ

0 голосов
/ 22 ноября 2018

Я хочу показать эти текстуры в opengl в порядке, который оставил часть image2 , полную image1 , правую часть image2

Если координата текстуры меньше 0,25, то вы хотите показать ранжирование [0, 0,5] для image2 .Вы должны отобразить компонент x в координате текстуры от [0.0, 0.25] до [0, 0.5]: 

vec2( vTexCoord.x*2.0, vTexCoord.y );

Если координата текстуры терная, вы хотите показать ранжирование [0.5, 1] из image2 .Вы должны отобразить компонент x координаты текстуры от [0.75, 1.0] до [0.5, 1.0]: 

vec2( (vTexCoord.x-0.75)*2.0 + 0.5, vTexCoord.y );

или 

vec2( vTexCoord.x*2.0 - 1.0, vTexCoord.y );

Если координата текстуры больше чем0,25 и менее 0,75, то вы хотите показать полный диапазон image1 .Вы должны отобразить компонент x координаты текстуры от [0.25, 0.75] до [0.0, 1.0]: 

vec2( vTexCoord.x*2.0 - 0.5, vTexCoord.y );

Код шейдера может выглядеть следующим образом 

precision highp float;
uniform sampler2D sTexture;//texture for image 1
uniform sampler2D sTexture1;//texture for image 2
varying vec2 vTexCoord;

void main ()
{
    float u = vTexCoord.x*2.0;
    float a = 0.0; 
    if( vTexCoord.x > 0.75 )
    {
       u -= 1.0;
    }
    else if ( vTexCoord.x >= 0.25 )
    { 
       u -= 0.5;
       a  = 1.0;
    }

    vec4 color1 = texture2D(sTexture1, vec2(u, texCoord.y));
    vec4 color2 = texture2D(sTexture,  vec2(u, texCoord.y));

    gl_FragColor = mix(color2, color1, a);
}

Расширение до ответа:

, если я хочу показать только часть правильного изображения, например (0.6,0.8).

Вы хотите отобразить [0,75, 1,0] до [0,6, 0,8]:

  1. [0,75, 1,0] до [0, 1]: u' = (u-0.75)/0.25

  2. [0, 1] - [0,6, 0,8]: u'' = u'*0.2+0.6

Это приводит к: 

u = (vTexCoord.x-0.75)*0.2/0.25 + 0.6;

при отображении [0,75, 1,0]до [0,6, 0,8] я хочу отобразить оставшуюся часть [0,75, 1,0] с черным / белым цветом.при использовании (vTexCoord.x-0,75) * 0,2 / 0,25 + 0,6 изображение с частью [.6, .8] заполняется в [0,75, 1,0]

Необходимо преобразовать цвет RGB вgrayscal.Я рекомендую использовать формулу для Относительная яркость : 

float grayscale = dot(color1, vec3(0.2126, 0.7152, 0.0722));
color1.rgb      = vec3(grayscale);
...