DotNetCypher: September 2011

Lightbox is an effect that fades the pagein the background to show you new content in the foreground.
We may call it Lightbox, or Greybox, or Thickbox, but it’s always the same effect

We can add this effect easily in web application using javascript, css or any of third party plugins like Jquery, ajax. Now we can see how to add the Light Box effect in Windows Forms in sinple way with out using any javascript or any third party dll's.

Create two forms namely Form1 and Form2.
Set following properties for the Form2.

BackColor=ControlDark (what color we want to show,we can select that color)
FormBorderStyle=None
ShowInTaskbar=False
SizeGripStyle=Hide
StartPosition=Manual
Opacity=50%(opacity value depends on visiblity of background form controls).

3. Place the button in the Form1,write the following code in the button click event

    private void button1_Click(object sender, EventArgs e)
        {
            Form2 form2 = new Form2();
            form2.SuspendLayout();
            int BorderWidth = 0;
            //Get the border width values of the form
            if (this.VerticalScroll.Visible == true)
                BorderWidth = (this.Width - (this.ClientSize.Width +

                                         SystemInformation.VerticalScrollBarWidth)) / 2;
            else
                BorderWidth = (this.Width - this.ClientSize.Width) / 2;
            //Get the Title bar height of the form
            int TitlebarHeight = this.Height - this.ClientSize.Height - 2 * BorderWidth;
            //Setting the Current form(Form1) bounds to the Form2 bounds
            if (this.VerticalScroll.Visible == true)
                form2.SetBounds(this.Left, this.Top + TitlebarHeight + BorderWidth, this.ClientSize.Width+ SystemInformation.VerticalScrollBarWidth + BorderWidth * 2,this.ClientSize.Height + BorderWidth);
            else
                form2.SetBounds(this.Left, this.Top + TitlebarHeight + BorderWidth, this.ClientSize.Width+BorderWidth * 2, this.ClientSize.Height + BorderWidth);
            form2.PerformLayout();
            form2.Owner = this;
            form2.Show();

            // Here we can show popup window /Dialog box/another form also like Message Box shown in this code.
            MessageBox.Show(this,"This is the light box effect","DotNetCypher", MessageBoxButtons.OK ,MessageBoxIcon.Information);
            form2.Close();//disableing the effect
        }

Here are the output forms looks like..

Before Light Box:-

After Light Box :-

In general way .net programmers use the built-in web browser control to display the HTML format content in the windows applications.it is very simple to do.But the web browser control visual appearance (font wise) is not same as the windows controls (Label,Rich Text Box) appearance.we never get windows font look using web browser control because always there is difference between web and windows visualization.
To over come this apply the simple trick here.

Place the rich text box control in the form.
Create the Web Browser control form the code behind
Bind the html content to web browser.
Select and copy the html content Using the HTML document ExecCommand()
Paste content to rich text box using the paste() method of Rich text box

Here is the code looks like.

var webBrowser = new WebBrowser();
webBrowser.CreateControl(); // only if needed
webBrowser.DocumentText = "<html><body><b>DotnetCyphers</b></body></html>";
while (webBrowser.DocumentText != "<html><body><b>DotnetCyphers</b></body></html>")

Application.DoEvents();
webBrowser.Document.ExecCommand("SelectAll", false, null);
webBrowser.Document.ExecCommand("Copy", false, null);
richTextBox1.Paste();
richTextBox1.ReadOnly = true;

ExecCommand() executes a command on the current document,/current selection/ the given range.

DotNetCypher

Pages

Sep 23, 2011

Light box Effect in .net Windows application

Sep 22, 2011

Displaying the HTML format content into Rich text box using c#