Setting the Foreground property of a RichEditBox to a LinearGradientBrush doesn't have any effect.

Question

I'm trying to set the foreground of a XAML RichEditBox to a linear gradient so that the text appears to fade to transparency at the top and bottom edges of the RichEditBox. I've specified the LinearGradientBrush as follows:

<LinearGradientBrush x:Key="ForegroundColor" StartPoint="0.5,0" EndPoint="0.5,1">
    <GradientStop Color="#00424242" Offset="0.0"/>
    <GradientStop Color="#FF424242" Offset="0.1"/>
    <GradientStop Color="#FF424242" Offset="0.9"/>
    <GradientStop Color="#00424242" Offset="1.0"/>
</LinearGradientBrush>

For some reason, this doesn't do anything, and the text color defaults to black. Even when I remove the opacity and change the color values to different primary colors, there is no change to the color of the text. However, if I set the key "ForegroundColor" to a SolidColorBrush, the text will be colored correctly. The gradient should be specified correctly, because I can change the background of the RichEditBox to it and it displays as would be expected.

Am I doing something wrong? How can I achieve the desired effect?

Answer 1

You'll need to use a different control. The RichEditBox doesn't support gradients. It doesn't use the foreground brush directly as it doesn't have a single foreground. Each character can have a different format that is represented in an ITextCharacterFormat. The ITextCharacterFormat.ForegroundColor property takes just a Color, not a more complex brush.

Answer 2

Thanks. What I am trying to do is actually to make the contents of the RichEditBox as a whole appear to fade away as they approach the top and bottom edges of the control. I'm not trying to add transparency to individual letters. Is there any way that I might be able to do this?

Answer 3

Not directly.

You could render the RichEditBox to a bitmap and then mimic an Opacity Mask as James demonstrated in his blog entry How to apply an “Opacity Mask” to an image by mixing XAML and Direct2D

--Rob