Reputation: 235
I am trying to create a blur effect in WPF, but I want to blur the content located behind the control (such as a Grid), I do not intend to blur the contents of the Grid.
I want to do something like this image.
Upvotes: 13
Views: 14621
Reputation: 99
Just in case, someone is still looking for a solution in 2018, something like this worked for me: BlurryControls.BlurryUserControl.cs
Upvotes: 2
Reputation: 23511
If you are looking for something like this:
The answer is to use a BitmapEffect
:
<Image Source="http://www.pingminghealth.com/wp-content/uploads/2010/12/cherries.jpg" Stretch="UniformToFill">
<Image.BitmapEffect>
<BlurBitmapEffect Radius="20" />
</Image.BitmapEffect>
</Image>
You can find a tutorial about it on msdn: How to Apply a Blur Effect to a Visual.
Upvotes: 5
Reputation: 1058
<Rectangle>
<Rectangle.Effect>
<BlurEffect Radius="{DynamicResource BlurRadius}"/>
</Rectangle.Effect>
<Rectangle.Fill>
<VisualBrush
ViewboxUnits="Absolute"
Viewbox="{Binding RenderTransform.Children[3],
Converter={StaticResource TranslateTransformToRectViewboxVisualBrushConverter},
RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Grid}},
UpdateSourceTrigger=PropertyChanged}"
AlignmentX="Left" AlignmentY="Top"
Visual="{Binding ElementName=BackgroundContainer}" Stretch="None">
<VisualBrush.Transform>
<TranslateTransform X="0" />
</VisualBrush.Transform>
</VisualBrush>
</Rectangle.Fill>
</Rectangle>
Upvotes: -2