¿Cómo aplico un efecto a un borde pero no a su contenido en WPF?
Pregunta
Tengo una aplicación WPF que tiene una cuadrícula de datos de terceros con un borde alrededor. He usado el DropShadowEffect
para poner una sombra detrás del borde, pero esto parece afectar un poco el rendimiento (no tanto como un BitmapEffect
, pero aún es notable) y hace que la fuente de renderización difusa. ¿Hay alguna manera de aplicar de alguna manera el efecto al borde, pero no su contenido?
Intenté establecer el efecto en los contenidos en {x: Null}
, pero eso no ayudó.
Aquí hay una aplicación de muestra que se me ocurrió. Pone una sombra detrás del borde, pero también pone una sombra detrás de cada línea de texto. Quiero la sombra detrás del borde, pero no el texto.
<Window x:Class="WpfEffectTest.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Grid>
<Border BorderBrush="Black" BorderThickness="10" CornerRadius="5" Margin="25">
<Border.Effect>
<DropShadowEffect BlurRadius="10" ShadowDepth="5" />
</Border.Effect>
<StackPanel>
<TextBlock>This is some text</TextBlock>
<TextBlock>This is some text</TextBlock>
<TextBlock>This is some text</TextBlock>
<TextBlock>This is some text</TextBlock>
<TextBlock>This is some text</TextBlock>
<TextBlock>This is some text</TextBlock>
</StackPanel>
</Border>
</Grid>
</Window>
Solución
El enlace de gcores tenía la respuesta, que es poner el borde y su contenido juntos en la misma cuadrícula para que el contenido se superponga al borde.
<Window x:Class="WpfEffectTest.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Grid>
<Border BorderBrush="Black" BorderThickness="10" CornerRadius="5" Margin="25">
<Border.Effect>
<DropShadowEffect BlurRadius="10" ShadowDepth="5" />
</Border.Effect>
</Border>
<StackPanel Margin="35">
<TextBlock>This is some text</TextBlock>
<TextBlock>This is some text</TextBlock>
<TextBlock>This is some text</TextBlock>
<TextBlock>This is some text</TextBlock>
<TextBlock>This is some text</TextBlock>
<TextBlock>This is some text</TextBlock>
</StackPanel>
</Grid>
</Window>
Otros consejos
Una solución simple (¿hackear?) es hacer
<StackPanel Background="White">
Esto debería resolver el texto con un problema de sombra (No estoy seguro acerca del problema de rendimiento). El problema es que WPF aplica efectos al elemento establecido y a todos sus elementos secundarios en el árbol visual. Este enlace lo explica mejor: Problema de rendimiento DropShadowEffect
Pruebe el siguiente bloque (o similar) para todos los TextBlocks:
<TextBlock>
<TextBlock.Effect>
<DropShadowEffect BlurRadius="30" ShadowDepth="5" Color="White"/>
</TextBlock.Effect>
</TextBlock>