<P><A HREF="javascript:popUp('08uvc03.gif')"><B>FIG. 8.3</B></A><B> </B><I>AppWizard
creates two menus for ShowString.</I></P>
<P>You are going to add a menu item to ShowString, so the first decision is where
to add it. The user will be able to edit the string that displays and to set the
string's format. You could add a Value item to the Edit menu that brings up a small
dialog box for only the string and then create a Format menu with one item, Appearance,
that brings up the dialog box to set the appearance. The choice you are going to
see here, though, is to combine everything into one dialog box and then put it on
a new Tools menu, under the Options item.</P>


<BLOCKQUOTE>
	<P>
<HR>
<strong>NOTE:</strong> You may have noticed already that more and more Windows applications
	are standardizing Tools, Options as the place for miscellaneous settings.&#160; 
<HR>


</BLOCKQUOTE>

<P>Do you need to add the item to both menus? No. When there is no document open,
there is nowhere to save the changes made with this dialog box. So only IDR_SHOWSTTYPE
needs to have a menu added. Open the menu by double-clicking it in the ResourceView
window. At the far right of the menu, after Help, is an empty menu. Click it and
type <B>&amp;Tools</B>. The Properties dialog box appears; pin it to the background
by clicking the pushpin. The Caption box contains &amp;Tools. The menu at the end
becomes the Tools menu, with an empty item underneath it; another empty menu then
appears to the right of the Tools menu, as shown in Figure 8.4.</P>
<P><A HREF="javascript:popUp('08uvc04.gif')"><B>FIG. 8.4</B></A><B> </B><I>Adding
the Tools menu is easy in the ResourceView window.</I></P>
<P>Click the new Tools menu and drag it between the View and Window menus, corresponding
to the position of Tools in products like Developer Studio and Microsoft Word. Next,
click the empty sub-item. The Properties dialog box changes to show the blank properties
of this item; change the caption to <B>&amp;Options</B> and enter a sensible prompt,
as shown in Figure 8.5. The prompt will be shown on the status bar when the user
pauses the mouse over the menu item or moves the highlight over it with the cursor.</P>


<BLOCKQUOTE>
	<P>
<HR>
<strong>TIP:</strong> The <I>&amp;</I> in the Caption edit box precedes the letter that
	serves as the mnemonic key for selecting that menu with the keyboard (for example,
	Alt+T in the case of Tools). This letter appears underlined in the menu. There is
	no further work required on your part. You can opt to select a different mnemonic
	key by moving the <I>&amp;</I> so that it precedes a different letter in the menu
	or menu item name (for example, T&amp;ools changes the key from <I>T</I> to <I>o</I>).
	You should not use the same mnemonic letter for two menus or for two items on the
	same menu. 
<HR>


</BLOCKQUOTE>

<P>All menu items have a resource ID, and this resource ID is the way the menu items
are connected to your code. Developer Studio will choose a good one for you, but
it doesn't appear right away in the Properties dialog box. Click some other menu
item, and then click Options again; you see that the resource ID is ID_TOOLS_OPTIONS.
Alternatively, press Enter when you are finished, and the highlight moves down to
the empty menu item below Options. Press the up-arrow cursor key to return the highlight
to the Options item.</P>
<P>If you'd like to provide an accelerator, like the Ctrl+C for Edit, Copy that the
system provides, this is a good time to do it. Click the + next to Accelerator in
the ResourceView window and then double-click IDR_MAINFRAME, the only Accelerator
table in this application. At a glance, you can see what key combinations are already
in use. Ctrl+O is already taken, but Ctrl+T is available. To connect Ctrl+T to Tools,
Options, follow these steps:</P>
<P><A HREF="javascript:popUp('08uvc05.gif')"><B>FIG. 8.5</B></A><B> </B><I>The menu
command Tools, Options controls everything that ShowString does.</I></P>

<DL>
	<DD><B>1. </B>Click the empty line at the bottom of the Accelerator table. If you
	have closed the Properties dialog box, bring it back by choosing View, Properties
	and then pin it in place. (Alternatively, double-click the empty line to bring up
	the Properties dialog box.)
	<P>
	<DT></DT>
	<DD><B>2. </B>Click the drop-down list box labeled ID and choose ID_TOOLS_OPTIONS
	from the list, which is in alphabetical order. (There are a lot of entries before
	ID_TOOLS_OPTIONS; drag the elevator down to almost the bottom of the list or start
	typing the resource ID--by the time you type <B>ID_TO</B>, the highlight will be
	in the right place.)
	<P>
	<DT></DT>
	<DD><B>3. </B>Type <B>T</B> in the Key box; then make sure that the Ctrl check box
	is selected and that the Alt and Shift boxes are deselected. Alternatively, click
	the Next Key Typed button and then type <B>Ctrl+T</B>, and the dialog box will be
	filled in properly.
	<P>
	<DT></DT>
	<DD><B>4. </B>Click another line in the Accelerator table to commit the changes.
</DL>

<P>Figure 8.6 shows the Properties dialog box for this accelerator after again clicking
the newly entered line.</P>

<P>What happens when the user chooses this new menu item, Tools, Options? A dialog
box displays. So, tempting as it may be to start connecting this menu to code, it
makes more sense to build the dialog box first.</P>
<P>
<H2><A NAME="Heading5"></A>Building the ShowString Dialog Boxes</H2>
<P>Chapter 2, &quot;Dialogs and Controls,&quot; introduces dialog boxes. This section
builds on that background. ShowString is going to have two custom dialog boxes: one
brought up by Tools, Options and also an About dialog box. An About dialog box has
been provided by AppWizard, but it needs to be changed a little; you build the Options
dialog box from scratch.</P>
<P><A HREF="javascript:popUp('08uvc06.gif')"><B>FIG. 8.6</B></A><B> </B><I>Keyboard
accelerators are connected to resource IDs.</I></P>
<H3><I></I></H3>
<H3><A NAME="Heading6"></A>ShowString's About Dialog Box</H3>
<P>Figure 8.7 shows the About dialog box that AppWizard makes for you; it contains
the application name and the current year. To view the About dialog box for ShowString,
click the ResourceView tab in the project workspace window, expand the Dialogs list
by clicking the + icon next to the word <I>Dialogs</I>, and then double-click IDD_ABOUTBOX
to bring up the About dialog box resource.</P>
<P><A HREF="javascript:popUp('08uvc07.gif')"><B>FIG. 8.7</B></A><B> </B><I>AppWizard
makes an About dialog box for you.</I></P>
<P>You might want to add a company name to your About dialog box. Here's how to add
<B>Que Books</B>, as an example. Click the line of text that reads Copyright&#169;
1998, and it will be surrounded by a selection box. Bring up the Properties dialog
box, if it isn't up. Edit the caption to add <B>Que Books</B> at the end; the changes
are reflected immediately in the dialog box.</P>


<BLOCKQUOTE>
	<P>
<HR>
<strong>TIP:</strong> If the rulers you see in Figure 8.7 don't appear when you open IDD_ABOUTBOX
	in Developer Studio, you can turn them on by choosing Layout, Guide Settings and
	then selecting the Rulers and Guides radio button in the top half of the Guide Settings
	dialog box. 
<HR>


</BLOCKQUOTE>

<P>I decided to add a text string to remind users what book this application is from.
Here's how to do that:</P>

<DL>
	<DD><B>1. </B>Size the dialog box a little taller by clicking the whole dialog box
	to select it, clicking the sizing square in the middle of the bottom border, and
	dragging the bottom border down a little. (This visual editing is what gave Visual
	C++ its name when it first came out.)
	<P>
	<DT></DT>
	<DD><B>2. </B>In the floating toolbar called Controls, click the button labeled <I>Aa</I>
	to get a <I>static control,</I> which means a piece of text that the user cannot
	change, perfect for labels like this. Click within the dialog box under the other
	text to insert the static text there.
	<P>
	<DT></DT>
	<DD><B>3. </B>In the Properties dialog box, change the caption from Static to <B>Using
	Visual C++ 6</B>. The box automatically resizes to fit the text.
	<P>
	<DT></DT>
	<DD><B>4. </B>Hold down the Ctrl key and click the other two static text lines in
	the dialog box. Choose Layout, Align Controls, Left, which aligns the edges of the
	three selected controls. The one you select last stays still, and the others move
	to align with it.
	<P>
	<DT></DT>
	<DD><B>5. </B>Choose Layout, Space Evenly, Down. These menu options can save you
	a great deal of dragging, squinting at the screen, and then dragging again.
	<P>
</DL>

<P>The About dialog box will resemble Figure 8.8.</P>
<P><A HREF="javascript:popUp('08uvc08.gif')"><B>FIG. 8.8</B></A><B> </B><I>In a matter
of minutes, you can customize your About dialog box.</I></P>
<P>


<BLOCKQUOTE>
	<P>
<HR>
<strong>TIP:</strong> All the Layout menu items are on the Dialog toolbar. 
<HR>


</BLOCKQUOTE>

<H3><A NAME="Heading7"></A>ShowString's Options Dialog Box</H3>
<P>The Options dialog box is simple to build. First, make a new dialog box by choosing
Insert, Resource and then double-clicking Dialog. An empty dialog box called Dialog1
appears, with an OK button and a Cancel button, as shown in Figure 8.9.</P>
<P><A HREF="javascript:popUp('08uvc09.gif')"><B>FIG. 8.9</B></A><B> </B><I>A new
dialog box always has OK and Cancel buttons.</I></P>
<P>Next, follow these steps to convert the empty dialog box into the Options dialog
box:</P>

<DL>
	<DD><B>1. </B>Change the ID to <B>IDD_OPTIONS</B> and the caption to<B> Options</B>.
	<P>
	<DT></DT>
	<DD><B>2. </B>In the floating toolbar called Controls, click the button labeled ab|
	to get an edit box in which the user can enter the new value for the string. Click
	inside the dialog box to place the control and then change the ID to <B>IDC_OPTIONS_STRING</B>.
	(Control IDs should all start with IDC and then mention the name of their dialog
	box and an identifier that is unique to that dialog box.)
	<P>
	<DT></DT>
	<DD><B>3. </B>Drag the sizing squares to resize the edit box as wide as possible.
	<P>
	<DT></DT>
	<DD><B>4. </B>Add a static label above the edit box and change that caption to <B>String:</B>.
</DL>

<P>You will revisit this dialog box later, when adding the appearance capabilities,
but for now it's ready to be connected. It will look like Figure 8.10.</P>
<P><A HREF="javascript:popUp('08uvc10.gif')"><B>FIG. 8.10</B></A><B> </B><I>The Options
dialog box is the place to change the string.</I></P>
<P>
<H2><A NAME="Heading8"></A>Making the Menu Work</H2>
<P>When the user chooses Tools, Options, the Options dialog box should display. You
use ClassWizard to arrange for one of your functions to be called when the item is
chosen, and then you write the function, which creates an object of your dialog box
class and then displays it.</P>
<P>
<H3><A NAME="Heading9"></A>The Dialog Box Class</H3>
<P>ClassWizard makes the dialog box class for you. While the window displaying the
IDD_OPTIONS dialog box has focus, choose View, ClassWizard. ClassWizard realizes
there is not yet a class that corresponds to this dialog box and offers to create
one, as shown in Figure 8.11.</P>
<P><A HREF="javascript:popUp('08uvc11.gif')"><B>FIG. 8.11</B></A><B> </B><I>Create
a C++ class to go with the new dialog box.</I></P>
<P>Leave Create a New Class selected and then click OK. The New Class dialog box,
shown in Figure 8.12, appears.</P>
<P><A HREF="javascript:popUp('08uvc12.gif')"><B>FIG. 8.12</B></A><B> </B><I>The dialog
box class inherits from CDialog.</I></P>
<P>Fill in the dialog box as follows:</P>

<DL>
	<DD><B>1. </B>Choose a sensible name for the class, one that starts with C and contains
	the word Dialog; this example uses COptionsDialog.
	<P>
	<DT></DT>
	<DD><B>2. </B>The base class defaults to CDialog, which is perfect for this case.
	<P>
	<DT></DT>
	<DD><B>3. </B>Click OK to create the class.
	<P>
</DL>

<P>The ClassWizard dialog box has been waiting behind these other dialog boxes, and
now you use it. Click the Member Variables tab and connect IDC_OPTIONS_STRING to
a CString called m_string, just as you connected controls to member variables of
the dialog box class in Chapter 2. Click OK to close ClassWizard.</P>
<P>Perhaps you're curious about what code was created for you when ClassWizard made
the class. The header file is shown in Listing 8.5.</P>
<P>
<H4>Listing 8.5&#160;&#160;OPTIONSDIALOG.H--Header File for COptionsDialog</H4>
<PRE>// OptionsDialog.h : header file
//
/////////////////////////////////////////////////////////////////////////////
// COptionsDialog dialog
class COptionsDialog : public CDialog
{
// Construction
public:
    COptionsDialog(CWnd* pParent = NULL);   // standard constructor
// Dialog Data
    //{{AFX_DATA(COptionsDialog)
    enum { IDD = IDD_OPTIONS };
    CString     m_string;
    //}}AFX_DATA
// Overrides
    // ClassWizard generated virtual function overrides
    //{{AFX_VIRTUAL(COptionsDialog)
    protected:
    virtual void DoDataExchange(CDataExchange* pDX);    // DDX/DDV support
    //}}AFX_VIRTUAL
// Implementation
protected:
    // Generated message map functions