Home

C++Builder Topics: Wizards Pages

   

Introduction

 

A wizard is a series of dialog boxes that assist the user with performing a task that requires intermediary steps. To implement its functionality, a wizard displays some buttons in the lower section of the dialog box.

Depending on the programmer, different wizards use a few or more buttons. Usually a wizard has buttons such as Back, Next, and Cancel.

 

Practical LearningPractical Learning: Creating a Wizard

  1. To start a new project, on the main menu, click File -> New -> VCL Forms Application - C++Builder
  2. From the Standard section of the Tool Palette, double-click the Panel control.
  3. Set the following properties for the panel (leave the other properties intact):
    BevelOuter: bvNone
    Caption: Delete
    Height: 265
    Left: 0
    Name: pnlFirstPage
    Top: 0
    Width: 430
  4. From the Tool Palette, click the TEdit control TEdit 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 Tool 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 Tool Palette, click the TGroupBox control TGroupBox and click on the current panel
  15. On the Tool Palette, click the Additional tab
  16. Click the TBevel control TBevel
  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 Tool Palette, click the Standard section
  20. Click the TButton control TButton
  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

Wizard Implementation

When a wizard starts, the user is presented with the first page. After using it, he or she can click Next to move to the subsequent page. The user can continue clicking Next to complete the necessary task(s) on each page. At any time and except on the first page, the user can click the Back button to move backward.

Most wizards have a Cancel button that would allow the user to dismiss the dialog box. In this case, whatever change the user would have performed on the controls hosted by the wizard would be discarded.

Many wizards are also equipped with a Finish button. There are two scenarios in which the Finish button can be used:

  • IIf the button displays at all times, that is, regardless of the page that is displaying, the presence of a Finish button means the user can click it to close the dialog box and end the task(s) performed
  • In most other wizards, when the user gets to the last page, the Next button would be changed to Finish. This allows the user to click Finish to close the dialog box

    Clicking Finish closes the wizard and sends the results or values of the controls on the pages to whatever is the purpose of the wizard.

Practical LearningPractical Learning: Implementing a Wizard

  1. Double-click the Cancel button to access its OnClick() event
  2. Implement the event as follows:
    //---------------------------------------------------------------------------
    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:
    //---------------------------------------------------------------------------
    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 )
    	{
    		pnlSecondPage->Visible = True;
    		pnlFirstPage->Visible = False;
    		pnlThirdPage->Visible = False;
    		btnBack->Enabled = True;
    		btnNext->Enabled = True;
    		btnFinish->Enabled = True;
    	}
    	else if( pnlSecondPage->Visible == True )
    	{
    		pnlThirdPage->Visible = True;
    		pnlFirstPage->Visible = False;
    		pnlSecondPage->Visible = False;
    		btnBack->Enabled = True;
    		btnNext->Enabled = False;
    		btnFinish->Enabled = True;
    	}
    	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)
    {
    	pnlThirdPage->Visible = True;
    	pnlFirstPage->Visible = False;
    	pnlSecondPage->Visible = False;
    	btnBack->Enabled = True;
    	btnNext->Enabled = False;
    	btnFinish->Enabled = False;
    }
    //---------------------------------------------------------------------------
  13. To test the application, press F9
     
    Wizard
     
    Wizard
     
    Wizard
  14. Close the wizard and return to your programming environment
 
 
 
 

Home Copyright © 2010-2011 FunctionX, Inc.