Adding pages to a tab control is very easy in VB. It is a little harder in VC++, because the resource editor is quite different and more limited than the one in VB.

The best way to add pages to a C1Tab control in VC++ is to create each page as a separate dialog class, then add them to the control at runtime, by reparenting them.

To create each page, select the Insert|Resource… menu, select Dialog, and click New. Delete the controls added by the AppWizard, then right click the dialog, select the Properties menu, the Styles page, and set Style to Child and Border to None. This will create a blank page, without a border.

Right click on the page and add the controls you want. For example, add an Elastic control, an Edit box and two buttons, so your dialog looks like this:

Note that when you create the controls, the resource editor places the new controls behind existing ones. To fix this so you can see all controls, select Layout|Tab Order (ctrl+D) and click each control in turn, leaving the container controls for last. When you are done, you will see all controls on the form:

Next, right-click the Elastic, select the Properties menu, select the Main property page and set the Align property to 5 - asFill and the AutoSizeChildren property to 8 – azGrid. Click the Grid Editor button to edit the grid. Right click the bottom horizontal line and select the Splitter menu (as you would in VB). Close the property window and the Elastic will display the grid. Drag the controls so they are close to their positions on the grid, as shown below: (In VB, the controls would snap to the grid at design time. In VC++, they will snap to the grid only at run time.)

Hold down the control key and double-click the C1Elastic control to add a member variable for it. The AppWizard will tell you that it needs to create a class to encapsulate the new dialog. Click OK, and call the new class CTabPage1.

Now that the class has been defined, hold down the control key and double-click the C1Elastic control again to add the member variable. Call it m_Elastic.

Now double-click the first button and the AppWizard will create an empty stub for the event handler. Go back to the dialog and repeat this process for the second button. At this point, you will have two empty event handlers for the dialog.

Now hold down the control key and double click the Edit control. The AppWizard will prompt you for the information it needs to create a new member variable. Type m_Edit for the variable name, and select Category Control (instead of Value):

Once the control has been mapped to a variable, you can write the event-handler code, filling out the stubs as follows:

void C1TabPage1::OnButton1()

{

       m_Edit.SetWindowText("You clicked button 1.");

}

 

void C1TabPage1::OnButton2()

{

       m_Edit.SetWindowText("You clicked button 2.");

}

There is a subtle but important detail going on here. Usually, VC++ lets you refer to controls on a dialo by their ID, using functions such as GetDlgItem, SetDlgItemText, etc. You should not use this technique here. To make resizing work, we will re-parent the controls later, and the Dlg functions will not be able to find the controls. You should stick to control member variables, which work even if you reparent the controls.

To make the sample interesting, and to practice a little, you should create two more pages, following the same steps described above. Make the pages look a little different so you can easily tell when the user switches them. Call the new pages CTabPage2 and CTabPage3.

Copyright (c) GrapeCity, inc. All rights reserved.