Dewsoft Frontpage Tutorials

Lesson -9:Property Pages and Sheets

9.2- Creating the Property Sheet Demo Application

Now that you’ve had an introduction to property sheets, it’s time to learn how to build an application that uses these handy specialized dialog boxes. You’re about to build the Property Sheet Demo application, which demonstrates the creation and manipulation of property sheets. Follow the steps in the following sections to create the basic application and modify its resources.

9.2.1 Creating the Basic Files

First, use AppWizard to create the basic files for the Property Sheet Demo program, selecting the options listed in the following table. When you’re done, the New Project Information dialog box appears; it will look like Figure 9.2. Click OK to create the project files.

Dialog Box Name	Options to Select
New, Project tab	Name the project Propsheet and then set the project path to the directory in which you want to store the project’s files. Make sure that MFC AppWizard (exe) is highlighted. Leave the other options set to their defaults.
Step 1	Select Single Document.
Step 2 of 6	Leave set to defaults.
Step 3 of 6	Leave set to defaults.
Step 4 of 6	Turn off all application features.
Step 5 of 6	Leave set to defaults
Step 6 of 6	Leave set to defaults.

FIG. 9.2 Your New Project Information dialog box looks like this.

9.2.2 Editing the Resources

Now you’ll edit the resources in the application generated for you by AppWizard, removing unwanted menus and accelerators, editing the About box, and most importantly, adding a menu item that will bring up a property sheet. Follow these steps:

1. Select the ResourceView tab in the project workspace window. Developer Studio displays the ResourceView window .

2. In the ResourceView window, click the plus sign next to Propsheet Resources to display the application’s resources. Click the plus sign next to Menu and then double-click the IDR_MAINFRAME menu ID. Visual C++’s menu editor appears, displaying the IDR_MAINFRAME menu generated by AppWizard.

3. Click the Property Sheet Demo application’s Edit menu (not Visual C++’s Edit menu) and then press Delete to delete the Edit menu. A dialog box asks for verification of the Delete command; click OK.

4. Double-click the About Propsheet... item in the Help menu to bring up its properties dialog box. Change the caption to &About Property Sheet Demo. Pin the properties dialog box in place by clicking the pushpin in the upper-left corner.

5. On the application’s File menu, delete all menu items except Exit.

6. Select the blank menu item at the end of the File menu, and change the caption to &Property Sheet... and the command ID to ID_PROPSHEET (see Figure 9.3). Then use your mouse to drag the new command above the Exit command so that it’s the first command in the File menu.

FIG. 9.3 Add a Property Sheet command to the File menu.

7. Click the + next to Accelerator in the ResourceView window and highlight the IDR_MAINFRAME accelerator ID. Press Delete to delete all accelerators from the application.

8. Click the + next to Dialog in the ResourceView window. Double-click the IDD_ABOUTBOX dialog box ID to bring up the dialog box editor.

9. Modify the dialog box by clicking the title so that the properties box refers to the whole dialog box. Change the caption to About Property Sheet Demo.

10. Click the first static text string and change the caption to Property Sheet Demo, Version 1.0. Click the second and add Dewsoft Overseas to the end of the copyright string.

11. Add a third static string with the text Programming with Microsoft Visual C++ so that your About box resembles the one in Figure 9.4. Close the dialog box editor.

12. Click the + next to String Table in the ResourceView window. Double-click the String Table ID to bring up the string table editor.

13. Double-click the IDR_MAINFRAME string and then change the first segment of the string to Property Sheet Demo (see Figure 9.5). The one you just changed is the Window Title, used in the title bar of the application.

FIG. 9.4 The About box looks like this.

FIG. 9.5 The first segment of the IDR_MAINFRAME string appears in your main window’s title bar.

9.2.3 Adding New Resources

Now that you have the application’s basic resources the way you want them, it’s time to add the resources that define the application’s property sheet. This means creating dialog box resources for each page in the property sheet. Follow these steps:

1. Click the New Dialog button on the Resource toolbar, or press Ctrl+1, to create a new dialog box resource. The new dialog box, IDD_DIALOG1, appears in the dialog box editor. This dialog box, when set up properly, will represent the first page of the property sheet.

2. Delete the OK and Cancel buttons by selecting each with your mouse and then pressing Delete.

3. If the Properties box isn’t still up, bring it up by choosing View, Properties. Change the ID of the dialog box to IDD_PAGE1DLG and the caption to Page 1 . FIG. 9.6 A property page uses styles different from those used in regular dialog boxes.

4. Click the Styles tab of the dialog box’s property sheet. In the Style drop-down box select Child, and in the Border drop-down box select Thin. Turn off the System Menu check box. Your properties dialog box will resemble Figure 9.6.

The Child style is necessary because the property page will be a child window of the property sheet. The property sheet itself will provide the container for the property pages.

5. Add an edit box to the property page. In most applications you would change the resource ID from IDC_EDIT1, but for this demonstration application, leave it unchanged.

6. Create a second property page by following steps 1 through 5 again. For this property page, use the ID IDD_PAGE2DLG, a caption of Page 2, and add a check box rather than an edit control .

9.2.4 Associating Your Resources with Classes

You now have all your resources created. Next, associate your two new property-page resources with C++ classes so that you can control them in your program. You also need a class for your property sheet, which will hold the property pages that you’ve created. Follow these steps to create the new classes:

1. Make sure that the Page 1 property page is visible in the dialog box edit area and then double-click it. If you prefer, choose View, ClassWizard from the menu bar.

2. Select the Create New Class option and then click OK. The New Class dialog box appears.

3. In the Name box, type CPage1. In the Base Class box, select CPropertyPage. (Don’t accidentally select CPropertySheet.) Then click OK to create the class.

You’ve now associated the property page with an object of the CPropertyPage class, which means that you can use the object to manipulate the property page as needed. The CPropertyPage class will be especially important when you learn about wizards.

4. Select the Member Variables tab of the MFC ClassWizard property sheet. With IDC_EDIT1 highlighted, click the Add Variable button. The Add Member Variable dialog box appears.

5. Name the new member variable m_edit and then click OK. ClassWizard adds the member variable, which will hold the value of the property page’s control, to the new CPage1 class.

6. Click OK on the MFC ClassWizard properties sheet to finalize the creation of the CPage1 class.

7. Follow steps 1 through 6 for the second property sheet. Name the class CPage2 and add a Boolean member variable called m_check for the IDC_CHECK1 control.

9.2.5 Creating a Property Sheet Class

At this point, you’ve done all the resource editing and don’t need to have so many windows open. Choose Window, Close All from the menu bar and close the properties box. You’ll now create a property sheet class that displays the property pages already created. Follow these steps:

1. Bring up ClassWizard and click the Add Class button. A tiny menu appears below the button; choose New. The New Class dialog box appears.

2. In the Name box, type CPropSheet, select CPropertySheet in the Base Class box, and then click OK.

3. ClassWizard creates the CPropSheet class. Click the MFC ClassWizard Properties sheet’s OK button to finalize the class.

Mow you have three new classes—CPage1, CPage2, and CPropSheet—in your program. The first two classes are derived from MFC’s CPropertyPage class, and the third is derived from CPropertySheet. Although ClassWizard has created the basic source-code files for these new classes, you still have to add code to the classes to make them work the way you want. Follow these steps to complete the Property Sheet Demo application:

1. Click the ClassView tab to display the ClassView window. Expand the Propsheet classes, as shown Figure 9.7.

2. Double-click CPropSheet to open the header file for your property sheet class. Because the name of this class (CPropSheet) is so close to the name of the application as a whole (PropSheet), you’ll find CPropSheet in PropSheet1.h, generated by ClassWizard when you created the new class.

3. Add the following lines near the middle of the file, right before the CPropSheet class declaration:

#include "page1.h"

#include "page2.h"

These lines give the CPropSheet class access to the CPage1 and CPage2 classes so that the property sheet can declare member variables of these property page classes.

FIG. 9.7 The ClassView window lists the classes that make up your project.

4. Add the following lines to the CPropSheet class’s //Attributes section, right after the public keyword:

CPage1 m_page1;

CPage2 m_page2;

These lines declare the class’s data members, which are the property pages that will be displayed in the property sheet.

5. Expand the CPropSheet class in the ClassView pane, and double-click the first constructor, CPropSheet. Add these lines to it:

AddPage(&m_page1);

AddPage(&m_page2);

This will add the two property pages to the property sheet whenever the sheet is constructed.

6. The second constructor is right below the first; add the same lines there.

7. Double-click CPropsheetView in ClassView to edit the header file, and add the following lines to the //Attributes section, right after the line CPropsheetDoc* GetDocument();:

protected:

CString m_edit;

BOOL m_check;

These lines declare two data members of the view class to hold the selections made in the property sheet by users.

8. Add the following lines to the CPropsheetView constructor:

m_edit = "Default";

m_check = FALSE;

These lines initialize the class’s data members so that when the property sheet appears, these default values can be copied into the property sheet’s controls. After users change the contents of the property sheet, these data members will always hold the last values from the property sheet, so those values can be restored to the sheet when needed.

9. Edit CPropsheetView::OnDraw() so that it resembles Listing 9.1. The new code displays the current selections from the property sheet. At the start of the program, the default values are displayed.

Listing 9.1 CPropsheetView::OnDraw()

void CPropsheetView::OnDraw(CDC* pDC)

{

CPropsheetDoc* pDoc = GetDocument();

ASSERT_VALID(pDoc);

pDC->TextOut(20, 20, m_edit);

if (m_check)

pDC->TextOut(20, 50, "TRUE");

else

pDC->TextOut(20, 50, "FALSE");

}

10. At the top of PropsheetView.cpp, after the #include of propsheet.h, add another include statement:

#include "propsheet1.h"

11. Bring up ClassWizard, click the Message Maps tab, and make sure that CPropsheetView is selected in the Class Name box. In the Object IDs box, select ID_PROPSHEET, which is the ID of the new item you added to the File menu. In the Messages box, select COMMAND. Click Add Function to add a function that will handle the command message generated when users choose this menu item. Name the function OnPropsheet(), as shown in Figure 9.8.

FIG. 9.8 Use ClassWizard to add the OnPropsheet() member function.

The OnPropsheet() function is now associated with the Property Sheet command that you previously added to the File menu. That is, when users select the Property Sheet command, MFC calls OnPropsheet(), where you can respond to the command.

12. Click the Edit Code button to jump to the OnPropsheet() function, and add the lines shown in Listing 9.2.

Listing 9.2 CPropsheetView::OnPropsheet()

void CPropsheetView::OnPropsheet()

{

CPropSheet propSheet("Property Sheet", this, 0);

propSheet.m_page1.m_edit = m_edit;

propSheet.m_page2.m_check = m_check;

int result = propSheet.DoModal();

if (result == IDOK)

{

m_edit = propSheet.m_page1.m_edit;

m_check = propSheet.m_page2.m_checkbox;

Invalidate();

}

The code segment in Listing 12.2, discussed in more detail later in this Unit, creates an instance of the CPropSheet class and sets the member variables of each of its pages. It displays the sheet by using the familiar DoModal function, if users click OK, it updates the view member variables to reflect the changes made on each page and forces a redraw with a call to Invalidate().

Next>>