Creating Wizard Pages

Wizard Pages

Introduction

A wizard page is a dialog box that is part of suite usually used to create or configure something. If you have installed a printer using the Add Printer from the Printers folder, or if you have used applications such as Microsoft Access to create objects automatically, then you are quite familiar with wizard pages.

A wizard (usually) starts by displaying a dialog that has at least a Next button. After performing an action and clicking Next, you are presented with another dialog or area displaying buttons such as Next and Back. These two buttons allow the user to navigate back and forth while performing a specific task. A more advanced wizard can display many other buttons than that. Such wizards display Back, Next, Finish, Close (or Cancel), and sometimes Help on the same dialog box.

Property pages and wizard are absolutely easy to create in Borland C++ because they use a process that is quite different from Borland C++ Builder. This is because, in MSVC, you <<must>> involve a class called CPropertySheet, then create dialog boxes based on the CPropertyPage class. Because Borland C++ Builder ships with so many controls, it provides so many options to create wizards. The technique we are going to use here uses simple logic, so much that you do not need to know much. By dragging and dropping controls on a form, all you have to do is decide what control is visible when.

 

Dragging And Dropping Controls

Borland C++ Builder ships with so many container controls we are going to use panels to carry controls relative to each page of our wizard. When other controls are placed on a panel, the panel acts as their parent. This means when the panel is not Enabled or Visible, the controls it hosts abide by the same property.

  1. Start Borland C++ Builder with the startup form.

  2. From the Standard page of the Component Palette, double-click the Panel control.

  3. Set the following properties for the panel (leave the other properties intact): BevelOuter = bvNone; Caption = empty; Height = 265; Left = 0; Name = pnlFirstPage; Top = 0; Width = 430;

  4. From the Component Palette, click the Edit control and click anywhere on the panel. This is a simple control that will serve as an indication when we are in the first page.

  5. Click the panel on the form to make sure it is selected.

  6. On the main menu, click Edit -> Copy.

  7. Click an empty area on the form to deselect the panel and select the form.

  8. On the main menu, click Edit -> Paste.

  9. With the new pasted panel still selected, change its properties as follows:  Left = 0; Name = pnlSecondPage; Top = 0

  10. From the Component Palette, click the ScrollBox control and click on the panel.

  11. Click an empty area on the form to select the form.

  12. From the main menu, click Edit -> Paste.

  13. For the newly pasted panel, change the properties as follows: Left = 0; Name = pnlThirdPage; Top = 0

  14. On the Component Palette, click the GroupBox control and click on the current panel.

  15. On the Component Palette, click the Additional tab.

  16. Click the Bevel control.

  17. Click an unoccupied area in the lower section of the form.

  18. Change the properties of the Bevel control as follows: Height = 25; Left = 0; Shape = bsTopLine; Top = 272; Width = 430

  19. On the Component Palette, click the Standard tab.

  20. Click the Button control.

  21. Click in the lower section of the form

  22. Change the properties of the button as follows: Caption = &Back; Left = 112; Name = btnBack; Top = 280

  23. Add another button on the right side of the Back button and change its name to btnNext

  24. Add another button of the right side of the Next button and change its name to btnFinish

  25. Add one more button on the right side of the finish button. Set its Cancel property to True and its name to btnCancel

Configuring the Wizard Pages

The design of the form with its control was quite straightforward. To configure the pages, we will use the container ability of a panel. This will allow us to decide what panel to show and which one to hide, and when

  1. Double-click the Cancel button to access its OnClick() event.

  2. Implement the event as follows:
    Listing
    //---------------------------------------------------------------------------
    void __fastcall TForm1::btnCancelClick(TObject *Sender)
    {
        Close();
    }
    //---------------------------------------------------------------------------

  3. To bring back the form, press F12.

  4. Double-click an empty area on the form to access the form's OnCreate() event.

  5. Implement the FormCreate() event as follows:
    Listing
    //---------------------------------------------------------------------------
    void __fastcall TForm1::FormCreate(TObject *Sender)
    {
        // We are in the first page now
        pnlFirstPage->Visible  = True;
        pnlSecondPage->Visible = False;
        pnlThirdPage->Visible  = False;
        btnBack->Enabled       = False;
    }
    //---------------------------------------------------------------------------

  6. Press F12 to display the form.

  7. Double-click the Back button to access its OnClick() event.

  8. Implement it as follows:
    //---------------------------------------------------------------------------
    void __fastcall TForm1::btnBackClick(TObject *Sender)
    {
        if( pnlSecondPage->Visible == True )
        {
            pnlFirstPage->Visible  = True;
            pnlSecondPage->Visible = False;
            pnlThirdPage->Visible  = False;
            btnBack->Enabled       = False;
            btnNext->Enabled       = True;
        }
        else if( pnlThirdPage->Visible == True )
        {
            pnlFirstPage->Visible  = False;
            pnlSecondPage->Visible = True;
            pnlThirdPage->Visible  = False;
            btnBack->Enabled       = True;
            btnNext->Enabled       = True;
            btnFinish->Enabled     = True;
        }
    }
    //---------------------------------------------------------------------------

  9. Press F12 to bring back the form.

  10. Double-click the Next button and implement its OnClick() event as follows:
    //---------------------------------------------------------------------------
    void __fastcall TForm1::btnNextClick(TObject *Sender)
    {
        // If you are in the first page
        if( pnlFirstPage->Visible == True )
        {
            pnlFirstPage->Visible  = False;
            pnlSecondPage->Visible = True;
            pnlThirdPage->Visible  = False;
            btnBack->Enabled       = True;
            btnNext->Enabled       = True;
            btnFinish->Enabled     = True;
        }
        else if( pnlSecondPage->Visible == True )
        {
            pnlFirstPage->Visible  = False;
            pnlSecondPage->Visible = False;
            pnlThirdPage->Visible  = True;
            btnBack->Enabled       = True;
            btnNext->Enabled       = False;
            btnFinish->Enabled     = False;
        }
        else// if( pnlThirdPage->Visible == True )
        {
            btnNext->Enabled   = True;
            btnBack->Enabled   = True;
            btnFinish->Enabled = True;
        }
    }
    //---------------------------------------------------------------------------

  11. Press F12 to bring back the form.

  12. Double-click the Finish button and implement its OnClick() event as follows:
     
    //---------------------------------------------------------------------------
    void __fastcall TForm1::btnFinishClick(TObject *Sender)
    {
        pnlFirstPage->Visible  = False;
        pnlSecondPage->Visible = False;
        pnlThirdPage->Visible  = True;
        btnBack->Enabled       = True;
        btnNext->Enabled       = False;
    }
    //---------------------------------------------------------------------------

  13. To test the application, press F9.

 

Copyright 2003 FunctionX, Inc.