GLSL Shader - Coverflow 2D 오브젝트의 반사

Question

coverflows에 사용 된 이미지와 비슷한 이미지를 생성하는 셰이더를 작성하고 싶습니다.

// Vertex Shader 
uniform highp mat4 u_modelViewMatrix; 
uniform highp mat4 u_projectionMatrix; 
attribute highp vec4 a_position; 
attribute lowp vec4 a_color; 
attribute highp vec2 a_texcoord; 
varying lowp vec4 v_color; 
varying highp vec2 v_texCoord; 
mat4 rot = mat4(-1.0, 0.0, 0.0, 0.0, 
        0.0, -1.0, 0.0, 0.0, 
        0.0, 0.0, 1.0, 0.0, 
        0.0, 0.0, 0.0, 1.0); 
void main() 
{ 
    gl_Position = (u_projectionMatrix * u_modelViewMatrix) * a_position * rot; 
    v_color = a_color; 
    v_texCoord = a_texcoord; 
} 

// Fragment Shader 
varying highp vec2 v_texCoord; 
uniform sampler2D u_texture0; 
uniform int slices; 
void main() 
{ 
    lowp vec3 w = vec3(1.0,1.0,1.0); 
    lowp vec3 b = vec3(0.0,0.0,0.0); 
    lowp vec3 mix = mix(b, w, (v_texCoord.y-(float(slices)/10.0))); 
    gl_FragColor = texture2D(u_texture0,v_texCoord) * vec4(mix, 1.0); 
} 

그러나이 쉐이더는 다음과 만드는 : current result 을 그리고 내가 회전 행렬에 너무 많은 다른 매개 변수를 시도하는 방법을 "플립"이미지 수평 몰라 (난 소위를 사용하려고 "거울 매트릭스") 그러나 나는 원래 이미지의 바닥에 이미지를 반영하는 방법을 모른다.

Answer 1

"coversflow"결과로 images.google.com에서 반환하는 내용에 대해 이야기하고 있다면 회전 매트릭스가 전혀 필요하지 않습니다.

void main() 
{ 
    gl_Position = (u_projectionMatrix * u_modelViewMatrix) * a_position; 
    v_color = a_color; 
    v_texCoord = vec2(a_texcoord.x, 1.0 - a_texcoord.y); 
} 

단순히 수직으로 뒤집습니다.

매트릭스 사용을 고집하고 "미러링"셰이더 (오브젝트를 가져 와서 반사를 만들기 위해 "플로어"아래에 놓는 것)를 만들고 싶다면 미러 매트릭스가 필요합니다. 앞면/뒷면 커팅) :

mat4(1.0, 0.0, 0.0, 0.0, 
    0.0, -1.0, 0.0, 0.0, 
    0.0, 0.0, 1.0, 0.0, 
    0.0, 0.0, 0.0, 1.0); 

그리고 바닥이 어디인지를 알아야합니다.

gl_Position = (u_projectionMatrix * u_modelViewMatrix) * (a_position * mirrorMatrix - floor); 

또는 동일한 매트릭스에 바닥 변환을 넣을 수 있습니다. 기본적으로 임의의 높이에 대해 대칭하려면 3 개의 변환 (의사 코드)을 결합해야합니다.

translate(0, -floorHeight, 0) * scale(1, -1, 1) * translate(0, floorHeight, 0).

행렬에 입력하십시오.

또한 modelView 매트릭스를 "모델"(오브젝트/월드) 및 "보기"매트릭스로 분리하는 것이 좋습니다. 이렇게하면 이러한 변형을 쉽게 수행 할 수 있습니다.