Files
BlueRoseNote/03-UnrealEngine/卡通渲染相关资料/渲染功能/ARC/UI/简单元素渲染扩展.md

1.6 KiB
Raw Blame History

title, date, excerpt, tags, rating
title date excerpt tags rating
简单元素渲染扩展 2026-05-03 00:00:00 REDMain/GammaREDMain 着色器扩展AddColor、灰度、Multiply 混合
ARC
UI
Rendering

简单元素渲染扩展

返回 UI

概述

扩展了 UE4 的 SimpleElement Pixel Shader用于 2D UI 元素、线条、Debug 绘制等),新增颜色叠加、灰度转换和 Multiply 混合模式。

新增着色器入口

REDMain / GammaREDMain

void REDMain(... out float4 OutColor : SV_Target0)
{
    OutColor = CalcREDColor(InColor, InTexCoord);
}

float4 CalcREDColor(float4 VertexColor, float2 UV)
{
    float4 TexColor = Texture2DSample(InTexture, InTextureSampler, UV);
    float4 Result = TexColor * VertexColor;

    // 叠加色
    Result.rgb += AddColor.rgb;

    // 灰度转换
    float Gray = dot(Result.rgb, float3(0.299, 0.587, 0.114));
    Result.rgb = lerp(float3(Gray, Gray, Gray), Result.rgb, Grayscale);

    return Result;
}

参数:

  • AddColor — 加法颜色叠加uniform float3
  • Grayscale — 饱和度系数uniform float0=灰度1=原色)

MainMult

Multiply 混合模式的 Simple Element 渲染:

void MainMult(... out float4 OutColor : SV_Target0)
{
    // 用于 Multiply 混合的 UI 元素
}

使用场景

  • 格斗游戏 UI 的动态颜色变化(血条变色、技能冷却灰度化)
  • 受击时的 HUD 闪烁效果AddColor 叠加红色)
  • 菜单界面的 Multiply 叠加装饰

修改文件列表

文件 修改类型
Shaders/Private/SimpleElementPixelShader.usf 新增 REDMainMainMultCalcREDColor