Click here to Skip to main content
12,829,374 members (40,520 online)
Click here to Skip to main content
Add your own
alternative version

Tagged as


22 bookmarked
Posted 3 May 2010

Wizard Control based on TabControl

, 3 May 2010 CPOL
Rate this:
Please Sign up or sign in to vote.
Wizard Control based on TabControl. Takes care of next and back movements.


EZWizard is a wizard control that generates wizard pages from tabcontrol tabpages.


I was trying to create a business application and there was a need of a wizard control. My requirement was to place various controls in different positions and hence I needed a GUI for my wizard. I was using TabControl for this purpose, but then I created this control which transforms the tabcontrol into a wizard.

Why Another Wizard

TabControl is a very interesting control. It provides Page support which doesn't exist in any other control. I wanted to utilize its paging capability and automate the process of display as a Wizard. The earlier idea was to show one tabpage at once. But it was easier to copy paste the controls to background panel. If you need a sophisticated wizard control with multiple capabilities, you can use any other wizard available on CodeProject. This wizard provides a very simple interface which is available for modification.

How It Works

The Wizard Control is basically a Form with three sections.

  • Top Area - This area contains two labels. The first label is the Title of the wizard. It should be changed manually. It can further be decorated as you like. The second label is to show the step on which the wizard is at. This is changed at run time based on the currently displayed tabpage.
  • Middle Area - The most important area of all. It contains a Panel and a TabControl. The TabControl is where the controls (to be displayed at runtime) are added at design time. Different pages of the TabControl make the various pages of the wizard. This is achieved by a simple method:
    private void SetCurrentTab(int currentIndex)
        if (currentPanelIndex > -1) //remove all old controls back to tabcontrol
            int count = m_panelContainer.Controls.Count;
            for (int i = count - 1; i >= 0; i--)
                Control control = m_panelContainer.Controls[i];
            int count = tabControl.TabPages[currentIndex].Controls.Count;
            m_labelSubtitle.Text = (currentIndex + 1) + " : " + 
            for (int i = count - 1; i >= 0; i--)
                Control control = tabControl.TabPages[currentIndex].Controls[i];
            currentPanelIndex = currentIndex;

    The first part of the method removes the controls from the panel to the previous tabpage while the next part of the method copies the controls from the next tabpage to panel.

  • Bottom Area - This is where the Navigation Buttons are. When you click on the Next or Back button, they call for condition checking methods ( NextButtonClicked or BackButtonClicked). If the condition method is returned as true, the next tabpage is copied to the panel.

    Whenever a tabpage is changed, the second label text is changed based on new tabpage's Text property.

    m_labelSubtitle.Text = (currentIndex + 1) + " : " + 

Using the Code

Just copy the file to your template directory to be able to add new wizards into your application. Steps to do that are available here.

Step 1

Simply add a new wizard to your application using "Add New Item" method. You can change the name and formatting of the title. You can also change the background of the panel if you wish to do so.

Step 2

Add TabPages to the tabControl in the middle to add pages into the wizard. Further, place controls on these pages as they should be shown on different pages of the wizard.

By default, all the items in the tab pages are laid out exactly in the same layout on the wizard.

Step 3

In order to load any data before the wizard is loaded, you can use the LoadData method. If you wish, you can also place this method on OnLoad event.

To add any condition for the movement of pages, you can use the methods: NextButtonClicked and BackButtonClicked.

For example, if your first page has a TextBox named textBox1 and it is necessary to fill it before moving to the next page, a condition like this will do the trick.

bool NextButtonClicked()
    switch (currentPanelIndex)
        case 0:
            if(textBox1.Text.Length == 0)
                return false;

    return true;

A similar case can be used for using the back button.

Points of Interest

Almost everything in this control is modifiable. The look can be changed. You don't need to worry about the gray background of the tabpages. You can add a new Panel into the page, color it the way you want it and voila, it will be shown in that color. I suggest you play with your imagination.

One of the most important possibilities in this wizard is that the content of Pages 2, 3 can be updated based on the previous pages. This may be really useful in case of selective options.


This is the first step. Any suggestions are welcome.


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


About the Author

Som Shekhar
India India
No Biography provided

You may also be interested in...


Comments and Discussions

Generalvery smart friend Pin
Member 87144219-Oct-12 12:57
memberMember 87144219-Oct-12 12:57 
GeneralRe: very smart friend Pin
Som Shekhar10-Oct-12 0:14
memberSom Shekhar10-Oct-12 0:14 
GeneralRe: very smart friend Pin
Member 871442110-Oct-12 3:51
memberMember 871442110-Oct-12 3:51 
GeneralGood idea but implementation is fairly limited Pin
Ed Bouras10-May-10 9:17
memberEd Bouras10-May-10 9:17 
I too was recently posed with the same conditions that you were upon making this wizard. I also chose the tab control -- it is the best way to see all the wizard "steps" in one cohesive package (the form-based templates force you to stretch out the wizard logic across multiple classes/forms). But I have to disagree with you that removing and adding controls at runtime is a solution worthy of calling this experiment "done". It appears more as a hack around a not-too-troubling issue at best. I understand your wizard is meant to be basic, but I feel like your deliberative choice of a tab control is undermined by the fact that you essentially side-line it during runtime. I urge you to go a little further with this project and try to center the wizard upon the tab control - it is worth it.

There are a couple of ways to hide the tabs at runtime (or designtime if you want). This allows you to see the tabs at design time but not a run time. You can manually set the Region property of the TabControl to the rectangle of one of the tab pages - this is a very seamless effect, but it requires that you keep refreshing this region when the form is resized (assuming the tab control is docked to Fill). You can also set a few TabControl properties that leave only a "halo effect" :
ItemSize = (0, 1)
SizeMode = TabSizeMode.Fixed
Appearance = TabAppearance.Buttons

I went with a wizard base form that encapsulates all the wizard logic into the base controls (e.g. tab control, top panel, buttons) and exposes events (much like John Simmons's article shows) that reflect the needs of the wizard. This is a much more extensible approach, and let's face it - wizards should be like templates, not one-offs. By extensible I mean the flexibility to allow for custom actions at pre- and post-page showing events, a validation event with cancelling ability, dynamically changing the order of the pages (essentially allowing for "branching" features).

Anyhow, didn't mean this as a rant - just constructive criticism. D'Oh! | :doh:
GeneralRe: Good idea but implementation is fairly limited Pin
Som Shekhar10-May-10 9:34
memberSom Shekhar10-May-10 9:34 
Generalnice work! Pin
VirtualVoid.NET3-May-10 7:46
memberVirtualVoid.NET3-May-10 7:46 
GeneralRe: nice work! Pin
Som Shekhar3-May-10 8:10
memberSom Shekhar3-May-10 8:10 

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
Web02 | 2.8.170326.1 | Last Updated 3 May 2010
Article Copyright 2010 by Som Shekhar
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid