Click here to Skip to main content
13,352,161 members (72,883 online)
Click here to Skip to main content
Add your own
alternative version


18 bookmarked
Posted 15 Aug 2011

Adding Lightbox Effect to Winform Applications

, 18 Aug 2011
Rate this:
Please Sign up or sign in to vote.
Adding Lightbox effect to Winform Applications


This article is about how to add a simple "Lightbox Effect" with few lines of code.


"<a href="" target="_blank">Lightbox</a>" can be defined as an overlay with a transparent background. It just opens the form as a modal dialog. Here the user can open a new form rather than closing the previous form. The use of the dark background which makes the form dim on which the other form is overlaid on it. With this Lightbox effect, one can smoothly animate their winform applications and give them a customized look and feel. It is fully customizable, more convenient and 100% compatible.


As we have seen how to add a Light box effect in webpages earlier, using JavaScript and other third party .dll </span />or</span /> CSS files, here we are going to see how to add that to our winforms application in a simpler way without using any third party tools or by using JavaScript. And we see the power of GDI here. Now let us see how to get that effect on our Winforms application. </span />

Using the Code

I would like to briefly describe in a step wise manner so that it will be easy to understand.

Step 1: Create a new project and give any name to your project.

Step 2: Create two forms namely Form1 and Form2.

Step 3: As shown in the below Image, you need to set the properties for the Form2. You'll need to set the size based on the size of the Form1 (i.e., First you need to check the size of the Form1 and then set the same size to the Form2).

Step 4: Now go to Form2 and Change its border style to "None" as shown below.

Now you get the resultant Form2 as shown below:

Step 5: Now just copy and paste the below code:

Protected Overrides Sub OnPaintBackground(ByVal e As PaintEventArgs)
       Using brush As Brush = New SolidBrush(Color.FromArgb(65, Color.Black))
           e.Graphics.FillRectangle(brush, e.ClipRectangle)
       End Using
End Sub

In the above code, we are just painting the form using brush with color "black" and set its opacity to "65".

The OnPaint background method paints the background of the control which is on the Form2.

Step 6: Now just design your Form1 as however you like as for sample. I have designed my form for my convenience as shown below:

Step 7: Next, you need to go to Form1 and add the code below:

Private Sub Button1_Click(ByVal sender As System.Object, _
  ByVal e As System.EventArgs) Handles Button1.Click
      Dim Lightbox As New Form2()
      Lightbox.SetBounds(Me.Left + 8, Me.Top + 30, _
      Me.ClientRectangle.Width, Me.ClientRectangle.Height)
      Lightbox.Owner = Me
  End Sub

In the above code, I have just declared to show my second Form, i.e., "Form2".

"Setbounds" is nothing but it takes into the consideration only the part below the "Toolstrip" to the part above the "StatusStrip". So you can adjust as per your requirements.

Step 8: After doing this, "Hit F5" and press "Button1" to see the output result and you can find the result as shown below.

As some of them asked me to add animation effects, I have added which you can see in the below screenshot as it resembles the original Lightbox effect which you can feel while validating records.

And similar to these, I have added two more Forms to give the same effect with different colours and transparency as you can see below:


  • Version 1.0
  • Version 1.1 (Made customized look and feel, added animation and transparency)


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Kiran Volety
India India
Basically I am techy guy and presently doing Masters in Applied computer science and engineering at VUB University(Brussels)

You may also be interested in...


Comments and Discussions

QuestionNot able to run Pin
paparao30-Jul-12 2:40
memberpaparao30-Jul-12 2:40 
AnswerRe: Not able to run Pin
Kiran Volety24-Sep-12 8:41
memberKiran Volety24-Sep-12 8:41 
GeneralMy vote of 3 Pin
stingrayweb9-May-12 0:50
memberstingrayweb9-May-12 0:50 
QuestionVery good post Pin
Hamlet Escaño15-Aug-11 11:22
memberHamlet Escaño15-Aug-11 11:22 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.180111.1 | Last Updated 19 Aug 2011
Article Copyright 2011 by Kiran Volety
Everything else Copyright © CodeProject, 1999-2018
Layout: fixed | fluid