Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles
(untagged)

Blur Effect on Control

0.00/5 (No votes)
3 Apr 2014 2  
Simple code for applying and disabling blur effect on any UIElement

Introduction

This is a very simple class to apply and remove blur effect on UIElement in WPF.

Using the Code

You have only two extension methods: BlurApply and BlurDisable. The first one is called before applying effect - for example before showing dialog. The second one is usually called in finally block to guarantee returning to normal view even if exception occurred.

 try
 {
     this.BlurApply(BlurRadius, new TimeSpan(0, 0, 1), TimeSpan.Zero);
        MessageBox.Show("Test");
 }
 finally
 {
        this.BlurDisable(new TimeSpan(0, 0, 5), TimeSpan.Zero);
 }
 

Also, you can apply this to any UIElement, like this TextBlock:

 try
            {
                txt.BlurApply(BlurRadius, new TimeSpan(0, 0, 1), TimeSpan.Zero);
                MessageBox.Show("Test");
            }
            finally
            {
                txt.BlurDisable(new TimeSpan(0, 0, 5), TimeSpan.Zero);
            } 

The source code is as follows:

    public static class BlurElementExtension
    {
        /// <summary>
        /// Turning blur on
        /// </summary>
        /// <param name="element">bluring element</param>
        /// <param name="blurRadius">blur radius</param>
        /// <param name="duration">blur animation duration</param>
        /// <param name="beginTime">blur animation delay</param>
        public static void BlurApply(this UIElement element, 
            double blurRadius, TimeSpan duration, TimeSpan beginTime)
        {
                BlurEffect blur = new BlurEffect() { Radius = 0 };
                DoubleAnimation blurEnable = new DoubleAnimation(0, blurRadius, duration) 
                    { BeginTime = beginTime };
                element.Effect = blur;
                blur.BeginAnimation(BlurEffect.RadiusProperty, blurEnable);
        }
        /// <summary>
        /// Turning blur off
        /// </summary>
        /// <param name="element">bluring element</param>
        /// <param name="duration">blur animation duration</param>
        /// <param name="beginTime">blur animation delay</param>
        public static void BlurDisable(this UIElement element, TimeSpan duration, TimeSpan beginTime)
        {
            BlurEffect blur = element.Effect as BlurEffect;
            if (blur == null || blur.Radius == 0)
            {
                return;
            }
            DoubleAnimation blurDisable = new DoubleAnimation(blur.Radius, 0, duration) { BeginTime = beginTime };
            blur.BeginAnimation(BlurEffect.RadiusProperty, blurDisable);
        }
    } 

Thank you!

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here