out if interest i tried creating a sdf letter based on valve’s idea, its kinda common in game engines for large text rendering. eg. https://github.com/libgdx/libgdx/wiki/Distance-field-fonts
i tried following the instruction, create a distance tex based on a hi-res image of the letter/word, scaled it down to something like 64x64px and render this with a drawSDF shader. the distance tex looks smooth but the drawSDF has nasty edges. So i’m missing something here.
Anyone interested and has done it before ? I think it’s kinda cool technique. SDFglyph.v4p (15.8 KB)
sdftext.zip (3.4 KB)
not perfect but kinda working
1 Like
also worth noting:https://doc.xenko.com/latest/en/manual/graphics/sprite-fonts.html#signed-distance-field-sprite-fonts
you could use Xenko to generate the font texture and port their shader code:
// Copyright (c) Xenko contributors (https://xenko.com) and Silicon Studio Corp. (https://www.siliconstudio.co.jp)
// Distributed under the MIT license. See the LICENSE.md file in the project root for more information.
shader SignedDistanceFieldFont : Texturing
{
// Gets the median of 3 values
float median(float r, float g, float b)
{
return max(min(r, g), min(max(r, g), b));
}
// Retrieves the pixel's color sampled from a signed distance field font texture, with font color, border and shadows
stage float4 FontColor(float4 sampledColor, float4 textColor, float4 borderColor, float borderThickness)
{
// -0.5 to +0.5 is the maximum distance msdfgen can produce, but it's blurry so cap the border at 0.25
borderThickness = clamp(borderThickness, 0, 0.2);
// Higher (more than 1) - sharper
// Lower (less than 1, more than 0) - blurry
show original
// Copyright (c) Xenko contributors (https://xenko.com) and Silicon Studio Corp. (https://www.siliconstudio.co.jp)
// Distributed under the MIT license. See the LICENSE.md file in the project root for more information.
shader SignedDistanceFieldFontShader : ShaderBase, SignedDistanceFieldFont
{
// -------------------------------------
// streams
// -------------------------------------
stage stream float4 Position : POSITION;
stage stream float4 Color : COLOR;
stage stream float Swizzle : BATCH_SWIZZLE;
// -------------------------------------
// VertexShader
// -------------------------------------
stage override void VSMain()
{
streams.ShadingPosition = streams.Position;
}
// -------------------------------------
show original
@tonfilm
my second post has already an adopted shader in it. concerning the distance texture generation, the vvvv node is fine for one letter but having a fully working system, it needs some atlas technique…which is another task. i‘ll look into xenkos solution, for sure. looks more sophisticated.
system
July 9, 2020, 7:19am
#5
This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.
