Blur background in WPF

Question

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.

enter image description here

[Here](http://stackoverflow.com/a/27447817/815938) is a code sample. — kennyzx, Jan 11 '15 at 04:54
See my link in the first comment of the above linked question. Despite the OP of that question disregarding my advice, it does exactly what you want. — Federico Berasategui, Jan 11 '15 at 05:14
Have you found a way to do this? The answers given are not satisfactory... — LueTm, Mar 28 '18 at 15:38

score 5 · Accepted Answer · answered Apr 20 '16 at 02:19

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.

score 2 · Answer 2 · answered Jun 19 '18 at 14:32

2

Just in case, someone is still looking for a solution in 2018, something like this worked for me: BlurryControls.BlurryUserControl.cs

answered Jun 19 '18 at 14:32

ConfusedHorse

99
1
8

5

Please post the relevant parts of the solution here, as this answer might get useless if the linked page changes or vanishes – Nico Haase Jun 19 '18 at 14:59

Dhru 'soni · Answer 3 · 2015-01-11T06:25:02.023

-2

<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>

edited Jan 11 '15 at 06:25

answered Jan 11 '15 at 06:02

Dhru 'soni

1,024
7
23

1

I fail to see how that answers OP's question. – B.K. Jan 11 '15 at 06:04
The OP didn't ask how to make the grid semi transparent but how to add a blur effect to whatever is behind it, this answer only makes it transparent which is the easy part hence my -1. – Ronan Thibaudau Jan 11 '15 at 06:23
go through this link for blurry transparent – Dhru 'soni Jan 11 '15 at 06:26
3

@Dhru'soni The link is dead, could you have the information about it ? thanks – qakmak Mar 15 '16 at 16:42

Blur background in WPF

3 Answers3

Linked

Related