在DirectX 11中渲染精灵的最佳实践是什么？ [英] What is the best practice to render sprites in DirectX 11?

问题描述

我目前正在尝试适应DirectX API，我想知道在DirectX 11中呈现子画面的常用方法是什么（例如用于俄罗斯方块克隆）。

I am currently trying to get used to the DirectX API and I am wondering what is the usual approach to render a sprite in DirectX 11 (e.g. for a tetris clone).

是否有一个类似 ID3DX10Sprite ，如果没有，这将是在DirectX 11中绘制子画面的常用方法？

Is there a simmilar interface as ID3DX10Sprite, and if not, which would be the usual method to draw sprites in DirectX 11?

编辑：这是对我有用的HLSL代码（可以更好地完成投影坐标的计算）：

Here is the HLSL code that worked for me (the computation of the projection coordinate could be done better):

struct SpriteData
{
    float2 position;
    float2 size;
    float4 color;
};

struct VSOut
{
    float4 position : SV_POSITION;
    float4 color : COLOR;
};

cbuffer ScreenSize : register(b0)
{
    float2 screenSize;
    float2 padding; // cbuffer must have at least 16 bytes
}

StructuredBuffer<SpriteData> spriteData : register(t0);

float2 GetVertexPosition(uint VID)
{
    [branch] switch(VID)
    {
        case 0:
            return float2(0, 0); 
        case 1:
            return float2(1, 0); 
        case 2:
            return float2(0, 1); 
        default:
            return float2(1, 1);
    }
}

float4 ComputePosition(float2 positionInScreenSpace, float2 size, float2 vertexPosition)
{
    float2 origin = float2(-1, 1);
    float2 vertexPositionInScreenSpace = positionInScreenSpace + (size * vertexPosition);

    return float4(origin.x + (vertexPositionInScreenSpace.x / (screenSize.x / 2)), origin.y - (vertexPositionInScreenSpace.y / (screenSize.y / 2)), 1, 1);
}

VSOut VShader(uint VID : SV_VertexID, uint SIID : SV_InstanceID)
{
    VSOut output;

    output.color = spriteData[SIID].color;
    output.position = ComputePosition(spriteData[SIID].position, spriteData[SIID].size, GetVertexPosition(VID));

    return output;
}

float4 PShader(float4 position : SV_POSITION, float4 color : COLOR) : SV_TARGET
{
    return color;
}

推荐答案

没有当量。通常的方法是绘制一个三角形，形成一个四边形。

No there isn't an equivalent. Usual method would be to draw a triangle strip forming a quad.

您可以利用实例化，因此只需用sprite数据（x，y屏幕位置（以像素为单位），要获取的纹理ID，在纹理数组中获取的纹理ID，缩放，旋转，图层等），并使用着色器在一次绘制调用中渲染所有精灵。

You could make use of instancing, so you just have to update a buffer with sprite data (x, y screen position in pixels, id of the texture to fetch in a texture array, scaling, rotation, layer, etc) and use shaders for rendering all sprites in one single draw call.

这里有一些HLSL的小窍门：

Here's some HLSL tidbits off the top of my head:

//--------------------------------------------------------------------------------------
// Shader code for Sprite Rendering
//--------------------------------------------------------------------------------------

struct Sprite {
    float2 position; // x, y world position
    float rotation;
    float scaling;

    float layer; // if you have multiple layers of sprites (e.g. background sprites)
    uint textureId;
};

StructuredBuffer<Sprite> SpritesRO : register( t0 );
Texture2DArray<float4> TextureSlices : register (t1);

cbuffer cbRenderConstants : register( b0 )
{
    matrix g_mViewProjection;
    // other constants
};

struct VSSpriteOut
{
    float3 position : SV_Position;
    uint textureId;
};

//-------------------------------------------------------------------------------------            
// Sprite Vertex Shader
//-------------------------------------------------------------------------------------

VSSpriteOut SpriteVS(uint VID : SV_VertexID, uint SIID : SV_InstanceID)
{
    VSSpriteOut Out = (VSSpriteOut)0;

    // VID is either 0, 1, 2 or 3
    // We can map 0 to position (0,0), 1 to (0,1), 2 to (1,0), 3 to (1,1)

    // We fetch the sprite instance data accord SIID
    Sprite sdata = SpritesRO[SIID];

    // function f computes screen space vertex position
    float3 pos = f (g_mViewProjection, VID, position, rotation, scaling, layer etc)

    Out.position = pos;
    Out.textureId = sdata.textureId;

    return Out;
}

//-------------------------------------------------------------------------------------
// Sprite Pixel Shader
//-------------------------------------------------------------------------------------

float4 SpritePS(VSSpriteOut In) : SV_Target
{
    // use In.textureId to fetch the right texture slice in texture array
    return color;
}

这篇关于在DirectX 11中渲染精灵的最佳实践是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！