DirectX11 Tutorial 33: 불꽃

강좌번역/DirectX 11 2017. 10. 25. 17:25 by 빠재

원문: Tutorial 33: Fire

이번 예제에서는 HLSL과 C++를 이용하여 DirectX 11에서 불 셰이더를 구현하는 법을 설명하겠습니다. 코드 베이스는 이전 튜토리얼에서 이어집니다.

DirectX에서 가장 현실적인 불 효과를 만드는 방법 중 하나는 노이즈 텍스쳐를 사용하는 것인데 이전의 물, 유리, 얼음에서 했던 것과 같이 텍스쳐의 샘플링 위치를 흩뜨려 놓게 합니다. 이전 것들과의 차이점은 바로 노이즈 텍스쳐를 수정하고 텍스쳐 좌표를 흩뜨려 놓는 방법이 다르다는 것입니다.

우선 아래 회색조의 노이즈 텍스쳐를 보겠습니다:

이 노이즈 텍스쳐는 여러 그래픽 툴을 이용하여 절차적으로 생성할 수 있습니다. 기억해야 할 것은 불 처럼 보이는 노이즈 설정을 찾아내야 한다는 것입니다.

불 효과를 만들기 위해 필요한 두 번째 텍스쳐는 불의 색상으로 구성된 노이즈와 화염의 경계가 보이는 텍스쳐입니다. 일례로 아래 보이는 텍스쳐는 불의 색상이 포함된 펄린 노이즈와 작은 화염의 텍스쳐로 구성되어 있습니다. 텍스쳐의 중간 아래쯤을 보시면 불꽃심과 속불꽃 부분을 보실 수 있습니다.

마지막으로 투명도를 위한 알파 텍스쳐를 사용하여 최종 모습이 작은 불꽃처럼 보이게 할 것입니다. 텍스쳐의 모습이 적당히 그려져 있어도 흩뜨려진 샘플링 위치가 불꽃의 형태를 잘 만들어줄 것입니다.

세 가지 텍스쳐가 준비되었으니 셰이더가 어떻게 동작하는지 설명할 차례입니다. 가장 먼저 하는 것은 노이즈 텍스쳐를 가져다가 세 개의 서로 다른 텍스쳐를 만들어내는 것입니다. 이 세 텍스쳐들은 원본은 같지만 전부 다르게 스케일링됩니다. 이 스케일링된 것들은 단순히 원본 텍스쳐를 반복 나열하여 디테일한 텍스쳐를 만든 것이므로 옥타브라고 부릅니다. 아래 세 노이즈 텍스쳐들은 1배, 2배, 3배 스케일링된 것들입니다:

또한 이 노이즈 텍스쳐들을 위쪽으로 스크롤시켜 불꽃이 위쪽으로 타로오르는 듯한 모양을 만들어낼 것입니다. 이 스크를 속도는 텍스쳐마다 다르게 설정할 것입니다. 결국에는 모든 노이즈 텍스쳐들이 혼합될 것이기 때문에 서로 다른 스킄롤 속도는 불꽃의 깊이를 더해줍니다.

다음 단계는 (0, 1) 범위의 값인 노이즈 텍스쳐들을 (-1, +1) 범위로 변환하는 것입니다. 이렇게 하면 일부 노이즈가 사라지게 하고 좀 더 불꽃 모양에 가깝게 되게 합니다. 예를 들어 앞서 보여드렸던 노이즈 텍스쳐를 다음과 같이 보일 것입니다:

모든 노이즈 텍스쳐를 (-1, +1)범위로 만들면 각 텍스쳐의 x축과 y축을 왜곡시킬 수 있습니다. 물이나 유리, 얼음 셰이더에서 했던 것과 비슷하게 노이즈의 크기를 스케일링하여 노이즈 텍스쳐를 왜곡시키게 됩니다. 노이즈 텍스쳐가 왜곡되고 나면 세 노이즈 텍스쳐 전부를 혼합하여 최종 노이즈 텍스쳐 모양을 만듭니다.

기억해야 할 것은 여기서 사용하는 왜곡이 오로지 x축과 y축으로만 이루어지기 때문에 이전에 노말맵을 이용하여 했던 것과 같이 마치 샘플링 위치를 정하기 위한 룩업 테이블처럼 사용될 것입니다. z축은 2D 샘플링에서는 이용되지 않기 때문에 무시됩니다.

또한 세 노이즈 텍스쳐 모두 각 프레임마다 서로 다른 속도로 위쪽 스크롤되기 때문에 이것들을 혼합하게 되면 정말로 불꽃과 같이 흐르는 듯한 노이즈가 만들어진다는 것을 기억하시기 바랍니다.

그 다음 단계는 매우 중요한데, 바로 원본 불꽃 색상 텍스쳐를 흩뜨리는 것입니다. 물이나 유리, 얼음 셰이더에서는 노말맵을 사용하여 샘플링 위치를 바꾸었습니다. 하지만 불꽃 예제에서는 노이즈 텍스쳐를 그 용도로 사용할 것입니다. 그러나 그 전에 노이즈 자체의 샘플링 위치도 흩뜨려져야 할 것입니다. 왜곡 스케일과 여백 값을 사용하여 왜곡이 텍스쳐 위쪽에서는 더 크게 되고 아래로 갈수록 적게 일어나도록 할 것인데, 이렇게 하여 불꽃이 아래쪽은 굳건하고 위로 갈 수록 불꽃이 핥는 듯한 모양을 만들 것입니다. 다시 말해 노이즈 역시 텍스쳐 아래쪽부터 시작해 y축을 따라 올라가면서 위로 갈수록 더 큰 값으로 왜곡을 할 것입니다.

왜곡된 최종 노이즈 텍스쳐를 룩업 테이블처럼 사용하여 불꽃 색상 텍스쳐를 샘플링할 것입니다. 참고로 색상 텍스쳐를 샘플링할 때에는 Wrap 대신 Clamp를 사용하여 바닥쪽이 망가지지 않게 합니다. 왜곡된 노이즈 텍스쳐를 이용하여 샘플링된 불꽃 색상 텍스쳐는 다음과 같이 보일 것입니다:

꽤 그럴듯하게 불타오르는 모양의 사각형이 있으니 더욱 불꽃같이 다듬어 보도록 하겠습니다. 이를 위해 알파 블렌딩을 켜고 앞서 만들었던 알파 텍스쳐를 사용할 것입니다. 흩뜨려 놓은 노이즈 텍스쳐를 사용하여 알파 텍스쳐를 샘플링하면 알파 텍스쳐를 더욱 타오르는 불꽃처럼 보이게 만들 수 있다는 것이 핵심입니다. 또한 샘플링할 때 wrap대신 clamp을 좌표에 사용하여 불꽃의 바닥 주위에서 텍스쳐의 위쪽을 사용하는 것을 방지해야 합니다. 흩뜨려 샘플링한 알파 텍스쳐를 적용하면 아래와 같은 결과를 얻을 수 있습니다:

이펙트를 완성하기 위해 만들어낸 알파 값을 불꽃의 알파 채널에 사용하여 알파블렌딩으로 마무리될 수 있게 합니다:

실제 움직이는 모습을 본다면 정말 현실적으로 보일 겁니다.


프레임워크

프레임워크에는 TextureShaderClass에 불꽃 효과 부분이 업데이트된 FireShaderClass가 추가되었습니다.

HLSL 불꽃 셰이더부터 코드를 살펴보도록 하겠습니다.


Fire.vs

////////////////////////////////////////////////////////////////////////////////
// Filename: fire.vs
////////////////////////////////////////////////////////////////////////////////


/////////////
// GLOBALS //
/////////////
cbuffer MatrixBuffer
{
    matrix worldMatrix;
    matrix viewMatrix;
    matrix projectionMatrix;
};

정점 셰이더에 매 프레임마다 계산한 값들을 저장할 상수 버퍼를 선언합니다.

첫번째 변수인 frameTime은 매 프레임마다 증가하는 시간 값으로 갱신되어 셰이더가 노이즈 텍스쳐들을 스크롤할 수 있게 됩니다. 두 번째 변수인 scrollSpeeds는 서로 다른 스크롤 속도값을 저장하는데 사용할 원소 3개짜리 배열입니다. x값이 첫번째 노이즈 텍스쳐의 스크롤 속도입니다. y값이 두번째 노이즈 텍스쳐 스크롤 속도입니다. 그리고 z값이 세번째 노이즈 텍스쳐의 스크롤 속도입니다. 세번째 변수인 scales는 세 노이즈 텍스쳐의 서로 다른 스케일 값(또는 옥타브값)을 담고 있습니다. x, y, z값은 일반적으로 각각 1, 2, 3이 지정됩니다. 이렇게 하면 첫 번째 노이즈 텍스쳐는 한 개짜리 타일이 됩니다. 두 번째 텍스쳐는 수직/수평 방향으로 두번씩 타일링이 이루어집니다. 그리고 마지막으로 세 번째 노이즈 텍스쳐는 두 방향으로 세번 타일링됩니다.

마지막 변수는 padding입니다. NoiseBuffer을 만드는 데 사용되는 float 변수인데 NoiseBuffer의 크기는 16의 배수입니다. 이 변수의 값은 보통 0.0f입니다.

cbuffer NoiseBuffer
{
    float frameTime;
    float3 scrollSpeeds;
    float3 scales;
    float padding;
};


//////////////
// TYPEDEFS //
//////////////
struct VertexInputType
{
    float4 position : POSITION;
    float2 tex : TEXCOORD0;
};

PixelInputType 구조체는 세 개의 다른 텍스쳐 좌표가 추가되었습니다. 이를 사용하여 같은 노이즈 텍스쳐를 서로 다른 세 방법으로 샘플링할 수 있기 때문에 간단히 하나의 텍스쳐에서 세 개의 다른 노이즈 텍스쳐를 만들어 낼 수 있습니다.

struct PixelInputType
{
    float4 position : SV_POSITION;
    float2 tex : TEXCOORD0;
    float2 texCoords1 : TEXCOORD1;
    float2 texCoords2 : TEXCOORD2;
    float2 texCoords3 : TEXCOORD3;
};


////////////////////////////////////////////////////////////////////////////////
// Vertex Shader
////////////////////////////////////////////////////////////////////////////////
PixelInputType FireVertexShader(VertexInputType input)
{
    PixelInputType output;

    // 올바른 행렬 연산을 위해 위치 벡터의 성분이 4개가 되도록 합니다
    input.position.w = 1.0f;

    // 정점의 위치를 월드, 뷰, 투영 행렬에 대해 각각 계산합니다.
    output.position = mul(input.position, worldMatrix);
    output.position = mul(output.position, viewMatrix);
    output.position = mul(output.position, projectionMatrix);
    
    // Store the texture coordinates for the pixel shader.
    output.tex = input.tex;

여기서 세 개의 다른 샘플링 좌표값을 만들어 내고 이를 이용하여 세 개의 다른 노이즈 텍스쳐를 만들 수 있습니다. 각 텍스쳐 좌표마다 스케일 값을 곱해주어 그 값에 따라 텍스쳐가 타일링되게 합니다. 그리고 나서 frameTimescrollSpeeds배열의 값들을 사용하여 세 개의 y좌표값들이 스크를되게 합니다. scrollSpeeds배열의 값들을 다 다르게 하면 불꽃에 공간감이 더해집니다.

    // 첫번째 노이즈 텍스쳐의 좌표를 첫번째 크기 및 윗방향 스크롤 속도 값을 이용하여 계산합니다.
    output.texCoords1 = (input.tex * scales.x);
    output.texCoords1.y = output.texCoords1.y + (frameTime * scrollSpeeds.x);

    // 두번째 노이즈 텍스쳐의 좌표를 두번째 크기 및 윗방향 스크롤 속도 값을 이용하여 계산합니다.
    output.texCoords2 = (input.tex * scales.y);
    output.texCoords2.y = output.texCoords2.y + (frameTime * scrollSpeeds.y);

    // 세번째 노이즈 텍스쳐의 좌표를 세번째 크기 및 윗방향 스크롤 속도 값을 이용하여 계산합니다.
    output.texCoords3 = (input.tex * scales.z);
    output.texCoords3.y = output.texCoords3.y + (frameTime * scrollSpeeds.z);
    
    return output;
}

Fire.ps

////////////////////////////////////////////////////////////////////////////////
// Filename: fire.ps
////////////////////////////////////////////////////////////////////////////////


/////////////
// GLOBALS //
/////////////

불꽃 효과에 사용할 세 개의 텍스쳐는 각각 불꽃 색상 텍스쳐, 노이즈 텍스쳐, 알파 텍스쳐입니다.

Texture2D fireTexture : register(t0);
Texture2D noiseTexture : register(t1);
Texture2D alphaTexture : register(t2);
SamplerState SampleType;

Clamp를 사용하는 두 번째 SamplerState를 선언합니다. 첫번째 SamplerState에 사용하는 Wrap은 불꽃 텍스쳐를 한바퀴 돌아 샘플링하기 때문에 효과를 망칩니다.

SamplerState SampleType2;

불꽃 효과를 만들기 위해서 이 픽셀 셰이더에 DistortionBuffer이라는 상수 버퍼가 있습니다. 버퍼에 세 개의 distortion* 변수는 각각 x와 y값이 있는데, 세 개의 노이즈 텍스쳐를 각각 다르게 찌그러트리는 데 사용될 것입니다. 버퍼에 있는 distortionScaledistortionBias 변수는 혼합된 최종 노이즈 텍스쳐를 흩뜨릴 때 사용하여 결과물이 불꽃 모양이 되도록 할 것입니다.

cbuffer DistortionBuffer
{
    float2 distortion1;
    float2 distortion2;
    float2 distortion3;
    float distortionScale;
    float distortionBias;
};


//////////////
// TYPEDEFS //
//////////////
struct PixelInputType
{
    float4 position : SV_POSITION;
    float2 tex : TEXCOORD0;
    float2 texCoords1 : TEXCOORD1;
    float2 texCoords2 : TEXCOORD2;
    float2 texCoords3 : TEXCOORD3;
};


////////////////////////////////////////////////////////////////////////////////
// Pixel Shader
////////////////////////////////////////////////////////////////////////////////
float4 FirePixelShader(PixelInputType input) : SV_TARGET
{
    float4 noise1;
    float4 noise2;
    float4 noise3;
    float4 finalNoise;
    float perturb;
    float2 noiseCoords;
    float4 fireColor;
    float4 alphaColor;

우선 노이즈 텍스쳐를 세 가지 다른 방법으로 샘플링하여 세 가지의 노이즈 값을 만듭니다. 그 다음에 픽셀 값을 (-1, +1) 범위가 되도록 조절합니다.

    // 동일한 노이즈 텍스쳐를 서로 다른 세 텍스쳐 좌표를 사용하여 세 개의 다른 크기의 노이즈를 얻습니다.
    noise1 = noiseTexture.Sample(SampleType, input.texCoords1);
    noise2 = noiseTexture.Sample(SampleType, input.texCoords2);
    noise3 = noiseTexture.Sample(SampleType, input.texCoords3);

    // 노이즈 값의 범위를 (0, 1)에서 (-1, +1)이 되도록 합니다.
    noise1 = (noise1 - 0.5f) * 2.0f;
    noise2 = (noise2 - 0.5f) * 2.0f;
    noise3 = (noise3 - 0.5f) * 2.0f;

샘플링 좌표값의 x, y의 크기를 distortion*값에 따라 줄입니다. 세 텍스쳐 값들을 하나로 합치고 나면 이 픽셀에 사용될 최종 노이즈 값이 됩니다.

    // 노이즈의 x와 y값을 세 개의 다른 왜곡 x및 y좌표로 흩뜨립니다.
    noise1.xy = noise1.xy * distortion1.xy;
    noise2.xy = noise2.xy * distortion2.xy;
    noise3.xy = noise3.xy * distortion3.xy;

    // 왜곡된 세 노이즈 값들을 하나의 노이즈로 함성합니다.
    finalNoise = noise1 + noise2 + noise3;

최종 노이즈 값을 흩뜨려서 전체적인 노이즈 텍스쳐의 모양새가 불꽃처럼 보이도록 합니다. 참고로 흩뜨리는 정도는 위쪽에서 더 크게 하고 아래로 갈 수록 적게 흩뜨려지게 합니다. 이렇게 하면 뒤쪽에서는 깜빡거리는 불꽃이 생기고 아래로 내려갈수록 흔들리지 않는 불꽃심 모양이 만들어지게 됩니다.

    // 입력으로 들어온 텍스쳐의 Y좌표를 왜곡 크기와 바이어스 값으로 교란시킵니다.
    // 이 교란은 텍스쳐의 위쪽으로 갈수록 강해져서 맨 위쪽에는 깜박이는 효과를 만들어냅니다.
    perturb = ((1.0f - input.tex.y) * distortionScale) + distortionBias;

    // 불꽃 색상 텍스쳐를 샘플링하는데 사용될 왜곡 및 교란된 텍스쳐 좌표를 만듭니다.
    noiseCoords.xy = (finalNoise.xy * perturb) + input.tex.xy;

불꽃 색상 텍스쳐와 알파 텍스쳐를 흩뜨려진 노이즈 좌표에 따라 샘플링하여 불꽃 효과를 만들어 냅니다.

    // 왜곡되고 교란된 텍스쳐 좌표를 이용하여 불꽃 텍스쳐에서 색상을 샘플링합니다.
    // wrap를 사용하는 스테이트 대신 clamp를 사용하는 스테이트를 사용하여 불꽃 텍스쳐가 래핑되는 것을 방지합니다.
    fireColor = fireTexture.Sample(SampleType2, noiseCoords.xy);

    // 왜곡되고 교란된 텍스쳐 좌표를 이용하여 알파 텍스쳐에서 알파값을 샘플링합니다.
    // 불꽃의 투명도를 지정하는 데 사용될 것입니다.
    // wrap를 사용하는 스테이트 대신 clamp를 사용하는 스테이트를 사용하여 불꽃 텍스쳐가 래핑되는 것을 방지합니다.
    alphaColor = alphaTexture.Sample(SampleType2, noiseCoords.xy);

알파 값과 불꽃 색상을 조합하여 투명도가 블렌딩된 불꽃 효과를 얻습니다.

    // 왜곡 및 교란된 알파 텍스쳐 값을 알파블렌딩에 사용합니다.
    fireColor.a = alphaColor;
    
    return fireColor;
}

Fireshaderclass.h

FireShaderClassTextureShaderClass를 불꽃 효과 용도로 수정한 것입니다.

////////////////////////////////////////////////////////////////////////////////
// Filename: fireshaderclass.h
////////////////////////////////////////////////////////////////////////////////
#ifndef _FIRESHADERCLASS_H_
#define _FIRESHADERCLASS_H_


//////////////
// INCLUDES //
//////////////
#include <d3d11.h>
#include <d3dx10math.h>
#include <d3dx11async.h>
#include <fstream>
using namespace std;


////////////////////////////////////////////////////////////////////////////////
// Class name: FireShaderClass
////////////////////////////////////////////////////////////////////////////////
class FireShaderClass
{
private:
    struct MatrixBufferType
    {
        D3DXMATRIX world;
        D3DXMATRIX view;
        D3DXMATRIX projection;
    };

정점 셰이더에는 노이즈를 계산하기 위한 변수가 있는 상수 버퍼를 가지고 있기 때문에 그 값을 코드에서 세팅할 수 있도록 같은 모양으로 구조체를 만들어 줍니다. 이 구조체에는 프레임 속도, 세 개의 다른 스크롤 속도 그리고 세 개의 노이즈 크기 변수가 들어 있습니다. 또한 노이즈 버퍼를 만들 때 그 크기가 16의 배수가 되어야 하기 때문에 위해 이 구조체에는 padding 변수가 있습니다.

    struct NoiseBufferType
    {
        float frameTime;
        D3DXVECTOR3 scrollSpeeds;
        D3DXVECTOR3 scales;
        float padding;
    };

또한 픽셀 셰이더에는 불꽃 효과를 만들 때 노이즈 값들을 흩뜨리기 위한 값들이 있는 상수 버퍼가 있습니다. 아래 구조체가 버퍼와 함께 사용되어 픽셀 셰이더에 그 값을 세팅할 수 있게 됩니다. 이 구조체는 세 개의 왜곡 배열과 왜곡 크기 및 바이어스 값이 있습니다.

    struct DistortionBufferType
    {
        D3DXVECTOR2 distortion1;
        D3DXVECTOR2 distortion2;
        D3DXVECTOR2 distortion3;
        float distortionScale;
        float distortionBias;
    };

public:
    FireShaderClass();
    FireShaderClass(const FireShaderClass&);
    ~FireShaderClass();

    bool Initialize(ID3D11Device*, HWND);
    void Shutdown();
    bool Render(ID3D11DeviceContext*, int, D3DXMATRIX, D3DXMATRIX, D3DXMATRIX, ID3D11ShaderResourceView*, ID3D11ShaderResourceView*, 
            ID3D11ShaderResourceView*, float, D3DXVECTOR3, D3DXVECTOR3, D3DXVECTOR2, D3DXVECTOR2, D3DXVECTOR2, float, float);

private:
    bool InitializeShader(ID3D11Device*, HWND, WCHAR*, WCHAR*);
    void ShutdownShader();
    void OutputShaderErrorMessage(ID3D10Blob*, HWND, WCHAR*);

    bool SetShaderParameters(ID3D11DeviceContext*, D3DXMATRIX, D3DXMATRIX, D3DXMATRIX, ID3D11ShaderResourceView*, 
                 ID3D11ShaderResourceView*, ID3D11ShaderResourceView*, float, D3DXVECTOR3, D3DXVECTOR3, D3DXVECTOR2, 
                 D3DXVECTOR2, D3DXVECTOR2, float, float);
    void RenderShader(ID3D11DeviceContext*, int);

private:
    ID3D11VertexShader* m_vertexShader;
    ID3D11PixelShader* m_pixelShader;
    ID3D11InputLayout* m_layout;
    ID3D11Buffer* m_matrixBuffer;

정점 셰이더에 있는 노이즈 상수 버퍼입니다.

    ID3D11Buffer* m_noiseBuffer;
    ID3D11SamplerState* m_sampleState;

불꽃 효과에 사용할 샘플러 스테이트는 Wrap대신 Clamp를 사용합니다.

    ID3D11SamplerState* m_sampleState2;

픽셀 셰이더에 있는 왜곡 상수 버퍼입니다.

    ID3D11Buffer* m_distortionBuffer;
};

#endif

Fireshaderclass.cpp

////////////////////////////////////////////////////////////////////////////////
// Filename: fireshaderclass.cpp
////////////////////////////////////////////////////////////////////////////////
#include "fireshaderclass.h"

클래스 생성자에서 모든 private 멤버 포인터들을 null로 초기화합니다.

FireShaderClass::FireShaderClass()
{
    m_vertexShader = 0;
    m_pixelShader = 0;
    m_layout = 0;
    m_matrixBuffer = 0;
    m_noiseBuffer = 0;
    m_sampleState = 0;
    m_sampleState2 = 0;
    m_distortionBuffer = 0;
}


FireShaderClass::FireShaderClass(const FireShaderClass& other)
{
}


FireShaderClass::~FireShaderClass()
{
}


bool FireShaderClass::Initialize(ID3D11Device* device, HWND hwnd)
{
    bool result;

fire.vsfire.ps HLSL 파일을 불러옵니다.

    // 정점 및 픽셀 셰이더를 초기화합니다.
    result = InitializeShader(device, hwnd, L"../Engine/fire.vs", L"../Engine/fire.ps");
    if(!result)
    {
        return false;
    }

    return true;
}


void FireShaderClass::Shutdown()
{
    // 정점 및 픽셀 셰이더를 관련된 객체들과 함깨 정리합니다.
    ShutdownShader();

    return;
}

Render 함수는 불꽃 모양을 내기 위해 필요한 모든 수치값을 인자로 받습니다. 이 인자들은 SetShaderParameters 함수를 통해 셰이더에 설정됩니다. 렌더링에 필요한 모든 값이 설정되고 나면 RenderShader 함수를 호출합니다.

bool FireShaderClass::Render(ID3D11DeviceContext* deviceContext, int indexCount, D3DXMATRIX worldMatrix, D3DXMATRIX viewMatrix, 
                 D3DXMATRIX projectionMatrix, ID3D11ShaderResourceView* fireTexture, 
                 ID3D11ShaderResourceView* noiseTexture, ID3D11ShaderResourceView* alphaTexture, float frameTime,
                 D3DXVECTOR3 scrollSpeeds, D3DXVECTOR3 scales, D3DXVECTOR2 distortion1, D3DXVECTOR2 distortion2,
                 D3DXVECTOR2 distortion3, float distortionScale, float distortionBias)
{
    bool result;


    // 렌더링에 사용할 셰이더 인자들을 설정합니다.
    result = SetShaderParameters(deviceContext, worldMatrix, viewMatrix, projectionMatrix, fireTexture, noiseTexture, alphaTexture, 
                     frameTime, scrollSpeeds, scales, distortion1, distortion2, distortion3, distortionScale, 
                     distortionBias);
    if(!result)
    {
        return false;
    }

    // 셰이더를 이요하여 준비된 버퍼에 렌더링합니다.
    RenderShader(deviceContext, indexCount);

    return true;
}


bool FireShaderClass::InitializeShader(ID3D11Device* device, HWND hwnd, WCHAR* vsFilename, WCHAR* psFilename)
{
    HRESULT result;
    ID3D10Blob* errorMessage;
    ID3D10Blob* vertexShaderBuffer;
    ID3D10Blob* pixelShaderBuffer;
    D3D11_INPUT_ELEMENT_DESC polygonLayout[2];
    unsigned int numElements;
    D3D11_BUFFER_DESC matrixBufferDesc;
    D3D11_BUFFER_DESC noiseBufferDesc;
    D3D11_SAMPLER_DESC samplerDesc;
    D3D11_SAMPLER_DESC samplerDesc2;
    D3D11_BUFFER_DESC distortionBufferDesc;


    // 이 함수에서 사용할 포인터들을 null로 초기화합니다.
    errorMessage = 0;
    vertexShaderBuffer = 0;
    pixelShaderBuffer = 0;

불꽃 정점 셰이더를 로드합니다.

    // 정점 셰이더를 컴파일합니다.
    result = D3DX11CompileFromFile(vsFilename, NULL, NULL, "FireVertexShader", "vs_5_0", D3D10_SHADER_ENABLE_STRICTNESS, 0, NULL, 
                       &vertexShaderBuffer, &errorMessage, NULL);
    if(FAILED(result))
    {
        // If the shader failed to compile it should have writen something to the error message.
        if(errorMessage)
        {
            OutputShaderErrorMessage(errorMessage, hwnd, vsFilename);
        }
        // If there was  nothing in the error message then it simply could not find the shader file itself.
        else
        {
            MessageBox(hwnd, vsFilename, L"Missing Shader File", MB_OK);
        }

        return false;
    }

불꽃 픽셀 셰이더를 로드합니다.

    // 픽셀 셰이더를 컴파일합니다.
    result = D3DX11CompileFromFile(psFilename, NULL, NULL, "FirePixelShader", "ps_5_0", D3D10_SHADER_ENABLE_STRICTNESS, 0, NULL, 
                       &pixelShaderBuffer, &errorMessage, NULL);
    if(FAILED(result))
    {
        // If the shader failed to compile it should have writen something to the error message.
        if(errorMessage)
        {
            OutputShaderErrorMessage(errorMessage, hwnd, psFilename);
        }
        // If there was  nothing in the error message then it simply could not find the file itself.
        else
        {
            MessageBox(hwnd, psFilename, L"Missing Shader File", MB_OK);
        }

        return false;
    }

    // Create the vertex shader from the buffer.
    result = device->CreateVertexShader(vertexShaderBuffer->GetBufferPointer(), vertexShaderBuffer->GetBufferSize(), NULL, 
                        &m_vertexShader);
    if(FAILED(result))
    {
        return false;
    }

    // Create the vertex shader from the buffer.
    result = device->CreatePixelShader(pixelShaderBuffer->GetBufferPointer(), pixelShaderBuffer->GetBufferSize(), NULL, 
                       &m_pixelShader);
    if(FAILED(result))
    {
        return false;
    }

    // Create the vertex input layout description.
    // This setup needs to match the VertexType stucture in the ModelClass and in the shader.
    polygonLayout[0].SemanticName = "POSITION";
    polygonLayout[0].SemanticIndex = 0;
    polygonLayout[0].Format = DXGI_FORMAT_R32G32B32_FLOAT;
    polygonLayout[0].InputSlot = 0;
    polygonLayout[0].AlignedByteOffset = 0;
    polygonLayout[0].InputSlotClass = D3D11_INPUT_PER_VERTEX_DATA;
    polygonLayout[0].InstanceDataStepRate = 0;

    polygonLayout[1].SemanticName = "TEXCOORD";
    polygonLayout[1].SemanticIndex = 0;
    polygonLayout[1].Format = DXGI_FORMAT_R32G32_FLOAT;
    polygonLayout[1].InputSlot = 0;
    polygonLayout[1].AlignedByteOffset = D3D11_APPEND_ALIGNED_ELEMENT;
    polygonLayout[1].InputSlotClass = D3D11_INPUT_PER_VERTEX_DATA;
    polygonLayout[1].InstanceDataStepRate = 0;

    // Get a count of the elements in the layout.
    numElements = sizeof(polygonLayout) / sizeof(polygonLayout[0]);

    // Create the vertex input layout.
    result = device->CreateInputLayout(polygonLayout, numElements, vertexShaderBuffer->GetBufferPointer(), 
                       vertexShaderBuffer->GetBufferSize(), &m_layout);
    if(FAILED(result))
    {
        return false;
    }

    // Release the vertex shader buffer and pixel shader buffer since they are no longer needed.
    vertexShaderBuffer->Release();
    vertexShaderBuffer = 0;

    pixelShaderBuffer->Release();
    pixelShaderBuffer = 0;

    // Setup the description of the dynamic matrix constant buffer that is in the vertex shader.
    matrixBufferDesc.Usage = D3D11_USAGE_DYNAMIC;
    matrixBufferDesc.ByteWidth = sizeof(MatrixBufferType);
    matrixBufferDesc.BindFlags = D3D11_BIND_CONSTANT_BUFFER;
    matrixBufferDesc.CPUAccessFlags = D3D11_CPU_ACCESS_WRITE;
    matrixBufferDesc.MiscFlags = 0;
    matrixBufferDesc.StructureByteStride = 0;

    // Create the matrix buffer pointer so we can access the vertex shader constant buffer from within this class.
    result = device->CreateBuffer(&matrixBufferDesc, NULL, &m_matrixBuffer);
    if(FAILED(result))
    {
        return false;
    }

노이즈 버퍼를 생성하고 설정합니다.

    // Setup the description of the dynamic noise constant buffer that is in the vertex shader.
    noiseBufferDesc.Usage = D3D11_USAGE_DYNAMIC;
    noiseBufferDesc.ByteWidth = sizeof(NoiseBufferType);
    noiseBufferDesc.BindFlags = D3D11_BIND_CONSTANT_BUFFER;
    noiseBufferDesc.CPUAccessFlags = D3D11_CPU_ACCESS_WRITE;
    noiseBufferDesc.MiscFlags = 0;
    noiseBufferDesc.StructureByteStride = 0;

    // 노이즈 버퍼를 생성하여 이 클래스에서 정점 셰이더 상수 버퍼에 접근할 수 있도록 합니다.
    result = device->CreateBuffer(&noiseBufferDesc, NULL, &m_noiseBuffer);
    if(FAILED(result))
    {
        return false;
    }

    // 텍스쳐 샘플러 스테이트 디스크립션을 생성합니다.
    samplerDesc.Filter = D3D11_FILTER_MIN_MAG_MIP_LINEAR;
    samplerDesc.AddressU = D3D11_TEXTURE_ADDRESS_WRAP;
    samplerDesc.AddressV = D3D11_TEXTURE_ADDRESS_WRAP;
    samplerDesc.AddressW = D3D11_TEXTURE_ADDRESS_WRAP;
    samplerDesc.MipLODBias = 0.0f;
    samplerDesc.MaxAnisotropy = 1;
    samplerDesc.ComparisonFunc = D3D11_COMPARISON_ALWAYS;
    samplerDesc.BorderColor[0] = 0;
    samplerDesc.BorderColor[1] = 0;
    samplerDesc.BorderColor[2] = 0;
    samplerDesc.BorderColor[3] = 0;
    samplerDesc.MinLOD = 0;
    samplerDesc.MaxLOD = D3D11_FLOAT32_MAX;

    // 텍스쳐 샘플러 스테이트를 생성합니다.
    result = device->CreateSamplerState(&samplerDesc, &m_sampleState);
    if(FAILED(result))
    {
        return false;
    }

Wrap대신 Clamp를 사용하는 샘플러 스테이트를 생성 및 설정합니다.

    // Clamp로 샘플링하는 두 번째 텍스쳐 샘플러 스테이트 디스크립션을 설정합니다.
    samplerDesc2.Filter = D3D11_FILTER_MIN_MAG_MIP_LINEAR;
    samplerDesc2.AddressU = D3D11_TEXTURE_ADDRESS_CLAMP;
    samplerDesc2.AddressV = D3D11_TEXTURE_ADDRESS_CLAMP;
    samplerDesc2.AddressW = D3D11_TEXTURE_ADDRESS_CLAMP;
    samplerDesc2.MipLODBias = 0.0f;
    samplerDesc2.MaxAnisotropy = 1;
    samplerDesc2.ComparisonFunc = D3D11_COMPARISON_ALWAYS;
    samplerDesc2.BorderColor[0] = 0;
    samplerDesc2.BorderColor[1] = 0;
    samplerDesc2.BorderColor[2] = 0;
    samplerDesc2.BorderColor[3] = 0;
    samplerDesc2.MinLOD = 0;
    samplerDesc2.MaxLOD = D3D11_FLOAT32_MAX;

    // 텍스쳐 샘플러 스테이트를 생성합니다.
    result = device->CreateSamplerState(&samplerDesc2, &m_sampleState2);
    if(FAILED(result))
    {
        return false;
    }

왜곡 버퍼를 생성 및 설정합니다.

    // 픽셀 셰이더 안에 있는 동적 왜곡 상수 버퍼에 대한 디스크립션을 설정합니다.   
    distortionBufferDesc.Usage = D3D11_USAGE_DYNAMIC;
    distortionBufferDesc.ByteWidth = sizeof(DistortionBufferType);
    distortionBufferDesc.BindFlags = D3D11_BIND_CONSTANT_BUFFER;
    distortionBufferDesc.CPUAccessFlags = D3D11_CPU_ACCESS_WRITE;
    distortionBufferDesc.MiscFlags = 0;
    distortionBufferDesc.StructureByteStride = 0;

    // 왜곡 버퍼 포인터를 생성하여 이 클래스에서 픽셀 셰이더 상수 버퍼에 접근할 수 있도록 합니다. 
    result = device->CreateBuffer(&distortionBufferDesc, NULL, &m_distortionBuffer);
    if(FAILED(result))
    {
        return false;
    }

    return true;
}


void FireShaderClass::ShutdownShader()
{

ShutdownShader 함수에서는 불꽃 셰이더의 변수들에 접근하기 위한 모든 포인터들을 해제합니다.

    // 왜곡 상수 버퍼를 해제합니다.
    if(m_distortionBuffer)
    {
        m_distortionBuffer->Release();
        m_distortionBuffer = 0;
    }

    // 두번째 샘플러 스테이트를 해제합니다.
    if(m_sampleState2)
    {
        m_sampleState2->Release();
        m_sampleState2 = 0;
    }

    // 샘플러 스테이트를 해제합니다.
    if(m_sampleState)
    {
        m_sampleState->Release();
        m_sampleState = 0;
    }

    // 노이즈 상수 버퍼를 해제합니다.
    if(m_noiseBuffer)
    {
        m_noiseBuffer->Release();
        m_noiseBuffer = 0;
    }

    // 행렬 상수 버퍼를 해제합니다.
    if(m_matrixBuffer)
    {
        m_matrixBuffer->Release();
        m_matrixBuffer = 0;
    }

    // 레이아웃을 해제합니다.
    if(m_layout)
    {
        m_layout->Release();
        m_layout = 0;
    }

    // 픽셀 셰이더를 해제합니다.
    if(m_pixelShader)
    {
        m_pixelShader->Release();
        m_pixelShader = 0;
    }

    // 정점 셰이더를 해제합니다.   
    if(m_vertexShader)
    {
        m_vertexShader->Release();
        m_vertexShader = 0;
    }

    return;
}


void FireShaderClass::OutputShaderErrorMessage(ID3D10Blob* errorMessage, HWND hwnd, WCHAR* shaderFilename)
{
    char* compileErrors;
    unsigned long bufferSize, i;
    ofstream fout;


    // Get a pointer to the error message text buffer.
    compileErrors = (char*)(errorMessage->GetBufferPointer());

    // Get the length of the message.
    bufferSize = errorMessage->GetBufferSize();

    // Open a file to write the error message to.
    fout.open("shader-error.txt");

    // Write out the error message.
    for(i=0; i<bufferSize; i++)
    {
        fout << compileErrors[i];
    }

    // Close the file.
    fout.close();

    // Release the error message.
    errorMessage->Release();
    errorMessage = 0;

    // Pop a message up on the screen to notify the user to check the text file for compile errors.
    MessageBox(hwnd, L"Error compiling shader.  Check shader-error.txt for message.", shaderFilename, MB_OK);

    return;
}


bool FireShaderClass::SetShaderParameters(ID3D11DeviceContext* deviceContext, D3DXMATRIX worldMatrix, D3DXMATRIX viewMatrix,
                      D3DXMATRIX projectionMatrix, ID3D11ShaderResourceView* fireTexture, 
                      ID3D11ShaderResourceView* noiseTexture, ID3D11ShaderResourceView* alphaTexture, 
                      float frameTime, D3DXVECTOR3 scrollSpeeds, D3DXVECTOR3 scales, D3DXVECTOR2 distortion1, 
                      D3DXVECTOR2 distortion2, D3DXVECTOR2 distortion3, float distortionScale, 
                      float distortionBias)
{
    HRESULT result;
    D3D11_MAPPED_SUBRESOURCE mappedResource;
    MatrixBufferType* dataPtr;
    NoiseBufferType* dataPtr2;
    DistortionBufferType* dataPtr3;
    unsigned int bufferNumber;


    // Transpose the matrices to prepare them for the shader.
    D3DXMatrixTranspose(&worldMatrix, &worldMatrix);
    D3DXMatrixTranspose(&viewMatrix, &viewMatrix);
    D3DXMatrixTranspose(&projectionMatrix, &projectionMatrix);

평소와 같이 정점 셰이더에 행렬 버퍼를 설정합니다.

    // 행렬 상수 버퍼에 쓰기 위하여 락을 겁니다.
    result = deviceContext->Map(m_matrixBuffer, 0, D3D11_MAP_WRITE_DISCARD, 0, &mappedResource);
    if(FAILED(result))
    {
        return false;
    }

    // 행렬 상수 버퍼의 포인터를 얻어옵니다.
    dataPtr = (MatrixBufferType*)mappedResource.pData;

    // 행렬을 행렬 상수 버퍼에 복사합니다.
    dataPtr->world = worldMatrix;
    dataPtr->view = viewMatrix;
    dataPtr->projection = projectionMatrix;

    // 행렬 상수 버퍼의 락을 해제합니다.
    deviceContext->Unmap(m_matrixBuffer, 0);

    // 정점 셰이더에서의 행렬 상수 버퍼의 위치입니다.
    bufferNumber = 0;

    // 갱신된 값으로 정점 셰이더 안의 행렬 상수 버퍼를 설정합니다.
    deviceContext->VSSetConstantBuffers(bufferNumber, 1, &m_matrixBuffer);

정점 셰이더에 있는 노이즈 버퍼를 설정합니다.

    // 노이즈 상수 버퍼에 쓰기 위하여 락을 겁니다.
    result = deviceContext->Map(m_noiseBuffer, 0, D3D11_MAP_WRITE_DISCARD, 0, &mappedResource);
    if(FAILED(result))
    {
        return false;
    }

    // 노이즈 상수 버퍼의 포인터를 얻어옵니다.
    dataPtr2 = (NoiseBufferType*)mappedResource.pData;

    // 노이즈 상수 버퍼에 값을 복사합니다.
    dataPtr2->frameTime = frameTime;
    dataPtr2->scrollSpeeds = scrollSpeeds;
    dataPtr2->scales = scales;
    dataPtr2->padding = 0.0f;

    // 노이즈 상수 버퍼의 락을 해제합니다. 
    deviceContext->Unmap(m_noiseBuffer, 0);

    // 정점 셰이더에서의 노이즈 상수 버퍼의 위치입니다.
    bufferNumber = 1;

    // 정점 셰이더에 노이즈 상수 버퍼를 갱신된 값으로 설정합니다.
    deviceContext->VSSetConstantBuffers(bufferNumber, 1, &m_noiseBuffer);

픽셀 셰이더에 세 텍스쳐를 설정합니다.

    // 픽셀 셰이더에 세 개의 리소스를 설정합니다.
    deviceContext->PSSetShaderResources(0, 1, &fireTexture);
    deviceContext->PSSetShaderResources(1, 1, &noiseTexture);
    deviceContext->PSSetShaderResources(2, 1, &alphaTexture);

픽셀 셰이더에 왜곡 버퍼를 설정합니다.

    // 왜곡 버퍼에 쓰기 위하여 락을 겁니다.
    result = deviceContext->Map(m_distortionBuffer, 0, D3D11_MAP_WRITE_DISCARD, 0, &mappedResource);
    if(FAILED(result))
    {
        return false;
    }

    // 왜곡 상수 버퍼의 포인터를 얻어옵니다.
    dataPtr3 = (DistortionBufferType*)mappedResource.pData;

    // 왜곡 상수 버퍼에 값을 복사합니다.
    dataPtr3->distortion1 = distortion1;
    dataPtr3->distortion2 = distortion2;
    dataPtr3->distortion3 = distortion3;
    dataPtr3->distortionScale = distortionScale;
    dataPtr3->distortionBias = distortionBias;

    // 왜곡 상수 버퍼의 락을 해제합니다.
    deviceContext->Unmap(m_distortionBuffer, 0);

    // 픽셀 셰이더에서의 왜곡 상수 버퍼의 위치입니다.
    bufferNumber = 0;

    // 갱신된 값으로 픽셀 셰이더의 왜곡 상수 버퍼를 설정합니다.
    deviceContext->PSSetConstantBuffers(bufferNumber, 1, &m_distortionBuffer);

    return true;
}


void FireShaderClass::RenderShader(ID3D11DeviceContext* deviceContext, int indexCount)
{
    // 정점의 입력 레이아웃을 설정합니다.
    deviceContext->IASetInputLayout(m_layout);

    // 이 도형을 그리기 위한 정점 및 픽셀 셰이더를 설정합니다.
    deviceContext->VSSetShader(m_vertexShader, NULL, 0);
    deviceContext->PSSetShader(m_pixelShader, NULL, 0);

    // 픽셀 셰이더의 샘플러 스테이트를 설정합니다.
    deviceContext->PSSetSamplers(0, 1, &m_sampleState);

픽셀 셰이더에 Clamp를 사용하는 샘플러 스테이트를 설정합니다.

    deviceContext->PSSetSamplers(1, 1, &m_sampleState2);

    // 도형을 그립니다.
    deviceContext->DrawIndexed(indexCount, 0, 0);

    return;
}

Graphicsclass.h

////////////////////////////////////////////////////////////////////////////////
// Filename: graphicsclass.h
////////////////////////////////////////////////////////////////////////////////
#ifndef _GRAPHICSCLASS_H_
#define _GRAPHICSCLASS_H_


/////////////
// GLOBALS //
/////////////
const bool FULL_SCREEN = true;
const bool VSYNC_ENABLED = true;
const float SCREEN_DEPTH = 1000.0f;
const float SCREEN_NEAR = 0.1f;


///////////////////////
// MY CLASS INCLUDES //
///////////////////////
#include "d3dclass.h"
#include "cameraclass.h"
#include "modelclass.h"

FireShaderClass의 헤더를 추가합니다.

#include "fireshaderclass.h"


////////////////////////////////////////////////////////////////////////////////
// Class name: GraphicsClass
////////////////////////////////////////////////////////////////////////////////
class GraphicsClass
{
public:
    GraphicsClass();
    GraphicsClass(const GraphicsClass&);
    ~GraphicsClass();

    bool Initialize(int, int, HWND);
    void Shutdown();
    bool Frame();

private:
    bool Render();

private:
    D3DClass* m_D3D;
    CameraClass* m_Camera;
    ModelClass* m_Model;

FireShaderClass private 객체도 여기에 추가합니다.

    FireShaderClass* m_FireShader;
};

#endif

Graphicsclass.cpp

////////////////////////////////////////////////////////////////////////////////
// Filename: graphicsclass.cpp
////////////////////////////////////////////////////////////////////////////////
#include "graphicsclass.h"


GraphicsClass::GraphicsClass()
{
    m_D3D = 0;
    m_Camera = 0;
    m_Model = 0;

생성자에서 불꽃 셰이더 객체를 null로 초기화합니다.

    m_FireShader = 0;
}


GraphicsClass::GraphicsClass(const GraphicsClass& other)
{
}


GraphicsClass::~GraphicsClass()
{
}


bool GraphicsClass::Initialize(int screenWidth, int screenHeight, HWND hwnd)
{
    bool result;

        
    // Create the Direct3D object.
    m_D3D = new D3DClass;
    if(!m_D3D)
    {
        return false;
    }

    // Direct3D 객체를 초기화합니다.
    result = m_D3D->Initialize(screenWidth, screenHeight, VSYNC_ENABLED, hwnd, FULL_SCREEN, SCREEN_DEPTH, SCREEN_NEAR);
    if(!result)
    {
        MessageBox(hwnd, L"Could not initialize Direct3D.", L"Error", MB_OK);
        return false;
    }

    // 카메라 객체를 만듭니다.
    m_Camera = new CameraClass;
    if(!m_Camera)
    {
        return false;
    }

    // 모델 객체를 만듭니다.
    m_Model = new ModelClass;
    if(!m_Model)
    {
        return false;
    }

불꽃 모양을 위한 사각형 모델을 불러옵니다. 또한 이 모델을 그리는 데 사용할 세 개의 텍스쳐 역시 불러오도록 합니다.

    // 모델 객체를 초기화합니다.
    result = m_Model->Initialize(m_D3D->GetDevice(), "../Engine/data/square.txt", L"../Engine/data/fire01.dds", 
                     L"../Engine/data/noise01.dds", L"../Engine/data/alpha01.dds");
    if(!result)
    {
        MessageBox(hwnd, L"Could not initialize the model object.", L"Error", MB_OK);
        return false;
    }

불꽃 셰이더 객체를 생성 및 초기화합니다.

    // 불꽃 셰이더 객체를 생성합니다.
    m_FireShader = new FireShaderClass;
    if(!m_FireShader)
    {
        return false;
    }

    // 불꽃 셰이더 객체를 초기화합니다.
    result = m_FireShader->Initialize(m_D3D->GetDevice(), hwnd);
    if(!result)
    {
        MessageBox(hwnd, L"Could not initialize the fire shader object.", L"Error", MB_OK);
        return false;
    }

    return true;
}


void GraphicsClass::Shutdown()
{

Shutdown 함수에서 불꽃 셰이더 객체를 해제합니다.

    // 불꽃 셰이더 객체를 해제합니다.
    if(m_FireShader)
    {
        m_FireShader->Shutdown();
        delete m_FireShader;
        m_FireShader = 0;
    }

    // 모델 객체를 해제합니다.
    if(m_Model)
    {
        m_Model->Shutdown();
        delete m_Model;
        m_Model = 0;
    }

    // 카메라 객체를 해제합니다.
    if(m_Camera)
    {
        delete m_Camera;
        m_Camera = 0;
    }

    // Direct3D 객체를 해제합니다.
    if(m_D3D)
    {
        m_D3D->Shutdown();
        delete m_D3D;
        m_D3D = 0;
    }

    return;
}


bool GraphicsClass::Frame()
{
    bool result;


    // Set the position of the camera.
    m_Camera->SetPosition(0.0f, 0.0f, -10.0f);

    // Render the scene.
    result = Render();
    if(!result)
    {
        return false;
    }

    return true;
}


bool GraphicsClass::Render()
{
    D3DXMATRIX worldMatrix, viewMatrix, projectionMatrix;
    bool result;
    D3DXVECTOR3 scrollSpeeds, scales;
    D3DXVECTOR2 distortion1, distortion2, distortion3;
    float distortionScale, distortionBias;
    static float frameTime = 0.0f;

매 프레임마다 frameTime값을 증가시킵니다. 이 값을 이용하여 셰이더 안에 있는 세 개의 다른 노이즈 텍스쳐를 스크롤합니다. 참고로 FPS를 60으로 고정하지 않는다면 매 프레임마다 시간의 차이를 감안하여 타이머를 업데이트하여 불꽃이 FPS에 상관없이 일정한 속도로 타오르도록 해야 합니다.

    // frameTime 카운터를 증가시킵니다.
    frameTime += 0.01f;
    if(frameTime > 1000.0f)
    {
        frameTime = 0.0f;
    }

세 노이즈 텍스쳐의 스크롤 속도, 크기, 왜곡 값을 설정합니다.

    // 세 노이즈 텍스쳐의 스크롤 속도를 설정합니다.
    scrollSpeeds = D3DXVECTOR3(1.3f, 2.1f, 2.3f);

    // 세 크기값을 사용하여 세 가지의 다른 노이즈 옥타브 텍스쳐를 만듭니다.
    scales = D3DXVECTOR3(1.0f, 2.0f, 3.0f);

    // 세 노이즈 텍스쳐의 서로 다른 세 개의 x, y 왜곡 인자를 설정합니다.
    distortion1 = D3DXVECTOR2(0.1f, 0.2f);
    distortion2 = D3DXVECTOR2(0.1f, 0.3f);
    distortion3 = D3DXVECTOR2(0.1f, 0.1f);

노이즈 텍스쳐를 불꽃 모양으로 교란시키는 데 사용할 바이어스 값과 크기 값을 설정합니다.

    // 텍스쳐 샘플링 좌표의 교란을 위한 크기 및 바이어스 값입니다.
    distortionScale = 0.8f;
    distortionBias = 0.5f;

    // 씬의 시작을 위해 버퍼를 클리어합니다.
    m_D3D->BeginScene(0.0f, 0.0f, 0.0f, 1.0f);

    // 카메라의 위치에 기반하여 뷰 행렬을 생성합니다.
    m_Camera->Render();

    // 카메라와 d3d객체에서 월드, 뷰, 투영 행렬을 가져옵니다.
    m_D3D->GetWorldMatrix(worldMatrix);
    m_Camera->GetViewMatrix(viewMatrix);
    m_D3D->GetProjectionMatrix(projectionMatrix);

이 셰이더는 교란된 알파 텍스쳐를 이용하여 불꽃 효과의 일부가 반투명으로 보여야 하기 때문에 알파블렌딩이 필요합니다.

    // 불꽃의 반투명을 위해 알파블렌딩을 킵니다.
    m_D3D->TurnOnAlphaBlending();

그래픽스 파이프라인에 사각형 모델을 넣습니다.

    // 그래픽스 파이프라인에 사각형 모델의 정점 및 인덱스 버퍼를 넣어 그릴 준비를 합니다.
    m_Model->Render(m_D3D->GetDeviceContext());

불꽃 셰이더를 이용하여 사각형 모델을 그립니다.

    // 불꽃 셰이더를 이용하여 사각형 모델을 그립니다.
    result = m_FireShader->Render(m_D3D->GetDeviceContext(), m_Model->GetIndexCount(), worldMatrix, viewMatrix, projectionMatrix, 
                      m_Model->GetTexture1(), m_Model->GetTexture2(), m_Model->GetTexture3(), frameTime, scrollSpeeds, 
                      scales, distortion1, distortion2, distortion3, distortionScale, distortionBias);
    if(!result)
    {
        return false;
    }

    // 알파 블렌딩을 끕니다.
    m_D3D->TurnOffAlphaBlending();

    // 렌더링된 씬을 화면에 표시합니다.
    m_D3D->EndScene();

    return true;
}

마치면서

불꽃 셰이더는 엄청나게 사실적인 불꽃 효과를 만들어냅니다. 또한 하나 또는 몇 개의 셰이더 변수값을 조절함으로 거의 모든 유형의 불꽃을 만들 수 있기 때문에 매우 커스터마이징하기 편합니다. 하지만 여전히 이 불꽃은 3D 씬에 세팅될 때에는 사실적으로 보이기 위하여 빌보드로 그려지거나 한 위치에 여러 각도로 배치되어야 합니다.

연습 문제

  1. 프로그램을 컴파일하고 실행하여 보십시오. 움직이는 불꽃 효과를 보실 수 있을 겁니다. ESC키로 종료합니다.

  2. 많은 셰이더 값들을 조정해 보고 만들어지는 다른 결과들을 관찰해 보십시오. 크기 및 바이어스값부터 고쳐보면 좋습니다. 또한 불꽃 셰이더의 몇몇 부분을 주석처리하여 각 텍스쳐가 어떤 효과를 담당하는지 확인해 볼 수 있습니다.

  3. 여러분만의 노이즈 텍스쳐를 만들어 어떻게 불꽃이 달라지는지 확인해 보십시오.

  4. 여러분만의 알파 텍스쳐를 만들어 불꽃의 전체적인 모양을 바꾸어 보십시오.

소스 코드

Visual Studio 2008 프로젝트: dx11tut33.zip

소스코드만: dx11src33.zip

실행파일만: dx11exe33.zip

Nav