Apply outer outlines to text in WPF

Question

Here there is a demo for a textBlock with an outlines.

With the code below I get this result

    <local:OutlinedTextBlock Stroke="Red" 
                             FontSize="16" 
                             Fill="Transparent" 
                             StrokeThickness="1">
        abc
    </local:OutlinedTextBlock>

The outline stands on the center of the border of the letter, how can I make the outline be out of the letters? I need the fill to be transparent and only the outline will have color.

Something like that:

My text is not fixed but can be changed by the user.

Answer 1

You need to push clip geometry, Just add 4 new lines to this code

    protected override void OnRender(DrawingContext drawingContext)
    {
        EnsureGeometry();

        var boundsGeo = new RectangleGeometry(new Rect(0, 0, ActualWidth, ActualHeight));
        var invertGeo = Geometry.Combine(boundsGeo, _TextGeometry, GeometryCombineMode.Exclude, null);

        drawingContext.PushClip(invertGeo);
        drawingContext.DrawGeometry(null, _Pen, _TextGeometry);
        drawingContext.Pop();

        drawingContext.DrawGeometry(Fill, null, _TextGeometry);
    }

But then you would need to double the StrokeThickness, since only half of the stroke is visible.

result: