migueladanrm
migueladanrm

Reputation: 235

Blur background in WPF

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

Upvotes: 13

Views: 14621

Answers (3)

ConfusedHorse
ConfusedHorse

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

aloisdg
aloisdg

Reputation: 23511

If you are looking for something like this:

blur cherries

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

Dhru &#39;soni
Dhru &#39;soni

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

Related Questions