[DX11] Texture와 UV좌표

1. UV좌표

• UV 좌표는 텍스처 이미지 상에서 특정 지점을 나타내는 2D 좌표입니다.
• 텍스처 이미지의 가로 및 세로 축에서의 상대적인 위치를 나타냅니다.

• 다음 그림과 같이 UV 좌표는 모델의 각 정점에 연결되어 해당 정점이 텍스처의 어느 부분에 매핑되는지를 결정하게 됩니다.
  

• UV좌표를 사용하여 위와 같은 사각형 뿐만 아니라, 복잡한 형태의 Model에도 각 정점에 특정 좌표를 연관지어 텍스처를 모델에 적용할 수 있습니다.

---

2. 텍스쳐

• Texture는 이미지나 그림을 나타내는 데이터로 UV좌표를 사용해 특정 모형에 부착시키는 형식으로 적용이 가능합니다.
• DirectXTex 라이브러리 사용해 텍스쳐를 불러오는 실습을 진행하였습니다.

• DirectX11에서는 텍스쳐를 다음과 같은 순서로 사용할 수 있습니다.

1. VertexLayout에 사용될 구조체에 uv에 대한 값 추가하기.

struct Vertex
{
	// 위치 좌표 (x, y, z)
	Vec3 position;
	// 텍스처 좌표 (u, v)
	Vec2 uv;
};

2. uv좌표를 포함한 정점 정보(Vertices & indices) 생성하기

	// Vertex Data
	{
		// 사이즈 조정
		_vertices.resize(4);

		// 위치 정보와 uv 좌표를 설정합니다.
		_vertices[0].position = Vec3(-0.5f, -0.5f, 0.0f);
		_vertices[0].uv = Vec2(0.0f, 1.0f);		

		_vertices[1].position = Vec3(-0.5f, 0.5f, 0.0f);
		_vertices[1].uv = Vec2(0.0f, 0.0f);

		_vertices[2].position = Vec3(0.5f, -0.5f, 0.0f);
		_vertices[2].uv = Vec2(1.0f, 1.0f);

		_vertices[3].position = Vec3(0.5f, 0.5f, 0.0f);
		_vertices[3].uv = Vec2(1.0f, 0.0f);
	}

3. Texture(이미지)를 불러와 셰이더에 전달하기 위한 SRV(Shader Resource View)에 저장하기.

	DirectX::TexMetadata md;
	DirectX::ScratchImage img;

	// 이미지를 불러옵니다. (DirectXTex 라이브러리 사용)
	HRESULT hr = ::LoadFromWICFile(L"test.png", WIC_FLAGS_NONE, &md, img);
	CHECK(hr);

	// SRV를 생성합니다.
	hr = ::CreateShaderResourceView(_device.Get(), img.GetImages(), img.GetImageCount(), md, _shaderResourceView.GetAddressOf());
	CHECK(hr);

4. 생성한 SRV를 PS(Pixel Shader)에 연결해주기

// 디바이스 컨텍스트를 이용해 PS에 만든 셰이더 리소스 뷰를 연결시켜줍니다.
_deviceContext->PSSetShaderResources(0, 1, _shaderResourceView.GetAddressOf());

5. 셰이더 파일에서 SRV를 받기 위한 Texture2D 변수를 선언하고, PS 단계에서 Sampling 진행하기

// t0 레지스터에 texture0을 등록합니다.
Texture2D texture0 : register(t0);
// s0 레지스터에 sampler0을 등록합니다.
SamplerState sampler0 : register(s0);

// PixelShader의 메인 함수를 정의합니다.
// * (VS_OUTPUT input) : VS 단계에서 리턴해준 output을 입력 파라미터로 전달 받습니다.
// * SV_Target		   : PS의 결과물이 SV_Target(렌더 타겟)에 전달합니다.
float4 PS(VS_OUTPUT input) : SV_Target
{
	// texture0번의 uv좌표에 해당하는 색상 정보를 저장합니다.
	float4 color = texture0.Sample(sampler0, input.uv);

	// uv좌표에 해당하는 색상 정보를 반환합니다.
	return color;
}

---

정리

• UV좌표 : UV 좌표는 텍스처 이미지 상에서 특정 지점을 나타내는 2D 좌표
• 이미지 출력 순서
  1. 텍스쳐를 사용하기 위한 기본 Mesh에 UV좌표 매핑하기
  2. 텍스쳐(texture) 파일을 먼저 로드해 CPU 메모리에 들고 있기
  3. 텍스쳐를 묘사하는 SRV를 만들어 GPU에 전달하기