Vulkan 透明 2D 纹理答案

【问题标题】：Vulkan Transparent 2D TexturesVulkan 透明 2D 纹理
【发布时间】：2022-08-17 20:32:59
【问题描述】：

我正在尝试使用 Vulkan 加载包含透明像素的 2D 精灵，到目前为止，我已经能够加载精灵，但无法使透明度正常工作（透明像素应该与蓝色背景混合）。我不确定该怎么做才能让它正确。

颜色混合状态：

VkPipelineColorBlendAttachmentState colorBlendAttachment {};
colorBlendAttachment.colorWriteMask =
    VK_COLOR_COMPONENT_R_BIT |
    VK_COLOR_COMPONENT_G_BIT |
    VK_COLOR_COMPONENT_B_BIT |
    VK_COLOR_COMPONENT_A_BIT;
colorBlendAttachment.blendEnable = VK_TRUE;
colorBlendAttachment.srcColorBlendFactor = VK_BLEND_FACTOR_SRC_ALPHA;
colorBlendAttachment.dstColorBlendFactor = VK_BLEND_FACTOR_ONE_MINUS_SRC_ALPHA;
colorBlendAttachment.colorBlendOp = VK_BLEND_OP_ADD;
colorBlendAttachment.srcAlphaBlendFactor = VK_BLEND_FACTOR_SRC_ALPHA;
colorBlendAttachment.dstAlphaBlendFactor = VK_BLEND_FACTOR_ONE_MINUS_SRC_ALPHA;
colorBlendAttachment.alphaBlendOp = VK_BLEND_OP_ADD;


VkPipelineColorBlendStateCreateInfo colorBlendState {};
colorBlendState.sType = VK_STRUCTURE_TYPE_PIPELINE_COLOR_BLEND_STATE_CREATE_INFO;
colorBlendState.logicOpEnable = VK_FALSE;
colorBlendState.logicOp = VK_LOGIC_OP_COPY;
colorBlendState.attachmentCount = 1;
colorBlendState.pAttachments = &colorBlendAttachment;
colorBlendState.blendConstants[0] = 1.f;
colorBlendState.blendConstants[1] = 1.f;
colorBlendState.blendConstants[2] = 1.f;
colorBlendState.blendConstants[3] = 1.f;

深度模板状态：

VkPipelineDepthStencilStateCreateInfo info {};

光栅化状态：

VkPipelineRasterizationStateCreateInfo info {};
info.sType = VK_STRUCTURE_TYPE_PIPELINE_RASTERIZATION_STATE_CREATE_INFO;
info.depthClampEnable = VK_FALSE;
info.rasterizerDiscardEnable = VK_FALSE;
info.polygonMode = polygonMode;
info.lineWidth = 1.0f;
info.cullMode = VK_CULL_MODE_NONE;
info.frontFace = VK_FRONT_FACE_CLOCKWISE;
info.depthBiasEnable = VK_FALSE;
info.depthBiasConstantFactor = 0.0f;
info.depthBiasClamp = 0.0f;
info.depthBiasSlopeFactor = 0.0f;

顶点着色器：

#version 460

layout (location = 0) in vec2 vPosition;
layout (location = 1) in vec2 vTexCoord;

layout (location = 0) out vec2 texCoord;

void main()
{
    gl_Position = vec4(vPosition, 0.0f, 1.0f);
    texCoord = vTexCoord;
}

片段着色器：

#version 460

layout (location = 0) in vec2 texCoord;

layout (location = 0) out vec4 outFragColor;

layout(set = 0, binding = 0) uniform sampler2D tex;

void main()
{
    vec3 color = texture(tex, texCoord).xyz;
    outFragColor = vec4(color, 1.0f);
}

\"vec4(color, 1.0f);\“ ... 什么确切地你认为这会做吗？
将每个顶点颜色设置为 255 的 alpha 值？
这是从分段着色器。这怎么会影响“顶点颜色”？
哎呀...现在可以工作了，谢谢

标签： c++ vulkan blending

【解决方案1】：

在 Vulkan 中渲染时，我们必须明确应该如何执行颜色混合。 You can read more here。

色彩混合的一些常见错误是选择了错误的混合因子和混合操作。但是忘记启用混合.blendEnable = true; 也很常见。因为在 Vulkan 中，您可以附加附件而不使它们生效，这就是为什么您必须明确

typedef struct VkPipelineColorBlendAttachmentState 
{
    VkBool32                 blendEnable;
    VkBlendFactor            srcColorBlendFactor;
    VkBlendFactor            dstColorBlendFactor;
    VkBlendOp                colorBlendOp;
    VkBlendFactor            srcAlphaBlendFactor;
    VkBlendFactor            dstAlphaBlendFactor;
    VkBlendOp                alphaBlendOp;
    VkColorComponentFlags    colorWriteMask;
} VkPipelineColorBlendAttachmentState;

也可能是您的像素着色器没有考虑您的纹理 alpha 值，如上面的问题outFragColor = vec4(color, 1.0f); 所示。相反，应该将 texel 坐标检索为 vector4 texture(texture, uv).xyzw;

也可能是使用了错误的文件格式，或者甚至只是在纹理文件中没有适当的透明度。游戏引擎推荐的纹理文件：dds、png、tga

【讨论】：