Search code examples
c#wpfxamlpixel-shader

Apply DropShadowEffect to WPF Textbox text


How can I apply the DropShadowEffect on the content of a TextBox, as opposed to around the TextBox itself? I'd like the text to have the same effect as if I applied DropShadowEffect to a TextBlock.

<TextBox>
    <TextBox.Effect>
    <DropShadowEffect ShadowDepth="4"
                      Direction="330"
                      Color="Black"
                      Opacity="0.5"
                      BlurRadius="4"/>
    </TextBox.Effect>
</TextBox>

^This creates shadow around the entire box.

<TextBlock>
    <TextBlock.Effect>
    <DropShadowEffect ShadowDepth="4"
                      Direction="330"
                      Color="Black"
                      Opacity="0.5"
                      BlurRadius="4"/>
    </TextBlock.Effect>
</TextBlock>

^This is the desired look. (But for the TextBox text)

EDIT: Take home message is that shaders are applied to every rendered pixel of a control. If you want to apply it to only parts of it, either apply it on that level on that template, or don't render everything else.


Solution

  • Instead you might want to remove the Border, Background and Focus rectangle from the textbox so you still have the TextBox functionality:

    <TextBox Background="Transparent"
             BorderBrush="Transparent"
             BorderThickness="0"
             TextWrapping="Wrap">
        <TextBox.Effect>
            <DropShadowEffect ShadowDepth="4"
                              Direction="330"
                              Color="Black"
                              Opacity="0.5"
                              BlurRadius="4"
                               />
        </TextBox.Effect>
        <TextBox.FocusVisualStyle>
            <Style>
                <Setter Property="Control.Template">
                    <Setter.Value>
                        <ControlTemplate/>
                    </Setter.Value>
                </Setter>
            </Style>
        </TextBox.FocusVisualStyle>
    </TextBox>