Direct3D 11 Tutorial 7:Texture Mapping and Constant Buffers_Direct3D 11 教程7：纹理映射和常量缓冲区

概述

在上一个教程中，我们为项目引入了照明。 现在我们将通过向我们的立方体添加纹理来构建它。 此外，我们将介绍常量缓冲区的概念，并解释如何使用缓冲区通过最小化带宽使用来加速处理。

本教程的目的是修改中心立方体以将纹理映射到其上。

资源目录

(SDK root)SamplesC++Direct3D11TutorialsTutorial07

Github

纹理映射

纹理映射是指2D图像在3D几何体上的投影。 我们可以把它想象成包装礼物，将装饰纸放在一个平淡无奇的盒子上。 为此，我们必须指定几何体表面上的点如何与2D图像对应。

诀窍是正确地将模型的坐标与纹理对齐。 对于复杂模型，很难手动确定纹理的坐标。 因此，3D建模包通常将导出具有相应纹理坐标的模型。 由于我们的示例是一个立方体，因此很容易确定匹配纹理所需的坐标。 纹理坐标在顶点处定义，然后针对曲面上的各个像素进行插值。

从纹理和采样器状态中创建着色器资源

纹理是从文件中检索并用于创建着色器资源视图的2D图像，以便可以从着色器中读取它。

hr = D3DX11CreateShaderResourceViewFromFile( g_pd3dDevice, L"seafloor.dds", NULL, NULL, &g_pTextureRV, NULL );

　　

我们还需要创建一个采样器状态来控制着色器如何处理过滤，MIP和寻址。 在本教程中，我们将启用简单的采样器状态，以启用线性过滤和换行寻址。 要创建采样器状态，我们将使用ID3D11Device :: CreateSamplerState()。

    // Create the sample state
    D3D11_SAMPLER_DESC sampDesc;
    ZeroMemory( &sampDesc, sizeof(sampDesc) );
    sampDesc.Filter = D3D11_FILTER_MIN_MAG_MIP_LINEAR;
    sampDesc.AddressU = D3D11_TEXTURE_ADDRESS_WRAP;
    sampDesc.AddressV = D3D11_TEXTURE_ADDRESS_WRAP;
    sampDesc.AddressW = D3D11_TEXTURE_ADDRESS_WRAP;
    sampDesc.ComparisonFunc = D3D11_COMPARISON_NEVER;
    sampDesc.MinLOD = 0;
    sampDesc.MaxLOD = D3D11_FLOAT32_MAX;
    hr = g_pd3dDevice->CreateSamplerState( &sampDesc, &g_pSamplerLinear );

　　

定义坐标

在我们将图像映射到立方体之前，我们必须首先在立方体的每个顶点上定义纹理坐标。 由于图像可以是任何大小，因此使用的坐标系已标准化为[0,1]。 纹理的左上角对应于（0,0），右下角对应于（1,1）。

在这个例子中，我们将整个纹理分布在立方体的每一侧。 这简化了坐标的定义，没有混淆。 但是，它完全可以指定要在所有六个面上拉伸的纹理，尽管定义点更加困难，并且它会显得拉伸和扭曲。

首先，我们更新了用于定义顶点的结构，以包含纹理坐标。

struct SimpleVertex
{
    XMFLOAT3 Pos;
    XMFLOAT2 Tex;
};

　　

接下来，我们将更新输入布局为了让着色器包含这些坐标。

// Define the input layout
D3D11_INPUT_ELEMENT_DESC layout[] =
{
    { "POSITION", 0, DXGI_FORMAT_R32G32B32_FLOAT, 0, 0, D3D11_INPUT_PER_VERTEX_DATA, 0 },
    { "TEXCOORD", 0, DXGI_FORMAT_R32G32_FLOAT, 0, 12, D3D11_INPUT_PER_VERTEX_DATA, 0 },
};

　　

由于输入布局已更改，因此还必须修改相应的顶点着色器输入以匹配添加。

struct VS_INPUT
{
    float4 Pos : POSITION;
    float2 Tex : TEXCOORD;
};

　　

最后，我们准备在我们在教程4中定义的顶点中包含纹理坐标。注意第二个参数输入是包含纹理坐标的D3DXVECTOR2。 立方体上的每个顶点都对应于纹理的一角。 这将创建一个简单的映射，其中每个顶点得到（0,0）（0,1）（1,0）或（1,1）作为坐标。

// Create vertex buffer
SimpleVertex vertices[] =
{
    { XMFLOAT3( -1.0f, 1.0f, -1.0f ), XMFLOAT2( 0.0f, 0.0f ) },
    { XMFLOAT3( 1.0f, 1.0f, -1.0f ), XMFLOAT2( 1.0f, 0.0f ) },
    { XMFLOAT3( 1.0f, 1.0f, 1.0f ), XMFLOAT2( 1.0f, 1.0f ) },
    { XMFLOAT3( -1.0f, 1.0f, 1.0f ), XMFLOAT2( 0.0f, 1.0f ) },

    { XMFLOAT3( -1.0f, -1.0f, -1.0f ), XMFLOAT2( 0.0f, 0.0f ) },
    { XMFLOAT3( 1.0f, -1.0f, -1.0f ), XMFLOAT2( 1.0f, 0.0f ) },
    { XMFLOAT3( 1.0f, -1.0f, 1.0f ), XMFLOAT2( 1.0f, 1.0f ) },
    { XMFLOAT3( -1.0f, -1.0f, 1.0f ), XMFLOAT2( 0.0f, 1.0f ) },

    { XMFLOAT3( -1.0f, -1.0f, 1.0f ), XMFLOAT2( 0.0f, 0.0f ) },
    { XMFLOAT3( -1.0f, -1.0f, -1.0f ), XMFLOAT2( 1.0f, 0.0f ) },
    { XMFLOAT3( -1.0f, 1.0f, -1.0f ), XMFLOAT2( 1.0f, 1.0f ) },
    { XMFLOAT3( -1.0f, 1.0f, 1.0f ), XMFLOAT2( 0.0f, 1.0f ) },

    { XMFLOAT3( 1.0f, -1.0f, 1.0f ), XMFLOAT2( 0.0f, 0.0f ) },
    { XMFLOAT3( 1.0f, -1.0f, -1.0f ), XMFLOAT2( 1.0f, 0.0f ) },
    { XMFLOAT3( 1.0f, 1.0f, -1.0f ), XMFLOAT2( 1.0f, 1.0f ) },
    { XMFLOAT3( 1.0f, 1.0f, 1.0f ), XMFLOAT2( 0.0f, 1.0f ) },

    { XMFLOAT3( -1.0f, -1.0f, -1.0f ), XMFLOAT2( 0.0f, 0.0f ) },
    { XMFLOAT3( 1.0f, -1.0f, -1.0f ), XMFLOAT2( 1.0f, 0.0f ) },
    { XMFLOAT3( 1.0f, 1.0f, -1.0f ), XMFLOAT2( 1.0f, 1.0f ) },
    { XMFLOAT3( -1.0f, 1.0f, -1.0f ), XMFLOAT2( 0.0f, 1.0f ) },

    { XMFLOAT3( -1.0f, -1.0f, 1.0f ), XMFLOAT2( 0.0f, 0.0f ) },
    { XMFLOAT3( 1.0f, -1.0f, 1.0f ), XMFLOAT2( 1.0f, 0.0f ) },
    { XMFLOAT3( 1.0f, 1.0f, 1.0f ), XMFLOAT2( 1.0f, 1.0f ) },
    { XMFLOAT3( -1.0f, 1.0f, 1.0f ), XMFLOAT2( 0.0f, 1.0f ) },
};

　　

当我们对纹理进行采样时，我们需要使用下面几何体的材质颜色对其进行调制。

将纹理绑定为着色器资源

纹理和采样器状态是我们在前面的教程中看到的常量缓冲区之类的对象。 在着色器可以使用它们之前，需要使用ID3D11DeviceContext :: PSSetSamplers()和ID3D11DeviceContext :: PSSetShaderResources()API进行设置。

    g_pImmediateContext->PSSetShaderResources( 0, 1, &g_pTextureRV );
    g_pImmediateContext->PSSetSamplers( 0, 1, &g_pSamplerLinear );

　　

好了，现在我们已准备好在着色器中使用纹理。

应用纹理

要在几何体顶部映射纹理，我们将在像素着色器中调用纹理查找功能。 函数Sample将执行2D纹理的纹理查找，然后返回采样的颜色。 下面显示的像素着色器调用此函数并将其乘以底层网格颜色（或材质颜色），然后输出最终颜色。

• 当我们将资源视图g_pTextureRV绑定到它时，txDiffuse是存储我们从上面的代码传入的纹理的对象。
• samLinear将在下面描述; 它是纹理查找的采样器规范。
• input.Tex是我们在源中指定的纹理的坐标。

// Pixel Shader
float4 PS( PS_INPUT input) : SV_Target
{
    return txDiffuse.Sample( samLinear, input.Tex ) * vMeshColor;
}

　　

还有另一件事情我们必须记住，就是要通过顶点着色器传递纹理坐标。 如果不这样做，数据在到达像素着色器时就会丢失。 在这里，我们只需将输入的坐标复制到输出中，然后让硬件处理其余部分。

// Vertex Shader
PS_INPUT VS( VS_INPUT input )
{
    PS_INPUT output = (PS_INPUT)0;
    output.Pos = mul( input.Pos, World );
    output.Pos = mul( output.Pos, View );
    output.Pos = mul( output.Pos, Projection );
    output.Tex = input.Tex;
        
    return output;
}

　　

常量缓冲区

在Direct3D 11中，应用程序可以使用常量缓冲区来设置着色器常量（着色器变量）。 使用类似于C风格结构的语法声明常量缓冲区。 常量缓冲区通过允许将着色器常量组合在一起并同时提交来减少更新着色器常量所需的带宽，而不是单独调用单独提交每个常量。

在前面的教程中，我们使用单个常量缓冲区来保存我们需要的所有着色器常量。 但是，有效使用常量缓冲区的最佳方法是根据更新频率将着色器变量组织到常量缓冲区中。 这允许应用程序最小化更新着色器常量所需的带宽。 例如，本教程将常量分为三个结构：一个用于更改每个帧的变量，一个用于仅在窗口大小更改时更改的变量，另一个用于设置一次然后不更改的变量。

本教程的.fx文件中定义了以下常量缓冲区。

    cbuffer cbNeverChanges
    {
        matrix View;
    };
    
    cbuffer cbChangeOnResize
    {
        matrix Projection;
    };
    
    cbuffer cbChangesEveryFrame
    {
        matrix World;
        float4 vMeshColor;
    };

　　

要使用这些常量缓冲区，您需要为每个缓冲区创建一个ID3D11Buffer对象。 然后，您可以调用ID3D11DeviceContext :: UpdateSubresource()来在需要时更新每个常量缓冲区，而不会影响其他常量缓冲区。

    //
    // Update variables that change once per frame
    //
    CBChangesEveryFrame cb;
    cb.mWorld = XMMatrixTranspose( g_World );
    cb.vMeshColor = g_vMeshColor;
    g_pImmediateContext->UpdateSubresource( g_pCBChangesEveryFrame, 0, NULL, &cb, 0, 0 );

　　

最终效果