셰이더 프로그래밍 입문 Chapter

쉬운 목차

텍스처 매핑

텍스처를 개체에 매핑하는 방법을 알아봅니다.

텍스처 매핑 및 UV 좌표

텍스처 매핑 방법

3D 객체를 구성하는 요소는 삼각형입니다. 삼각형은 3개의 꼭지점으로 구성 생성 삼각형의 각 정점은 텍스처의 픽셀에 해당합니다.

UV 좌표

– 모든 값을 백분율로 표현

(텍스처 이미지 파일 크기 조정에 관계없이 텍스처를 일관되게 매핑하려면)

– 좌표는 xy 좌표계에 있습니다. 대신에 UV 좌표계사용

(기존의 x,y와 구분하기 위함)

예

위에서 설명한 백분율을 사용하여 UV 좌표계(u,v)를 사용한 텍스처 매핑의 예가 그림에 나와 있습니다.

위 내용을 바탕으로 RenderMonkey로 구현합니다.

2장에서 설정할 DiffuseMap 및 DiffuseSampler를 추가했습니다.

버텍스 쉐이더

struct VS_INPUT
{
   float4 mPosition : POSITION;
   //텍스처 멤버변수 float2(u,v)
   float2 mTexCoord : TEXCOORD0;
};

struct VS_OUTPUT
{
   float4 mPosition : POSITION;
   //텍스처 멤버변수 float2(u,v)
   float2 mTexCoord : TEXCOORD0;
};

float4x4 gWorldMatrix;
float4x4 gViewMatrix;
float4x4 gProjectionMatrix;

VS_OUTPUT vs_main(VS_INPUT Input)
{
   VS_OUTPUT Output;
   Output.mPosition = mul(Input.mPosition, gWorldMatrix);
   Output.mPosition = mul(Output.mPosition, gViewMatrix);
   Output.mPosition = mul(Output.mPosition, gProjectionMatrix);
   
   //uv 좌표는 공간변환이 필요 없으므로 그대로 전달
   Output.mTexCoord = Input.mTexCoord;
   
   return Output;
}

이전 코드에 없었던 것들을 살펴보겠습니다.

float2 mTexCoord : TEXCOORD0

– UV 좌표 위치를 버텍스 쉐이더 입출력 구조체의 멤버 변수로 저장

– UV 좌표의 위치는 시맨틱 TEXCOORD0을 사용합니다(0이 추가된 이유는 여러 텍스처와 함께 TEXCOORD0, TEXCOORD1 …이 사용됨)

Output.mTexCoord = Input.mTexCoord

– UV 좌표는 3D 공간에 존재하지 않으므로 공간 변환이 필요하지 않습니다.

– 삼각형의 표면에 그릴 것이므로 그대로 전달됩니다.

정점 셰이더 출력 데이터

float2인 이유 mTexCoord: TEXCOORD0

– 정점 셰이더는 래스터라이저가 픽셀을 찾을 수 있도록 위치 정보를 반환합니다.

– UV 좌표는 픽셀 셰이더가 위치 정보 이외의 정보를 필요로 하는 경우의 좋은 예입니다.

– 픽셀 셰이더는 정점 버퍼 데이터에 직접 액세스할 수 없습니다. 따라서 텍스처 매핑을 위해서는 UV 좌표와 같은 정점 데이터를 꼭짓점 셰이더를 통해 픽셀 셰이더에 전달하여 사용해야 합니다.

– 보간기가 픽셀의 올바른 UV 값을 얻은 후 UV 좌표가 픽셀 쉐이더로 전달됩니다.

보간기는 정점 셰이더가 변환하는 각 값을 보간하고 전달합니다.

정점 데이터 정점 셰이더 래스터라이저/보간기 픽셀 셰이더 화면 출력

픽셀 셰이더

//텍셀을 구할 때 사용하는 텍스처 샘플러
sampler2D DiffuseSampler;

//픽셀셰이더 입력 구조체
struct PS_INPUT
{
   //텍스처 uv좌표
   float2 mTexCoord : TEXCOORD0;
   
};

//uv좌표를 받기 위해 Input 매개변수를 받음
float4 ps_main( PS_INPUT Input) : COLOR
{
   //uv값과 텍스처샘플러로 텍셀 값을 구함
   float4 albedo = tex2D(DiffuseSampler, Input.mTexCoord);
   //텍스처를 보여주기위해 값을 그대로 반환
   return albedo.rgba;
}

TEXCOORD(FLOAT2)를 StreamMapping에 추가하고 정점 버퍼에서 올바른 UV 좌표 값을 로드하도록 설정합니다.

tex2D(DiffuseSampler, Input.mTexCoord)

– 텍스처 샘플러와 UV 값을 사용하여 텍셀 값을 계산하는 HLSL 내장 함수

– 첫 번째 매개변수로 텍스처 샘플러를 가져오고 두 번째 매개변수로 UV 좌표를 가져옵니다.

반환 albedo.rgba

– HLSL에서는 벡터 유형 변수 뒤에 xyzw 또는 rgba와 같은 접미사를 통해 벡터의 구성 요소에 액세스할 수 있습니다.

float4에서 RGB 값만 가져오고 싶다면	알베도.rgb
Float4의 역순	Albedo.bgra;
Float4에 같은 값을 가진 채널만 반복되는 경우	알베도.rrra;