Fade Out a Form in C#

Introduction

This article describes a simple approach to fading out a form. The approach used permits the user to define the number of incremental steps used to fade out the form; the form is faded by decreasing the forms opacity from 100% down to 0% using the number of steps defined and by an equivalent amount in each step.


 

Figure 1: Fading Out a Form (Test Application)

Getting Started

The solution contains two Windows forms (frmMain.cs and frmDirections.cs) and a single static class (FadeEffect.cs). The static class contains a single public static method (FadeForm) which accepts a Windows Form and a byte value as arguments. The form argument is the form to fade out of existence and the byte value allows the user to configure the number of incremental decreases in opacity that will be required to fade out the form (0 to 255). In the examples provided, this value is set to 50 but you can set it to any valid number with larger values creating slower fades and smaller values creating faster fades.

All of the code necessary to fade out a form is contained in the FadeForm class. The two forms call the FadeForm function within their overridden Dispose functions such that, whenever either form is disposed of, the fade effect is generated.

Figure 2:  Solution Explorer with the Project Visible

Code:  Fade Effect (FadeEffect.cs)

This class provides all of the functionality required to fade out a Windows Form. The code for this class is annotated and should be easy to follow. The class begins with the standard library imports; System.Windows.Forms was added as the FadeForm method accepts a Windows Form in its argument list.

using System;

using System.Collections.Generic;

using System.Text;

using System.Windows.Forms;

namespace FormFader

{

     /// <summary>

     /// Static class permitting access to static FadeForm function

     /// </summary>

     public static class FadeEffect

    {

 

The FadeForm function accepts a Windows Form and a byte value as its arguments. The Windows Form identifies the form to be faded; the byte value defines the number of steps though the form will be faded out. For example, if 25 is passed to the function, the form will be faded out in 25 equal steps. The amount of opacity decremented in each step is defined by dividing the starting point (100%) by the number of steps.

/// <summary>

/// Function used to fade out a form using a user defined number

/// of steps

/// </summary>

/// <param name="f">The Windows form to fade out</param>

/// <param name="NumberOfSteps">The number of steps used to fade the

/// form</param>

public static void FadeForm(System.Windows.Forms.Form f, byte NumberOfSteps)

{

     float StepVal = (float)(100f / NumberOfSteps);

     float fOpacity = 100f;

     for (byte b = 0; b < NumberOfSteps; b++)

     {

          f.Opacity = fOpacity / 100;

          f.Refresh();

          fOpacity -= StepVal;

     }

}

   }

}

Code:  Main Form (frmMain.cs)

This form class is used test the Fade Effect; the overridden dispose method has been modified to call the fade effect whenever the form is closed. Aside from that, the form is used to create an instance of another form (frmDirections.cs) which has also been modified to fade out the form upon disposal.

The code contained in the Dispose call is as follows:

/// <summary>

/// Clean up any resources being used.

/// </summary>

/// <param name="disposing">true if managed resources should be 

/// disposed; otherwise, false.</param>

protected override void Dispose(bool disposing)

{

     FadeEffect.FadeForm(this, 50);

     if (disposing && (components != null))

    {

         components.Dispose();

     }

          base.Dispose(disposing);

}

Code:  Directions Form (frmDirections.cs)

This form class is also used test the Fade Effect; the overridden dispose method has been modified to call the fade effect whenever the form is closed.

/// <summary>
/// Clean up any resources being used.
/// </summary>
/// <param name="disposing">true if managed resources should be 
/// disposed; otherwise, false.
///</param>
protected override void Dispose(bool disposing)
{
     FadeEffect.FadeForm(this, 50);
     if (disposing && (components != null)
    {
         components.Dispose();
    }
     base.Dispose(disposing);
}

Summary

This article was intended to demonstrate a simple approach to fading out a form using a variable number of decrements to that forms opacity value. It serves not other purpose than to possibly jazz up the UI a little bit.