DirectX Lighting Basics — Ambient, Diffuse, Specular

Wed, 03 Jan 2024 00:00:00 +0900

Lighting Calculation

float4 fvTotalAmbient = fvAmbient * fvBaseColor;
float4 fvTotalDiffuse = fvDiffuse * fNDotL * fvBaseColor;
float4 fvTotalSpecular = fvSpecular * pow( fRDotV, fSpecularPower );

return( saturate( fvTotalAmbient + fvTotalDiffuse + fvTotalSpecular ) );

Notes

saturate() clamps the value between 0 and 1
Do NOT use saturate in HDR (values above 1.0 are needed)
Large capacity is possible due to texture compression
Rim lighting technique: compute using the normal vector at the vertex stage

DirectX UI System Implementation

Mon, 01 Jan 2024 00:00:00 +0900

When creating an entity, add UITestScript as a component. Pass the UI type during creation.

Each type is implemented inside the Update function.

UI Types

STATIC — A UI element that just sits there
ONMOUSE — A UI element that “breathes” when hovered
GAUGE — A gauge UI for time, hunger, mini-games, etc.
If animation is needed, more types can be added

Shader Code

float4 main(PixelIn input) : SV_TARGET
{
 float4 texColor = float4(1, 1, 1, 0);

 if(UItype == 1)
 {
 // Use frac() to wrap texture coordinates within 0-1 range
 // for seamless repetition
 input.tex.x = frac(input.tex.x);
 input.tex.y = frac(input.tex.y);
 texColor = shaderTexture.Sample(SampleType, input.tex);
 if (texColor.a < 0.01)
 discard;
 }
 else if(UItype == 2)
 {
 float2 textureOffset = float2(0.0f, 0.0f);
 float2 textureSize = float2(1.0f, 1 - textureTranslation);

 // Discard pixels outside the visible gauge area
 if (input.tex.x < textureOffset.x ||
 input.tex.x > textureOffset.x + textureSize.x ||
 1 - input.tex.y < textureOffset.y ||
 1 - input.tex.y > textureOffset.y + textureSize.y)
 {
 discard;
 }
 else
 {
 texColor = shaderTexture.Sample(SampleType, input.tex);
 }
 }
 else
 {
 texColor = shaderTexture.Sample(SampleType, input.tex);
 if (texColor.a < 0.01)
 discard;
 }
 return texColor;
}

Key Points

UItype == 1 (ONMOUSE): Uses frac() to wrap texture coordinates for a breathing animation effect
UItype == 2 (GAUGE): Controls the visible texture area via textureTranslation to create a fill effect
else (STATIC): Simple texture sampling with alpha discard below 0.01